🚀 在 VS Code 中免費取得 ！

使用 Visual Studio Code 開發 Java Web 應用程式

本教學課程示範如何使用 Visual Studio Code 建立 Java Web 應用程式。您將學習如何將 Java Web 應用程式部署到 Azure App Service 中的 Linux Tomcat 伺服器。

情境

一個簡單的 Hello World Web 應用程式。

Greeting from Java

開始之前

在執行和部署此範例之前，您的本機開發環境中必須安裝 Java SE Development Kit (JDK) 和 Apache Maven 建置工具。如果沒有，請安裝它們。

下載並安裝 Java 擴充功能套件，其中包含 JDK 11。

注意：必須將 JAVA_HOME 環境變數設定為 JDK 的安裝位置，才能完成本教學課程。

下載 Apache Maven 3 或更新版本

下載 Apache Maven

為您的本機開發環境安裝 Apache Maven

安裝 Apache Maven

建立 Maven Web 應用程式專案

maven-archetype-webapp 是一個原型，用於產生 Maven Web 應用程式專案。若要深入了解，您可以造訪此文件。

  1. 在空白資料夾中，執行下列命令以從 Maven 原型產生新專案。
   mvn archetype:generate -DarchetypeGroupId=org.apache.maven.archetypes -DarchetypeArtifactId=maven-archetype-webapp -DarchetypeVersion=1.4

  1. Maven 會要求您提供完成部署專案產生所需的值。提示時請提供下列值

    提示 值 描述
    groupId com.webappproject 一個在所有專案中唯一識別您的專案的值，遵循 Java 的套件命名規則。
    artifactId webapp-project 一個沒有版本號碼的 jar 名稱值。
    version 1.0-SNAPSHOT 選擇預設值。
    package com.webappproject 產生函式程式碼的 Java 套件值。使用預設值。

  2. 輸入 Y 或按下 Enter 以確認。

    Maven 會在名為 artifactId 的新資料夾中建立專案檔案，在此範例中為 webapp-project。

  3. 導覽至專案資料夾

    cd webapp-project

將 Web 應用程式部署到雲端

我們剛建置了一個 Java Web 應用程式並在本機執行。現在您將學習如何從 Visual Studio Code 部署並在雲端中的 Azure 上執行。

如果您沒有 Azure 訂用帳戶，可以註冊一個免費 Azure 帳戶。

建立您的免費 Azure 帳戶

安裝 Azure App Service 擴充功能

Azure App Service 擴充功能用於建立、管理和部署到 Azure App Service，主要功能包括

  • 建立新的 Azure Web 應用程式/部署位置
  • 部署到 Azure Web 應用程式/部署位置
  • 啟動、停止和重新啟動 Azure Web 應用程式/部署位置
  • 檢視 Web 應用程式的記錄檔
  • 交換部署位置

若要安裝 Azure App Service 擴充功能，請開啟 [擴充功能] 檢視 (⇧⌘X (Windows、Linux Ctrl+Shift+X)) 並搜尋 azure app service 以篩選結果。選取 Microsoft Azure App Service 擴充功能。如需更著重命令列 Maven 的體驗，您也可以查看 適用於 Azure App Service Linux 教學課程的 Maven 外掛程式。

登入您的 Azure 訂用帳戶

若要登入 Azure，請從 [命令面板] (⇧⌘P (Windows、Linux Ctrl+Shift+P)) 執行Azure: 登入。或者，您可以按一下 [資源總管] 中的 [登入 Azure...] 來登入您的 Azure 帳戶。

Azure sign in code

在 Azure 上建立新的 Web 應用程式

安裝擴充功能後，您可以執行下列步驟在 Azure 上建立新的 Web 應用程式。

  1. 按一下 [資源總管] 檢視中的 [建立] 按鈕，然後選取 [建立 App Service Web 應用程式...]。

  2. 輸入新 Web 應用程式的唯一名稱。

  3. 選取 Web 應用程式的執行階段工作，例如 Java 17。

  4. 選取 Java Web 伺服器堆疊，例如 Apache Tomcat 10.0。

  5. 選取定價層，例如 免費 (F1)。

Create a Web App

建置並部署到 Web 應用程式

部署程序會利用 Azure Resources 擴充功能 (與 Azure App Service 擴充功能一起安裝作為相依性)，您需要使用您的 Azure 訂用帳戶登入。如果您沒有 Azure 訂用帳戶，立即註冊免費 30 天帳戶，並獲得 200 美元的 Azure 點數，以試用任何 Azure 服務組合。

登入後，您可以開啟命令提示字元或終端機視窗，並使用 Maven 命令建置專案。這會在 target 目錄中產生新的 war 或 jar 成品。

mvn clean package

建置專案後，在 VS Code 總管中開啟 target 目錄。在成品上按一下滑鼠右鍵，然後選擇 [部署至 Web 應用程式]，並依照提示選擇要部署的 Web 應用程式。

Deploy to Web App

開啟 VS Code 中的 [輸出] 視窗以檢視部署記錄。部署完成後，它會列印出您的 Web 應用程式的 URL。按一下連結以在瀏覽器中開啟它，您可以看到 Web 應用程式在 Azure 上執行！

Greeting from Spring Boot

注意： 如需 App Service 的更多進階功能，您可以查看 Azure App Service 擴充功能。

清除資源

  1. 若要刪除您的 Web 應用程式，請導覽至 [資源總管]，然後找到 [App Services] 項目。

  2. 在您要刪除的 Web 應用程式上按一下滑鼠右鍵，然後按一下 [刪除]。

Delete the Web App Resources

  1. 若要刪除您的應用程式服務方案或資源群組，請造訪 Azure 入口網站，並手動刪除您的訂用帳戶下的資源。

後續步驟

3/2/2023