共用方式為

建立及部署未定案的 Azure Web 應用程式

若要建立及部署樣板 Azure Web 應用程式，您需要建立及部署後端和前端 Web 應用程式。 本教學課程提供關於建立及部署樣板後端和前端 Web 應用程式的説明。

請務必先檢閱工作負載雲端設定教學課程，再部署後端和前端 Web 應用程式。

建立及部署樣板後端 Web 應用程式

  1. 在 Azure 入口網站 中，建立 Web 應用程式資源。

  2. 輸入或選取相關資訊：

    • 對於 [發佈]，選取 [程式碼]。
    • 針對 [執行階段堆疊]，選取 [.NET 7 (STS)] 和 [Windows]。

如需一般指示，請參閱開始使用 Azure App 服務。

將您的網域對應至後端 Web 應用程式

  1. 移至 [設定>自定義網域]。

  2. 選取 [ 新增自定義網域]，然後遵循指示。

    如需詳細資訊，請參閱 Azure 中的自定義網域對應。

  3. 在 Visual Studio 中，開啟您的後端重複使用方案。

  4. 以滑鼠右鍵按一下樣板專案，然後再選取 [發佈]。

  5. 針對目標，選取 [Azure]。

  6. 使用可存取您所建立的 Azure Web 應用程式的使用者身分登入。

  7. 使用UI找出相關的訂用帳戶和資源群組，然後依照指示發佈。

更新 CORS

  1. 在 Azure 入口網站 Web 應用程式的 [概觀] 窗格中，移至 [API>CORS]。
  2. 在 [允許的來源] 下，新增您的前端 Web 應用程式 URL。

建立和部署未定案前端 Web 應用程式

  1. 在 Azure 入口網站 中，建立 Web 應用程式資源。

  2. 輸入或選取相關資訊：

    • 對於 [發佈]，選取 [程式碼]。
    • 針對 [執行階段堆疊]，選取 [Node 18 LTS] 和 [Windows]。

如需一般指示，請參閱 Azure App Service 中的 Node.js 快速入門。

將您的網域對應至前端 Web 應用程式

  1. 移至 [設定>自定義網域]。
  2. 選取 [ 新增自定義網域]，然後遵循指示。

如需詳細資訊，請參閱 Azure 中的自定義網域對應。

發佈前端未定案 Web 應用程式

  1. 執行 npm run build:test 來組建前端樣板。
  2. 移至 Microsoft-Fabric-developer-sample\Frontend\tools\dist 資料夾。
  3. 選取下 dist的所有檔案和資產資料夾，然後建立所選檔案的.zip檔案。
  4. 開啟 PowerShell。
  5. 在 PowerShell 中，使用 Connect-AzAccount 可存取您所建立 Azure Web 應用程式的使用者執行並登入。
  6. 執行 Set-AzContext -Subscription "<subscription_id>"。
  7. 執行 Publish-AzWebApp -ResourceGroupName <resource_group_name> -Name <web_app_name> -ArchivePath <zip_file_path>。