今回は自分で作成したWebアプリをWebAppに配信する方法を解説します。
目次
Webアプリを作るための準備
まずは、配信するためのWebアプリを作成します。
Webアプリを開発するためには、開発環境をインストールしましょう。
Azureと連携しやすい「Visual Studio」をインストールします。
Visial Studioのインストール方法は、こちらのサイトを参考にして下さい。
https://qiita.com/Gaccho/items/1409c27216a67014a024
Visual Studioとは
Visual Studioとは、米マイクロソフト(Microsoft)社が開発・販売している、ソフトウェア開発のための統合開発環境(IDE:Integrated Development Environment)製品。コンピュータプログラムのソースコードを記述・編集するコードエディタを中心に、コンパイラやリンカ、デバッガなどプログラミングやソフトウェア開発に必要なツール類を統一的に利用できるようにしたパッケージソフト
(IT用語辞典より)
Visual Studioはアプリを開発するためのソフトだと思ってください。
開発言語はC#やPythonなどに対応しています。
Webアプリを作る
では、早速Webアプリを作っていきます。
今回は、Webアプリを作り、それをAzureのWebAppに配信することがメインなのでWebアプリはデフォルトのものを使います。
まずは、インストールしたVisual Studioを起動します。
そうすると、以下のような画面から「新しいプロジェクトの作成」をクリックします。
そして、プロジェクトのテンプレートを選択します。
何でもよいのですが、今回は「Flask Web プロジェクト」を使用します。
FlaskとはPythonのWebアプリケーションフレームワークで軽量なWebアプリを作成するときに使います。
「Flask Web プロジェクト」が表示されない場合は、「さらにツールと機能をインストールする」をクリックして、「Python開発」をインストールして下さい。
次の画面では、プロジェクトの名前と保存場所が聞かれますが、デフォルトのままで、「作成」をクリックします。
30秒後くらいにVisual Studioが立ち上がります。
これで、簡単なWebアプリの作成が完了しました。
画面上中央の再生ボタンか[F5]を押して、Webアプリを立ち上げてみましょう。
押したら、「No module named ‘flask’」とエラーが出てしまいました。
Flaskをインポートするのを忘れていました。
画面上の「python環境ウィンドを開きます」のアイコンをクリックしてから、パッケージの検索で「flask」と入力し、「次のコマンドを実行する:pip install flask」をクリックします。
そうするとFlaskのモジュールがインストールされます。
インストールが完了したら、画面上中央の再生ボタンか[F5]を押して、Webアプリを立ち上げます。今度こそ成功するはずです。
↓のような画面が立ち上がれば成功です。
AzureのWebAppにWebアプリを配信する
Webアプリを作成したら、次はWebAppに配信していきます。
Visual Studioのソリューションエクスプローラのプロジェクト名を右クリックして「発行」をクリックします。
すると、↓の画像のような画面が立ち上がります。
発行先の選択で「AppService」を選び「既存のものを選択」にチェックを入れ「発行」をクリックします。
事前にWebAppを作成していない場合は「新規作成」にチェックを入れます。
次にAzureアカウントのサインインです。
すでにアカウントをお持ちですか?の「サインイン」をクリックし、Azureの登録をしたアカウントでログインします。
サインインが完了するとそのアカウントで作成したリソースグループが表示され、その中にWebAppがあります。
配信したいWebAppを選択して「OK」をクリックします。
これで発行完了!
WebAppにアクセスしてみると・・・・・
あれ、WebAppのデフォルトページが表示されてしまった。
PythonのアプリをAzureに配信するためには追加の設定が必要
pythonのWebアプリ(Flask,Django,Bottle)を配信するためには追加でいろいろと設定する必要があります。初心者には厳しいかも。
詳しくはこちらのドキュメントを参考にして下さい。
https://docs.microsoft.com/ja-jp/visualstudio/python/publish-to-app-service-windows?view=vs-2019
うーん、マイクロソフトのドキュメントを見てもよく分からないですね。(笑)
次回の記事でAzureでFlaskを動作させる設定方法を解説していきます。
さいごに
今回の記事は自分で作成したWebアプリをWebAppに配信する方法を解説しました。
PythonアプリをAzureに配信するためには追加設定が必要と知らずにこの記事を書いてしまったせいで、最後にWebアプリにアクセスする部分が書ききれませんでした。すいません。
Python以外は特に追加設定いらないので、同じような流れでできると思います。