GitHub Actions を使って Azure Functions にデプロイする

ことの発端

いい加減、 VSCode の Azure Functions 機能拡張を使っての手動デプロイや止めようと思い、 GitHub Actions を使ってデプロイしようと試みるの巻。
本家の説明はこちら

この説明は結構アレだったので記事にしてみました。

資格情報を取得

Azure Portal で Functions の 概要 画面を表示し、画面上部の 発行プロファイルの取得 をクリックすると PublishSettings という長～い拡張子のファイルがダウンロードされます。

本家の説明では json になっていますが、こで取得できる資格情報は昔から xml です。

ストレージの準備（必要に応じて作成）

既に、開発しているシステム構成の中に ストレージアカウント が存在しているのであれば、それを間借りしても良いかもです。無ければ、 GitHub Actions 用の ストレージアカウント を作成します。

で、この ストレージアカウント の接続文字列をコピーしておきます。

アプリケーション設定

Azure Portal で Functions の 構成 画面を表示します。
ここで AzureWebJobsStorage が設定されていれば、以下の手順は不要です。

アプリケーション設定を追加

Azure Portal で Functions の 構成 画面を表示して ​新しいアプリケーション設定 をクリックします。

表示された画面にて 名前 を AzureWebJobsStorage とし、 値 は 先ほどの ストレージアカウント の接続文字列を設定します。

この設定により、 GithHb Actions を実行することで、 AzureWebJobsStorage に指定した ストレージアカウント の Blob に azure-webjobs-hosts と scm-releases というコンテナが生成されます。

GitHub で Secrets を設定

リポジトリの Settings > Secrets > New repository secret の順にクリックします。

すると、登録画面が表示されます。

Name を設定（後の yaml で登場）します。ちなみに、アンダースコアが使えるような説明がチラホラ散見するのですが、実際は使えません。（仕様変わったんかな？）
Value は先ほどの PublishSettings という長～い拡張子のファイルをエディタで開いて中身の xml をペーストします。
設定が終わったら、 Add secret を押下してこの画面は終了です。

スクリプトを作る

下準備は終わったので、これからビルドの設定を作って終わりです。

GitHub Actions は .github/workflows に yaml ファイルを配置することで実現しています。
で、ウチらは vue.js でフロントエンドを構成しているので、こんな感じの yaml を作りました。
肝は Azure/[email protected] の辺りです。
ちなみに、古い記事で Azure/functions-action@v1 となっているものがありますが、これが原因で２時間ほど闇を彷徨うことになりました。 Azure/[email protected] を使用しましょう。（v1.4はまだ使えないのかな？）

name: Functions app CI

env:
 ​FUNCTIONS_APP_NAME: "hogehoge__staging"
 ​NODE_VERSION: "14.16"

on:
 ​push:
   ​branches: [master]

jobs:
 ​build:
   ​runs-on: ubuntu-latest
   ​steps:
     ​- name: Checkout repository
       ​uses: actions/checkout@v2

     ​- name: Use Node.js ${{ env.NODE_VERSION }}
       ​uses: actions/setup-node@v2
       ​with:
         ​node-version: ${{ env.NODE_VERSION }}

     ​- name: npm install and build
       ​run: |
         ​npm install
         ​npm run build --if-present

     ​- name: 'Run Azure Functions Action'
       ​uses: Azure/[email protected]
       ​id: fa
       ​with:
         ​app-name: ${{ env.FUNCTIONS_APP_NAME }}
         ​package: .
         ​publish-profile: ${{ secrets.HOGEHOGE}}

注意事項

1. VSCode から手動デプロイをしてしまうと、Azure Functions の アプリケーション設定 に WEBSITE_XXXX... みたいな設定値が追加されます。すると、 GitHub Actions の実行時にエラーが発生するので、適宜、 WEBSITE_XXXX... を削除しましょう。（設定名にプリフィックス付けて、間違っていたら戻すというのもアリかもだけど、後で動作確認したら、ちゃんと消しといてね）

2. GitHub Actions にてデプロイを行った後に、 ストレージアカウント の azure-webjobs-hosts コンテナと scm-releases コンテナを削除してしまった場合、 azure-webjobs-hosts コンテナは次回の GitHub Actions で新規に作成しますが、 scm-releases コンテナは新規に作成してくれずエラーが発生します。　この場合、手動で scm-releases コンテナを作成することで解決します。