LoginSignup
0
0

More than 1 year has passed since last update.

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

Last updated at Posted at 2021-06-08

ことの発端

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

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

資格情報を取得

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

image.png

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

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

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

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

アプリケーション設定

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

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

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

image.png

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

image.png

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

GitHub で Secrets を設定

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

image.png

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

image.png

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

スクリプトを作る

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

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

.github/workflows/deploy.yml
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/functions-action@v1.3.1
       ​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 コンテナを作成することで解決します。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0