Flaskでテンプレート変更時にサーバーを自動的に再起動する

Flaskでテンプレートを変更した時に 自動でサーバーを再起動させる方法の紹介です。

Flaskは "Django" と二分する程の人気のWebフレームワークなので、
Pythonでプログラミングをする人は Flaskを使った経験がある人も多いかもしれません。

Flaskにはフレームワーク側で Debugモードが搭載されており、
ファイルを変更すると 自動的にサーバーが再起動しますが、テンプレート ( Jinja2 ) を変更しても
自動的に再起動されません。

っということで、テンプレートファイルが変更されても
Flaskの開発用サーバーが自動的に再起動されるように変更監視用のスクリプトを作りました。
 

・node.js + ライブラリを使って、Flaskでテンプレートを変更した時に自動でサーバーを再起動させる
 

node.js用のライブラリを使って再起動用のスクリプトを作成するので、
事前に'node.js'が導入されている必要があります。

導入したライブラリは下記の3つ
- fkill : プロセスを終了させる為のライブラリ  ( * 以前紹介した過去記事 )
- chokidar : フォルダを監視するライブラリ
- shelljs : シェルコマンドを実行させるライブラリ

# initialize
npm init
# install dependencies
npm install fkill --save-dev
npm install chokidar --save-dev
npm install shelljs --save-dev

続いて自動再起動用のスクリプト。Workflowは凄く単純で下記の4ステップです。

* サーバー自動再起動用スクリプトのWorkflow
1. 起動時に ' shelljs ' で Flaskサーバーの起動
2. ' chokidar ' で指定したフォルダ( templates )のイベントを監視
3. ' fkill '' でPythonプロセスの終了
4. ' shelljs ' で Flaskサーバーの再起動

プロジェクトルートに下記のスニペットの内容ファイルを作成します。
( * この例では 'watch.js')

// watch.js * deploy this to your project root
const fkill = require("fkill");
const chokidar = require("chokidar");
const shell = require("shelljs");

const command = "python app.py"; // サーバー起動コマンド
const target_folder = "./templates"; // 変更を監視するフォルダ
// 複数のフォルダを監視する場合
// const target_folder = ["./templates", "./static"]

let log = event => console.log("\x1b[42m%s\x1b[0m", "Changed: " + event);

chokidar
  .watch(target_folder, { ignored: /[\/\\]\./ })
  .on("ready", () => {
    // ファイルを実行した時の処理
    shell.exec(command, { async: true });
    //  2秒後に 'http://127.0.0.1:5000/' のページをブラウザで開く
    //  setTimeout(
    //  () =>
    //    shell.exec("open http://127.0.0.1:5000/", { async: true }),
    //  2000
    // );

  })
  .on("change", event => {
    // フォルダ内のファイルが変更された時の処理
    fkill("Python"); // Pythonプロセスの終了
    shell.exec(command, { async: true });
    log(event);
  });

# app.py
''' Flask側でdebugモードが有効になっている必要があります '''
if __name__ == "__main__":
    app.run(debug=True)

Pythonファイルが変更されば場合は、Flask側がサーバーの再起動、
テンプレート側が変更された場合は監視用スクリプトがサーバーを再起動させます。
( * chokidarにはファイルを追加や削除した時のイベントも用意されているので、必要があればイベントを追加する事ができます )

* 実際にスクリプトを起動させたビデオ ( 45秒 )

通常はFlaskの開発用サーバーを ' python app.py ' で起動させますが、node.js側で起動させます。

# flaskのサーバーが起動　( ctrl + c で終了)
node watch.js

ファイルを直接実行したくない場合は
' package.json 'の ' scripts ' 内にサーバーを実行させるコマンドを記述すると
' npm 'コマンドで起動させることが出来ます。
(  * package.json内のscripts内に "serve": "node watch.js" を追加しました )

{
  "name": "my-flask-test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "serve": "node watch.js"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "chokidar": "^1.6.1",
    "fkill": "^4.1.0",
    "shelljs": "^0.7.7"
  }
}

# flaskサーバーを起動
npm run serve

以上が Flaskでテンプレート変更時にもサーバーを再起動させる方法の紹介でした。

上記で説明した以外 ( watchdog等 ) にも方法はあると思いますが、
短くてシンプルなコードで記述出来ること、
フロントエンド用で'node.js'を導入しているプロジェクトが多いのでnode.jsを使いました。

Flask + フロントエンド用にnode.js導入しているプロジェクト等は、
開発が少し楽になるので ゼヒ×２参考にしてください！