この記事は、Deploying Dash to Google App Engine (© Jamie Phillips クリエイティブ・コモンズ・ライセンス(表示4.0 国際))を翻訳、一部改変して書いています。
Deploying Dash to Google App Engine
Flaskのデブロイする記事はちょこちょこ見るのですが、Dashの日本語記事がなかったため、自分の備忘用も兼ねて訳したものを残します。
開発環境は、Ubuntu 18.04.LTSです。
Step 1: 仮想環境の構築
$ cd ~
$ python3 -m venv .venvs/dash
構築後、仮想環境に入ります。
$ source .venvs/dash/bin/activate
Step 2: project folderのsetup
以下の様にフォルダ・ファイル構成にします。
.
┗ dash-gcp
┣ app.yaml
┣ main.py
┗ requirements.txt※
※ 次のStepで作成します。
$ mkdir dash-gcp
$ cd dash-gcp
$ touch app.yaml
$ touch main.py
Step 3: Dashをインストール&requirements.txtの作成
公式に従ってDashをインストールします。('19/5/7)
$ pip install dash==0.42.0
$ pip install dash-daq==0.1.0
Version 0.37.0以降は、dash-html-components等のインストール別途不要とのこと。
$ pip freeze > requirements.txt
元記事では、「requirements.txtに "pkg-resources==0.0.0"が含まれてて、エラーになるから削除してね!」とあったが私の環境では含まれていなかった。
Step 4:Dash appのビルド
今回は、公式の以下サンプルと同じものをmain.pyに編集します。
import dash
import dash_core_components as dcc
import dash_html_components as html
dash_app = dash.Dash()
app = dash_app.server
dash_app.layout = html.Div(children=[
html.H1(children='Hello Dash'),
html.Div(children='''
This is Dash running on Google App Engine.
'''),
dcc.Graph(
id='example-graph',
figure={
'data': [
{'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': 'SF'},
{'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': u'Montreal'},
],
'layout': {
'title': 'Dash Data Visualization'
}
}
)
])
if __name__ == '__main__':
dash_app.run_server(debug=True)
※ éはeに置き換えました。
保存したら、動作確認のためローカルで実行します。
$ python main.py
ブラウザから、http://localhost:8050/にアクセスし正しく動作しているか確認します。
Step 5:app.yamlの編集
app.yamlを開いて、以下の様に編集します。
runtime: python37
以上で準備が整ったので、次はいよいよデブロイです。
Step 6: Publishing to Google App Engine
デブロイにはGoogle Cloud SDKが必要なので、インストールしてない場合は、インストールします。
Let's deploy!
ロケーションとかは適当に好きなところを選んでください。
$ gcloud app deploy
You are creating an app for project [dash-gcp].
WARNING: Creating an App Engine application for a project is irreversible and the region
cannot be changed. More information about regions is at
<https://cloud.google.com/appengine/docs/locations>.
Please choose the region where you want your App Engine application located:
[1] asia-east2 (supports standard and flexible)
[2] asia-northeast1 (supports standard and flexible)
[3] asia-south1 (supports standard and flexible)
[4] australia-southeast1 (supports standard and flexible)
[5] europe-west (supports standard and flexible)
[6] europe-west2 (supports standard and flexible)
[7] europe-west3 (supports standard and flexible)
[8] northamerica-northeast1 (supports standard and flexible)
[9] southamerica-east1 (supports standard and flexible)
[10] us-central (supports standard and flexible)
[11] us-east1 (supports standard and flexible)
[12] us-east4 (supports standard and flexible)
[13] us-west2 (supports standard and flexible)
[14] cancel
Please enter your numeric choice: 11
Creating App Engine application in project [dash-gcp] and region [us-east1]....done.
Services to deploy:
descriptor: [~/code/dash-gcp/app.yaml]
source: [~/code/dash-gcp]
target project: [dash-gcp]
target service: [default]
target version: [20190223t141951]
target url: [https://dash-gcp.appspot.com]
Do you want to continue (Y/n)?
Beginning deployment of service [default]...
Created .gcloudignore file. See `gcloud topic gcloudignore` for details.
╔════════════════════════════════════════════════════════════╗
╠═ Uploading 3 files to Google Cloud Storage ═╣
╚════════════════════════════════════════════════════════════╝
File upload done.
Updating service [default]...failed.
ERROR: (gcloud.app.deploy) Error Response: [7] Access Not Configured. Cloud Build has not been used in project dash-gcp before or it is disabled. Enable it by visiting https://console.developers.google.com/apis/api/cloudbuild.googleapis.com/overview?project=dash-gcp then retry. If you enabled this API recently, wait a few minutes for the action to propagate to our systems and retry.
元記事だと、上記の様に「おや?」っとErrorが出たそうです。ただ、私の環境では、以下の様なエラーが出ました。
Updating service [default]...failed.
ERROR: (gcloud.app.deploy) Error Response: [7] Access Not Configured. Cloud Build has not been used in project denoleagc before or it is disabled. Enable it by visiting https://console.developers.google.com/apis/api/cloudbuild.googleapis.com/overview?project=denoleagc then retry. If you enabled this API recently, wait a few minutes for the action to propagate to our systems and retry.
APIが有効になってないとのことですので、記載してあるURLにアクセスして有効化しました。
その後、再度実行すると、以下の様な感じで無事実行できました。
$ gcloud app deploy
Services to deploy:
descriptor: [~/code/dash-gcp/app.yaml]
source: [~/code/dash-gcp]
target project: [dash-gcp]
target service: [default]
target version: [20190223t142211]
target url: [https://dash-gcp.appspot.com]
Do you want to continue (Y/n)? Y
Beginning deployment of service [default]...
╔════════════════════════════════════════════════════════════╗
╠═ Uploading 0 files to Google Cloud Storage ═╣
╚════════════════════════════════════════════════════════════╝
File upload done.
Updating service [default]...done.
Setting traffic split for service [default]...done.
Deployed service [default] to [https://dash-gcp.appspot.com]
You can stream logs from the command line by running:
$ gcloud app logs tail -s default
To view your application in the web browser run:
$ gcloud app browse
うまく動作していると以下のような画面が表示されます。
以上
最後まで読んでいただきありがとうございました。