Pythonで作成したWEBアプリをHeroku上にデプロイする

前回に引き続き、歩数収集APIの開発です。

前回までに歩数収集APIをローカル環境で動作させるところまで行ったので、今回はHeroku上で動作させてみます。

歩数収集APIその②（歩数で競う！GoogleNestHubアプリの開発）

WEB-APIの作成を通してPythonからPosgreSQLに接続する方法とPythonでWEBアプリを開発するときに用いられるflaskの使い方を紹介する。

Heroku上に環境を構築する
Herokuへ歩数収集APIをデプロイする。

Heroku上に環境を構築する

※ここからはHerokuの登録が完了している前提となります。まだの方は参照してください。

Herokuの登録

Herokuに登録してPythonで作成したWEBアプリが動作するところまでを紹介しています。

また、Heroku Postgresアドオン導入についてはご紹介しています。合わせて参考にしてください。

HerokuでPostgreSQL

Heroku Postgresを導入して接続まで行う

Herokuに新規アプリを登録する

Herokuにログインしてダッシュボードの右上のnewボタンをクリックし、Create new appをクリックします。

App nameを入力しCreate appボタンをクリックします。
※入力したアプリ名はメモっておいて下さい。

アプリが登録されました。

Settingタブをクリックし、App InfomationのHeroku git URLとDomainsのYour app can be found atの横のURLをメモっておいてください。

Heroku Postgresアドオンを導入する

Resourcesタブをクリックし、Add-onsの下の検索ボックスにpostgresと入力すると、Heroku Postgresが現れるのでそれをクリックしてください。

Planを聞いてくるので、Hobby Dev-Freeが選択された状態でSubmit Order Formボタンをクリックします。

無事登録できたら、Overviewタブをクリックし、Installed add-onsの下に表示されるDB名をメモっておいてください。

Heroku Postgres上にテーブルを作成する。

PowerShellを起動しHerokuにログインします。※heroku login -iとするとブラウザ認証ではなくPowerShell上でID（メアド）、パスワードを入力してログインできます。
※ xxxxxx@xxxxx.xxx はHeroku登録時のメアドを入力してください。デフォルト値が表示されるので、それでよければそのままEnterキーをクリックしてください。

PS C:\Users\User> heroku login -i
heroku: Enter your login credentials
Email [xxxxxx@xxxxx.xxx]:
Password: ************
Logged in as xxxxxx@xxxxx.xxx

PS C:\Users\User>

ログインに成功したらHeroku Postgresに接続します。
heroku pg:psql 【さきほどメモったDB名】 –app 【herokuのアプリ名】

PS C:\Users\User> heroku pg:psql 【さきほどメモったDB名】 --app 【herokuのアプリ名】
--> Connecting to 【さきほどメモったDB名】
psql (13.3、サーバ 13.4 (Ubuntu 13.4-4.pgdg20.04+1))
SSL 接続 (プロトコル: TLSv1.3、暗号化方式: TLS_AES_256_GCM_SHA384、ビット長: 256、圧縮: オフ)
"help"でヘルプを表示します。

【herokuのアプリ名】::DATABASE=>

Heroku Postgresに接続できたら、テーブルを作成します。

【herokuのアプリ名】::DATABASE=> CREATE TABLE step_hist_row (id serial PRIMARY KEY,user_name TEXT NOT NULL,step_date timestamp NOT NULL,step_count integer default 0, unique (user_name, step_date));
CREATE TABLE

【herokuのアプリ名】::DATABASE=>

ここまででDBの準備は完了です。

Herokuへ歩数収集APIをデプロイする。

Herokuへ歩数収集APIをデプロイします。

具体的にはHeroku上のリモートリポジトリにソースをプッシュすると、Heroku側でデプロイしてくれてWEB-APIとして公開されます。

準備

歩数収集APIその②で作成したmain.pyのあるディレクトリにファイルを２つ追加します。

一つ目はrequirements.txtで、下記の通り入力してください。

