Skip to main content
ドキュメントへの更新が頻繁に発行されており、このページの翻訳はまだ行われている場合があります。 最新の情報については、「英語のドキュメント」を参照してください。
現在、GitHub AE は限定的リリースです。

Azure App Service への Node.js のデプロイ

継続的デプロイ (CD) ワークフローの一部として、Node.js プロジェクトを Azure App Service にデプロイできます。

はじめに

このガイドでは、GitHub Actions を使用して、Node.js プロジェクトを作成、テスト、および Azure App Service にデプロイする方法について説明します。

前提条件

GitHub Actionsワークフローを作成する前に、まず以下のセットアップのステップを完了しておかなければなりません。

  1. Azure App Service プランを作成する。

    たとえば、Azure CLIを使って新しいApp Serviceのプランを作成できます。

    Shell
    az appservice plan create \
       --resource-group MY_RESOURCE_GROUP \
       --name MY_APP_SERVICE_PLAN \
       --is-linux

    上記のコマンドでは、MY_RESOURCE_GROUP を既存の Azure リソース グループに、MY_APP_SERVICE_PLAN を App Service プランの新しい名前に置き換えます。

    Azure CLI の使用に関する詳細については、Azure のドキュメントを参照してください。

  2. Web アプリを作成する。

    たとえば、Azure CLI を使用すると、Node.js ランタイムを持つ Azure App Service Web アプリを作成することができます。

    Shell
    az webapp create \
        --name MY_WEBAPP_NAME \
        --plan MY_APP_SERVICE_PLAN \
        --resource-group MY_RESOURCE_GROUP \
        --runtime "NODE|14-lts"

    上のコマンドで、パラメーターを独自の値に置き換えます。MY_WEBAPP_NAME は、その Web アプリの新しい名前です。

  3. Azure 発行プロファイルを構成し、AZURE_WEBAPP_PUBLISH_PROFILE シークレットを作成します。

    公開されたプロフィールを使って、Azureのデプロイ資格情報を生成してください。 詳細については、Azure ドキュメントの「デプロイ資格情報の生成」を参照してください。

    GitHub リポジトリで、発行プロファイルの内容を含む AZURE_WEBAPP_PUBLISH_PROFILE という名前のシークレットを作成してください。 シークレットの作成の詳細については、「暗号化されたシークレット」を参照してください。

  4. 必要に応じて、デプロイ環境を構成します。 環境は、一般的なデプロイ ターゲットを記述するために使用されます (例: productionstaging、または development)。 GitHub Actions ワークフローが環境にデプロイされると、その環境がリポジトリのメイン ページに表示されます。 環境を使用して、ジョブの続行に対する承認の要求、ワークフローをトリガーできるブランチの制限、シークレットへのアクセスの制限を実行できます。 環境の作成の詳細については、「デプロイに環境を使用する」を参照してください。

ワークフローの作成

必要な環境を整えたら、ワークフローの作成に進むことができます。

次のワークフローの例では、main ブランチへのプッシュがある場合に、Node.js プロジェクトを作成し、Azure App Service にデプロイする方法のデモを行います。

ワークフロー env キーの AZURE_WEBAPP_NAME は、必ず作成した Web アプリの名前に設定してください。 プロジェクトへのパスがリポジトリ ルートでない場合は、AZURE_WEBAPP_PACKAGE_PATH をプロジェクト パスに変更します。 10.x 以外の Node.js のバージョンを使用する場合、NODE_VERSION は、使用するバージョンに変更します。

デプロイ環境を構成した場合は、environment の値を環境の名前に変更します。 環境を構成しなかった場合 を使わない場合は、environment キーを削除します。

YAML
# このワークフローはGitHubによって認定されていないアクションを使用します。
# それらはサードパーティによって提供され、
# 別個の利用規約、プライバシーポリシー、
# ドキュメントを参照してください。

# GitHub では、コミット SHA にアクションをピン留めすることが推奨されます。
# 新しいバージョンを取得するには、SHA を更新する必要があります。
# タグまたはブランチを参照することもできますが、アクションは警告なしに変更される可能性があります。

on:
  push:
    branches:
      - main

env:
  AZURE_WEBAPP_NAME: MY_WEBAPP_NAME   # set this to your application's name
  AZURE_WEBAPP_PACKAGE_PATH: '.'      # set this to the path to your web app project, defaults to the repository root
  NODE_VERSION: '14.x'                # set this to the node version to use

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v2

    - name: Set up Node.js
      uses: actions/setup-node@v2
      with:
        node-version: ${{ env.NODE_VERSION }}
        cache: 'npm'

    - name: npm install, build, and test
      run: |
        npm install
        npm run build --if-present
        npm run test --if-present
    - name: Upload artifact for deployment job
      uses: actions/upload-artifact@v2
      with:
        name: node-app
        path: .

  deploy:
    runs-on: ubuntu-latest
    needs: build
    environment:
      name: 'production'
      url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}

    steps:
    - name: Download artifact from build job
      uses: actions/download-artifact@v2
      with:
        name: node-app

    - name: 'Deploy to Azure WebApp'
      id: deploy-to-webapp 
      uses: azure/webapps-deploy@0b651ed7546ecfc75024011f76944cb9b381ef1e
      with:
        app-name: ${{ env.AZURE_WEBAPP_NAME }}
        publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE }}
        package: ${{ env.AZURE_WEBAPP_PACKAGE_PATH }}

その他のリソース

以下のリソースも役に立つでしょう。