見出し画像

【GCP】VM上にWebサーバーを構築する、その2

VM借りてSQLサーバー設置した上に

Webサーバーも立てて

さてAPIをリリースしていきます。

ローカルでコードを書き書きする

準備:
・プロジェクトフォルダ(yuccoとする)を作って、GitHubに公開しておく。
・プロジェクトフォルダ内に仮想環境を作っておく
・仮想環境フォルダを.gitignoreに登録してgitの管理から外しておく

# server.py
from flask import Flask, jsonify

app = Flask(__name__)
app.config["JSON_AS_ASCII"] = False
app.config["JSON_SORT_KEYS"] = False

@app.route('/')
def index():
    return jsonifiy({ 'status':200, 'message': '接続に成功しました'})
# wsgi.py
from server import app
if __name__ == "__main__":
    app.run()

とりあえず最低限これだけあればアクセステストは可能。
後でこっから裏側の必要な機能はモリモリ作り込んでください。

Flaskが要るので

$ pip install Flask

しておく。
そしたら

$ pip freeze

して、インストールされているモジュールの一覧を表示して、requirements.txtと言う名前でプロジェクトフォルダに入れておく。

ここまで出来たら、GitHubリポジトリにpushしておく。
本当はリリース用のブランチを用意しておくといいけど、今はひとまずmainブランチをリリース用に使います。

VM上でGitCloneする

ブラウザで、GitHub上のリポジトリを開いて、Codeタブの中にある緑色のCodeボタンを押す→SSHタブを開いて、SSHアクセス用のアドレスをコピー。

VMにSSH接続して、

$ git clone REPOSITORY_ADDRESS

すればリポジトリがクローンされます。よしよし。

pip install -r requirements.txt する

仮想環境の中身はgitの管理から外してあるので、作っておいたrequiremens.txtを使って必要なモジュールをインストールします。

VM上で、プロジェクトフォルダ内へ移動して、

$python3 -m venv .venv

を実行して仮想環境を作ります。それから

$source .venv/bin/activate

して仮想環境を有効化。

$ pip install -r requirements.txt

して、必要なモジュールを一括インストールします。

リバースプロキシを設定する

Nginxをリバースプロキシサーバーとして設定します。

サービスファイルを作る

sudo vi /etc/systemd/system/yucco.service

して、サービスファイルを作ります。
中身はこう

[Unit]
Description=Gunicorn instance to serv [PROJECT]
After=network.target

[Service]
User=ubuntu
Group=www-data
WorkingDirectory=/home/ubuntu/yucco
Environment="PATH=/home/ubuntu/yucco/.venv/bin"
ExecStart=/home/ubuntu/yucco/.venv/bin/gunicorn --workers 3 --bind unix:yucco.sock -m 007 wsgi:app

[Install]
WantedBy=multi-user.target

「/home/ubuntu/yucco」の部分は、実際のVM上のプロジェクトフォルダのパスを入力します。プロジェクトフォルダのパスを確かめるには、

$ cd ~
$ readlink PROJECT_DIRECTORY

すればパスが取れます。
.venvの部分は自分で作った仮想環境フォルダの名前。

Gunicornサービスを起動

$ sudo systemctl start yucco
$ systemctl status yucco
$ sudo systemctl enable yucco

して、動く事を確認します。

ここで上手く動かずに「yucco.sock」ファイルがありません的なエラーで怒られていた場合、プロジェクトフォルダの書き込み権限を確認します。

Nginxの設定ファイルを編集

$ cd /etc/nginx/sites-available
$ sudo cp default yucco
$ sudo vi yucco

Nginxの設定ファイルが入っているフォルダに移動して、defaultファイルをコピーしてプロジェクト名のファイルを作ります。
で、ファイルを開いて編集します。

Certbotが追記してくれた行だけを残して後は消します。
それから、

server{
    listen[::]:443 ssl ipv6only=on;
    listen 443 ssl;
...}

で始まっているブロックを探し、

server{
    listen[::]:443 ssl ipv6only=on;
    listen 443 ssl;
    server_name yucco.example.com
...

    location / {
        include proxy_params;
        proxy_pass http://unix:/home/ubuntu/yucco/yucco.sock;
    }
}

を追記します。

Nginxの設定を切り替えて再起動

$ sudo rm /etc/nginx/sites-enabled/default
$ sudo ln -s /etc/nginx/sites-available/yucco /etc/nginx/sites-enabled/default

$ sudo nginx -t

$ sudo systemctl restart nginx

ここまでやると、ブラウザでアクセスしたときにFlaskで指定したJSONが帰ってくるようになる。お疲れさまでした。

VMを再起動する時にやること

VMを再起動した場合、特に何も設定をしない場合、自動でサービスが起動することはないので

$ sudo systemctl start yucco
$ systemctl status yucco
$ sudo systemctl enable yucco

でサービスを起動する。
自動起動するようにするのはまた……追ってやる……

この記事が気に入ったらサポートをしてみませんか?