#author("2020-08-13T07:59:34+00:00","","") #mynavi(Azureメモ) #setlinebreak(on); * 概要 [#dadf4db4] #html(<div class="pl10">) #TODO #html(</div>) * 目次 [#g9c9f576] #contents - 関連 -- [[Azureメモ]] - 参考 -- [[Microsoft ID プラットフォーム を使用したアプリのサインイン フロー>https://docs.microsoft.com/ja-jp/azure/active-directory/develop/app-sign-in-flow]] -- [[Microsoft ID プラットフォームを使用した認証と承認>https://docs.microsoft.com/ja-jp/azure/active-directory/develop/authentication-vs-authorization#authentication-and-authorization-using-microsoft-identity-platform]] -- [[Microsoft ID プラットフォームと OAuth 2.0 認証コード フロー>https://docs.microsoft.com/ja-jp/azure/active-directory/develop/v2-oauth2-auth-code-flow]] -- [[認証コード フローと暗黙的なフロー(Web Apps)>https://docs.microsoft.com/ja-jp/azure/active-directory/develop/v2-app-types#web-apps]] -- [[Azure AD OAuth2 authentication>https://grafana.com/docs/grafana/latest/auth/azuread/]] -- [[Microsoft ID プラットフォームと暗黙的な許可のフロー (暗黙的な許可フローの有効有効化)>https://docs.microsoft.com/ja-jp/azure/active-directory/develop/v2-oauth2-implicit-grant-flow#send-the-sign-in-request]] -- [[Azure Active Directory を使ってアプリケーションに対するグループ要求を構成する>https://docs.microsoft.com/ja-jp/azure/active-directory/hybrid/how-to-connect-fed-group-claims#configure-the-azure-ad-application-registration-for-group-attributes]] -- [[アプリケーションにアプリ ロールを追加してトークンで受け取る>https://docs.microsoft.com/ja-jp/azure/active-directory/develop/howto-add-app-roles-in-azure-ad-apps]] * ADアプリ 及び シークレットの作成 [#m5cf0c30] #html(<div class="pl10">) App Service のアプリ(Grafana)を作成後でもシークレットの作成は可能だが、 結局は grafana.ini を変更して再デプロイが必要になるので、先に ADアプリ 及び シークレットは別アプリとして作成しておく。 #html(){{ <style> .images div { vertical-align: top; margin-right: 20px; } .images img { border: 1px solid #333; } </style> }} #html(<div class="images">) #html(<div class="ib">) [Active Directory] を選択 &ref(create_secret1-1.png,nolink); #html(</div><div class="ib">) [アプリの登録] を選択 &ref(create_secret1-2.png,nolink); #html(</div><div class="ib">) [新規登録] を選択 &ref(create_secret1-3.png,nolink); #html(</div><div class="ib">) アプリケーション名を入力して登録 &ref(create_secret1-4.png,nolink); #html(</div><div class="ib">) クライアントID 及び テナントID を確認しておく &ref(create_secret1-5.png,nolink); #html(</div><div class="ib">) [証明書とシークレット] → [新しいクライアントシークレット] を選択 &ref(create_secret1-6.png,nolink); #html(</div><div class="ib">) 説明を入力して [追加] &ref(create_secret1-7.png,nolink); #html(</div><div class="ib">) 登録したクライアントシークレットを確認しておく。(追加直後しか確認できないので注意) &ref(create_secret1-8.png,nolink); #html(</div><div class="ib">) [認証] → [プラットフォームの追加] &ref(create_secret1-9.png,nolink); #html(</div><div class="">) #html(<div class="ib">) リダイレクトURI 等を登録する。 &ref(create_secret1-10.png,nolink); #html(</div><div class="ib">) | 項目 | 設定値 |h | リダイレクトURI | https://Grafanaアプリケーション名.azurewebsites.net/login/azuread | | ログアウトURL| https://Grafanaアプリケーション名.azurewebsites.net/logout | | 暗黙的な許可フロー | シークレットを 他の Service App と共用する場合は2つともチェックを入れておく | ※ Grafanaアプリケーション名は 後述の 0_env.sh の $webappName と同じもの。 #html(</div>) #html(</div>) #html(</div>) ** アプリケーションロールの作成 [#qfb72dfa] #html(<div class="pl10">) 左側メニューの [マニフェスト] から、登録したアプリケーションのマニフェストを以下の通り更新する(アプリケーションロールの追加) ※ユニークIDは uuidgen 等を使用して3つ生成しておく。 ※ https://grafana.com/docs/grafana/latest/auth/azuread/ #mycode2(){{ : "appRoles": [ { "allowedMemberTypes": [ "User" ], "description": "Grafana Editor Users", "displayName": "Grafana Editor", "id": "ユニークなID", "isEnabled": true, "lang": null, "origin": "Application", "value": "Editor" }, { "allowedMemberTypes": [ "User" ], "description": "Grafana read only Users", "displayName": "Grafana Viewer", "id": "ユニークなID", "isEnabled": true, "lang": null, "origin": "Application", "value": "Viewer" }, { "allowedMemberTypes": [ "User" ], "description": "Grafana admin Users", "displayName": "Grafana Admin", "id": "ユニークなID", "isEnabled": true, "lang": null, "origin": "Application", "value": "Admin" } ], : "groupMembershipClaims": "ApplicationGroup", : }} #html(</div>) #html(</div>) // ADアプリ 及び シークレットの作成 * ユーザ作成 及び ロールの割当 [#f573268d] #html(<div class="pl10">) ** ユーザの作成 [#d6279ac1] #html(<div class="pl10">) [Azure Active Directory] → [ユーザ] から下図の通りユーザを登録。 #html(<div class="ib border">) &ref(create-users.png,nolink); #html(</div>) #html(</div>) ** ロールの割り当て [#jdcb9361] #html(<div class="pl10">) [Azure Active Directory] → [エンタープライズ アプリケーション] から対象のアプリを選択後に [ユーザーとグループ] を選択して、ユーザにアプリケーションロールを割り当てる。 ※デフォルトで Viewer権限 になるので、割り当てるのは Admin と Editor に該当するユーザだけでOK。 #html(<div class="ib border">) &ref(attach_role.png,nolink); #html(</div>) #html(</div>) #html(</div>) * リソースの作成 [#p10153b6] #html(<div class="pl10">) ** ファイル作成 [#r711498e] #html(<div class="pl10">) #html(){{ <div id="tabs1"> <ul> <li><a href="#tabs1-1">0_env.sh</a></li> <li><a href="#tabs1-2">1_resources.sh</a></li> <li><a href="#tabs1-3">Dockerfile</a></li> <li><a href="#tabs1-0">grafana.ini</a></li> </ul> }} // START tabs1-1 #html(<div id="tabs1-1">) 0_env.sh #mycode2(){{ #!/bin/bash PREFIX="各リソース名に付ける接頭文字" # リソースグループ resourceGroup=${PREFIX}Resources # リージョン region=japanwest # レジストリ名 registryName=${PREFIX}registry # Dockerイメージ名 imageName=${PREFIX}-grafana # ADアプリ名(認証用) adAppName=${PREFIX}-apps # Grafanaアプリ名 webappName=${PREFIX}-grafana }} #html(</div>) // END tabs1-1 // START tabs1-2 #html(<div id="tabs1-2">) #mycode2(){{ #!/bin/bash # リソース名の読み込み source 0_env.sh # リソース作成 if [ "$1" == "--create" ]; then # リソースグループの作成 echo group create az group create --name $resourceGroup --location $region # コンテナレジストリ作成 echo "acr create" az acr create -n $registryName -g $resourceGroup --sku standard --admin-enabled true # レジストリユーザ名/パスワード取得 acr_credential="`az acr credential show --name $registryName -o table | tail -1`" registryUser="`echo "$acr_credential" | awk '{print $1}'`" registryPwd="`echo "$acr_credential" | awk '{print $2}'`" # イメージのプッシュ echo "acr build" az acr build --registry $registryName --image $imageName . # App Service アプリ作成(Grafana) echo "create appservice plan and webapp" az appservice plan create -n ${webappName}-plan -g $resourceGroup --is-linux --sku B1 az webapp create -g $resourceGroup -p ${webappName}-plan -n $webappName \ --deployment-container-image-name ${registryName}.azurecr.io/${imageName}:latest # コンテナの構成/デプロイ(Grafana) echo "configure web app from Azure Container Registry" az webapp config container set \ --resource-group $resourceGroup --name $webappName \ --docker-registry-server-url http://${registryName}.azurecr.io \ --docker-registry-server-user ${registryUser} \ --docker-registry-server-password ${registryPwd} \ --docker-custom-image-name ${registryName}.azurecr.io/${imageName}:latest echo "Application URL: https://${webappName}.azurewebsites.net" fi # リソース削除 if [ "$1" == "--delete" ]; then echo group delete az group delete --name $resourceGroup fi }} #html(</div>) // END tabs1-2 // START tabs1-3 #html(<div id="tabs1-3">) #mycode2(){{ FROM grafana/grafana:7.1.1 COPY grafana.ini /etc/grafana/grafana.ini }} #html(</div>) // END tabs1-3 // START tabs1-0 #html(<div id="tabs1-0">) grafana.ini を以下の通り編集する。 ※テンプレートは https://github.com/grafana/grafana/blob/master/conf/sample.ini 等から取得。 #mycode2(){{ [server] : root_url = https://Grafanaアプリケーション名.azurewebsites.net : [auth.azuread] name = Azure AD enabled = true client_id = クライアントID client_secret = クライアントシークレット auth_url = https://login.microsoftonline.com/テナントID/oauth2/v2.0/authorize token_url = https://login.microsoftonline.com/テナントID/oauth2/v2.0/token }} ※Grafanaアプリケーション名 は 0_env.sh で設定している $webappName。 #html(</div>) // END tabs1-0 #html(</div>) // END tabs1 #html(<script>$(function() { $("#tabs1").tabs(); });</script>) #html(</div>) ** リソース作成 [#w558c42c] #html(<div class="pl10">) #myterm2(){{ ./1_resources.sh --create }} #html(</div>) #html(</div>) * 動作確認 [#ka88153d] #html(<div class="pl10">) ブラウザから https://Grafanaアプリケーション名.azurewebsites.net にアクセスして動作確認を行う。 #html(<div class="images">) #html(<div class="ib">) 試しに Adminロールを割り当てたユーザでログインしてみる。 &ref(grafana-login1.png,nolink); #html(</div><div class="ib">) &ref(grafana-login2.png,nolink); #html(</div><div class="ib">) &ref(grafana-login3.png,nolink); #html(</div><div class="ib">) &ref(grafana-login4.png,nolink); #html(</div><div class="ib">) Admin 権限でログインされている事を確認。 &ref(grafana-login5.png,nolink); #html(</div>) #html(</div>) #html(</div>) * 補足 [#t61a4455] #html(<div class="pl10">) いちいち [Sign in with Microsoft] を押すのが面倒なのでプロキシを噛ませてHTTPヘッダで認証できないかやってみたが、 Grafana の Auth Proxy は ロールマッピングには対応していない模様。 https://grafana.com/docs/grafana/latest/auth/overview/ #html(</div>)