search
LoginSignup
5

More than 1 year has passed since last update.

posted at

updated at

秒速でAzureにWEBアプリをデプロイする【忙しい人のためのAzure+Flask入門】

会社に入ってからのJavaでの新人研修以来WEBアプリの開発なんてしてこなかったインフラエンジニアの私が、秒速で(ちょっと古い)チュートリアル:Visual Studio Code から Azure App Service on Linux に Python アプリをデプロイするを実施して詰まったところや面白いことをまとめてQiitaの記事にしてみます。

チュートリアル通り進めてみる

本アドベントカレンダーには以下のように書いてありました。

Azure App Serviceと呼ばれるPaaSを使ってWebアプリをサクッと作ってデプロイすることが出来ます。

サクッとデプロイできてしかもAzure Machine Learningとかなんか楽しそう!な感じだったので、やってみることにしました。
チュートリアルは7つの項目を順番に進めていけばVSCodeでAzureへのアプリのデプロイを試すことが出来るように構成されています。以下で実際にやってみます。

evidence_000.JPG

まず、Azure アカウントを用意したあとに
以下をインストールします。

  • Python 3.7
  • Visual Studio Code

そしてVSCodeの拡張機能でPython 拡張機能Azure App Service 拡張機能をインストールします。
この辺りは脳死でできました。

evidence_004.JPG
Azureのアカウントを作ると上図のような何やら楽しそうな画面が表示されます。
が、時間がないので先に進みます。

手順2でいきなり詰まる

手順2に進むと早速詰まってしまいました
evidence_008.JPG

何やら.venv\scripts\activateを打つと赤いエラーが出ました。ごにょごにょして解決して先に進みます。(後述)

因みにこの手順ではアプリの準備として3つの選択肢が用意されていますが、私は「オプション 3:最小限の Flask アプリを作成する」を選択しました。これが一番楽そうでした。

そして「3:Visual Studio Code から App Service を作成する」を言われた通りおとなしく実行します。時間がないので、(省略可)となっているところは飛ばします。
ここまでやると以下のような「ねえ、Python開発者!」ページが表示されます。
evidence_011.JPG

手順4はやらなくてよさそうだけどやる

次に「4:Azure App Service の Python アプリ用のカスタム スタートアップ ファイルを構成する」を実施します。
カスタムスタートアップファイル とあるので「別にやらなくてもいいのかな?」と思ってしまいますが、やらないと動きません。
このページは結局どれを入れたらいいのか迷う方もいるかもしれませんが、ここまで同じ手順を踏んでいれば
gunicorn --bind=0.0.0.0 --timeout 600 hello:myapp を入れればよいです。

そして「5:Azure App Service on Linux に Python Web アプリをデプロイする」の通り進めてデプロイします。
手順4をやっていないといくら画面を更新しても「ねえ、Python開発者!」ページが表示されたままです。

そして作ったアプリを消し去る・・・

ログを見ている暇は無いので手順6は飛ばして手順7を実行してアプリを消し去ります。
ここの手順は少しわかりづらいですが、以下のように消します。
evidence_021.JPG
左側のメニューバーを開き「リソースグループ」をクリックします。

evidence_022.JPG
すると先ほど作成したリソースグループの中にいろいろ出来上がっていると思うので、すべて選択して、「削除」をクリックします。

これでチュートリアルがすべて完了しました。
本当にサクッと終了しました・・・

詰まったところなどまとめ

.venv\scripts\activateでエラー

インフラエンジニアをやっていると秒でわかるのですが、これはPowerShellのExcutionPolicyのエラーです。
Windows限定かと思います。PowerShellのスクリプトはfilename.ps1などという名前で保存しますが、これを実行するにはExecutionPolicyを設定する必要があります。
管理者権限があれば(おそらくUACもスルー出来る必要がある) Set-ExecutionPolicy -ExecutionPolicy RemoteSignedと打ちましょう。
それでもアクセスが拒否されましたとか言われたら上記のコマンドにさらに-Scope CurrentUserをつけましょう。

オプション 3:最小限の Flask アプリを作成する

手順2では単純にFlaskのテスト用のアプリを作る必要があるのですが、Webアプリの知識が無かったりFlask触ったことない人はおとなしくオプション3を実施してみましょう。
私のように変にオプション 1: VS Code Flask チュートリアル サンプルを使用するをやろうとするとルーティングやflaskの環境変数などの仕組みを理解していないために30分ほど時間を無駄にします。

Chromeの自動翻訳は消した方が良さそう

現役でWEBの開発をやっている方からすると当たり前なのかもしれませんが、Chromeの自動翻訳は開発してるアプリにたいしては翻訳しない設定にしておいたほうが良さそうです。
そうしないとねえ、Python開発者!などに勝手に翻訳されてしまいます。

やってみてわかった面白そうなこと

今回Azureを初めて触ってみました。
実際やってみる中で、Azureのクイックスタートセンター画面を開いてみると、何やらいろいろ楽しそうなことが出来そうな気がしてきます。
特にApp Serviceの画面を開くと、他にどんなことが出来るのか何となくアイディアがわいてきます。

この短時間で、Python+FlaskでWEBアプリをAzure上にデプロイするまでの流れを体験することが出来ました。
かなり簡単だったので、実際に何かサービスを作ってデプロイして今度はゆっくりそのアプリについて記事にしようと思います。

※秒とはいきませんでしたが、チュートリアルを始めてからこの記事を投稿するまで2時間半でできました。本当にサクッとデプロイできました。

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
What you can do with signing up
5