Flask==1.1.2
psycopg2==2.9.1

二つ目はProcfileで、下記の通り入力してください。

※ファイル名に拡張子をつけません。windowsで作業するときは拡張子を表示しておかないと勝手に.txtがついてたりします。

web: python main.py

main.pyを開いて一部修正します。

DSN= 'postgresql://postgres:password@localhost:5432/sampledb'
→
#DSN= 'postgresql://postgres:password@localhost:5432/sampledb'
DSN=os.environ["DATABASE_URL"]

これはHeroku上で環境変数として DATABASE_URL を設定してくれているので、それを読み込んで利用するためのものです。

試しに見てみましょう。

HerokuダッシュボードのSettingsタブをクリックし、Config VarsのReveal Config Varsボタンをクリックします。

KEY、VALUEの対で管理されています。
DATABASE_URLのVALUEとして接続文字列が管理されていることがわかります。

作成したファイルをgitで管理できるようにします。main.pyが保存されているディレクトリから他のファイル（sample.py等）が残っていたら削除するか他の場所に移動しておいてください。PowerShellを起動して main.pyが保存されているディレクトリに移動します。

gitコマンドを入力します。

PS C:\test> git init
Initialized empty Git repository in C:/test/.git/
PS C:\test> git add .
PS C:¥test> git commit -m "First commit"
[master (root-commit) b1b28ad] First commit
 3 files changed, 42 insertions(+)
 create mode 100644 Procfile
 create mode 100644 main.py
 create mode 100644 requirements.txt
PS C:\test>

Herokuをgitのリモートリポジトリとして登録

Herokuをgitのリモートリポジトリとして登録します。まずHerokuにログインします。

PS C:¥test> heroku login -i
heroku: Enter your login credentials
Email [xxxxxx@xxxxx.xxx]:
Password: ************
Logged in as xxxxxx@xxxx.xxx
PS C:\test>

次に下記コマンドを入力してリモートリポジトリを登録します
heroku git:remote -a 【アプリ名】※【アプリ名】は作成したアプリ名で読み替えてください。

PS C:\test> heroku git:remote -a 【アプリ名】
set git remote heroku to https://git.heroku.com/【アプリ名】.git
PS C:\test>

ここまでで準備完了。

Herokuにpushしてデプロイする。

gitコマンド git push heroku master を入力してHerokuに今回作成したWEBアプリをデプロイします。

PS C:¥test> git push heroku master
Enumerating objects: 5, done.
Counting objects: 100% (5/5), done.
Delta compression using up to 4 threads
Compressing objects: 100% (3/3), done.
Writing objects: 100% (5/5), 1008 bytes | 1008.00 KiB/s, done.
Total 5 (delta 0), reused 0 (delta 0), pack-reused 0
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Building on the Heroku-20 stack
中略
remote:        Released v5
remote:        https://【アプリ名】.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/【アプリ名】.git
 * [new branch]      master -> master
PS C:¥test>

HerokuダッシュボードのOvewViewを見るとDyno formationにweb python main.pyの記載があり、Webアプリとして登録されたことがわかります。
※表示されるまで時間差あるようなので、表示がない場合は時間をおいて何度かみてください。

動作確認

アプリのURL(https://【アプリ名】.herokuapp.com/)をクリックすると、前回と同じForm画面が表示されます。

username stepdate 　stepcount を入力して送信するをクリックします。

値の登録も成功したようです。

テーブルの中身も確認してみましょう。

【アプリ名】::DATABASE=> select * from step_hist_row;
 id | user_name |      step_date      | step_count
----+-----------+---------------------+------------
  1 | tanupapa  | 2021-10-12 00:00:00 |          5
(1 行)


【アプリ名】::DATABASE=>

ちゃんと書き込めたことが確認できました。

次回からはiPhoneの歩数データを歩数収集APIに送信する部分にとりかかります。

歩数収集APIその③（歩数で競う！GoogleNestHubアプリの開発）