当社はIT技術のオンライン教育を得意としたセミナー専門会社です。 | 一戸英男

ITエンジニアの技術力UPをお約束します。

Vue.js:Python BottleからForm入力をJsonでPostしサーバから受信したJsonデータを表示する。

Vue.js:Python BottleからForm入力をJsonでPostしサーバから受信したJsonデータを表示する。


最近はJQueryからVue.jsの切り替えが多くなってきている。更に入力フォームもJSONでサーバにPOSTしてレスポンスをサーバから返ってきたJsonで表示を更新するケースが主流になってきています。WORDPRESSもAPI対応しているし、シングルページアプリケーション(SPA)なども流行りの中、このようなやり方をPython Bottleフレームワークで作る場合の基本的な実装方法について今回は掲載しようと思います。(このような仕組みを一般的にヘッドレスという。画面遷移させずにダイナミックにページを変化(更新)させるという意味合いでヘッドレスなのでしょう。ajaxでは定番ですが設計思想という観点でこのようなヘッドレスという用語ができたのだと思います。)やりようによってはテンプレートの開発・編集が単純化するためアプリケーションサーバをJSONのAPIサーバとして位置づけることもでき開発が非常にシンプルになります。

プロジェクトの作成

ファイルは全部で3種類用意します。WEBアプリのjsonform.py、Vueスクリプトのstatic/app.js、表示テンプレートのviews/form.htmlになります。予めフォルダーを作成し準備しましょう。

入力フォームの用意

formはシンプルに設置し後はVueの方に任せます。

pythonアプリの用意。

上記の コンテンツを表示するため、bottleを使ったpythonWEBアプリを用意します。細かい解説は省略します。

CORS(Cross-Origin Resource Sharing)によるクロスドメイン通信は今どきSSL通信でJSONのやり取りするなら、サーバ側のJSONを吐くアプリケーションでは必須でやらないと失敗します。予め調べて置いてくださいね。クライアント側はブラウザーの種類とバージョンによりけり。

FormをJsonで送出するVueのスクリプト

HTMLの表示制御を行うVueスクリプト。フォームの入力内容をsubmitボタンの押下をスキャンしjsonでデータをサーバに送出します。

アプリの起動

起動したらブラウザーからアクセスしてみましょう。URLは適当なサーバへインストールしてドメインを割り振っても良いですし、Linuxのローカルホストマシンでやっても良いと思います。例えばこんな感じで「http://localhost:3000/data/json-form」を入力します。

入力フォーム投稿前

入力フォーム投稿後の表示

curlでコンソールからテストする場合

タグ: , , , ,

Caddyソケット連携fastCGI + Python bottle FrameworkでWEBサーバ起動


Python BottleフレームワークをCaddyで連携してみる。ソケット経由での例を作ってみました。スクリプトタイプで接続するのでスレッドセーフな作りを心がけてpythonコーディングすればスクリプト側はマルチスレッドせずに連携できるはずです。つまりcaddy側でマルチスレッド通信を制御してくれるはず。通常連携する方法で一番簡単なのはリバースProxy接続なのですが今回はfastCGIでBottleフレームワークのアプリを連携する例をやってみました。今回はhttp仕様での例ですが、SSL証明書を登録すればHTTP2対応も簡単にできちゃいます。

flupを導入してfastcgi仕様でPython Bottleを連携(今回はソケット接続でやってみます。)

下記のようなソースコードapp.pyを用意します。

Caddy側の設定(fastCGIソケット仕様)

非常に設定がシンプルですね。

タグ: , , ,

Python3 Bottleフレームワーク入門(その13)- HTTP/2対応hproxで ReverseProxy SSL対応 & Bottle連携


最近は何かと話題のhttp/2対応のWEB接続がかなり増えてきました。オリジナルアプリケーションをフレームワークで作ったものをhttp2対応させる事もフレームワークのライブラリーに既に実装されているのもあり手軽になってきているとはいえ、まだまだ敷居が高いかもしれません。

今回は、非http2対応のウェブアプリをリバースプロキシーで簡単に対応させるサーバを紹介します。haskellベースのプロキシーですが簡単に構築できます。もちろん、Apache,nginx,h2o,Caddyでもできますができるだけ設定が単純なもので行きたいのでこれを使用しました。但しバーストのメモリ消費は多いみたいだ。

ソフトのダウンロード

hproxをgithubから取得します。

作成するとデフォルトで~/.local/bin/hproxにバイナリーが設置されます。.bashrcに環境変数PATHで追加登録しておきましょう。

使い方

Proxyサーバは8000番ポートでリッスン状態にします。http/2接続の場合は証明書は当然ですが必須です。h2オプションスイッチはありませんがSSL仕様にすると標準でhttp/2対応になるようになっています。証明書がなければ自動でhttp/1.1接続になります。後は末端にあるリバースプロキシー先のアプリサーバ設定を- -revで指定します。

ソースコード(test.py)

毎度のお決まりのソースコードですが。。。。python bottleのサーバで実験してみます。下記はシングルスレッドですが、実運用ではマルチスレッド対応のWSGIにしてpythonアプリサーバを動作させてください。

ブラウザーで確認するか、curlコマンドで確認してみましょう。

hproxの使えるオプション

このサーバはwebsocket接続のproxyにも対応しておりますので、- -wsで後方にあるwebsocketのサーバを指定すれば利用できます。



Python Bottle Framework入門 全13回
1.基礎編サーバ起動
2.リクエストメソッド
3.ORM Peewee (MySQL)
4.ORM Peewee CRUD
5.Cookie And Session
6.Abort and Redirect
7.マルチスレッドWEBサーバ
8.デーモン化
9.Json
10.WSGI on SSL
11.Apache連携起動(外部WSGI) SSL接続
12.Apache連携起動(ReverseProxy)SSL接続
13.hprox連携起動(ReverseProxy)SSL接続&HTTP2対応

合わせて読みたいPython MySQL操作関連

タグ: , , , , , ,

Python3 Bottleフレームワーク入門(その12)- ReverseProxy方式 Bottle連携SSL Apache起動


前回の章ではWSGI方式で行ったが今回はRverseProxy方式のApache連携を紹介する。ReverseProxy方式は透過型のProxyで内部で動作しているhttp方式のWEBサーバをお手軽に安全にラッピングしてくれる方式である。内部サーバのコンテンツ作りに不安があるならこの方式が良いと思います。また、内部のシステムが簡単にhttpsに置き換えられないなら、この方法で強引に変更できれば簡単にすみますね!非常に便利なリバースプロキシーです

転送先内部サーバー

いつものごとくありがちなサンプルコード。127.0.0.1で設定しておくと更に安全な接続になります。ローカルホストは外部から接続できませんので。

Apacheのリバースプロキシー設定

ほんのすこしだけ手を加えればリバースプロキシーになります。ProxyPassとProxyPassReverseの箇所だけです。Proxy先のpythonサーバ&プログラムはマルチスレッド通信でなおかつスレッドセーフなコーディングになっていることが前提です。

リバースプロキシー起動

サイトにアクセスする例

/hello/の後に任意の文字列を入れてください。ページボディに表示されます。

尚、予めテストサーバにIPアドレスを割り当て名前をWindowsのHostsに登録しておけば下記のように名前ベースのホスト名で実験ができます。



Python Bottle Framework入門 全13回
1.基礎編サーバ起動
2.リクエストメソッド
3.ORM Peewee (MySQL)
4.ORM Peewee CRUD
5.Cookie And Session
6.Abort and Redirect
7.マルチスレッドWEBサーバ
8.デーモン化
9.Json
10.WSGI on SSL
11.Apache連携起動(外部WSGI) SSL接続
12.Apache連携起動(ReverseProxy)SSL接続
13.hprox連携起動(ReverseProxy)SSL接続&HTTP2対応

合わせて読みたいPython MySQL操作関連

タグ: , , , , ,

Python3 Bottleフレームワーク入門(その11)- WSGI方式 Bottle連携SSL Apache起動


WEBサーバーでApacheと連携したいと思う人は多いと思います。いままで紹介していなかったので改めて見本を掲載したいと思います。ApacheとBottleの連携方法は2種類あります。1つはこれから紹介する外部WSGI連携とリバースプロキシーで対応する方法です。プログラミングでセキュリティに不安な人は後者が良い場合が多いかもしれません。同時アクセス数とパフォーマンスを重視するなら前者だと思います。


シンプルな起動メインコード

それでは最初にメインのソースコードを書いていきたいと思います。元々WSGI対応しているBottleですから記述はシンプルです。下記コードは直接Pythonコマンドで指定起動もOK。Apacheの場合はelse分岐の方で起動します。このファイルは取り敢えずindex.pyという名前にしておきましょう。

Apacheの仮想サーバ設定

/etc/httpd/conf.d/python.confとして配置した場合の記述です。これは仮想サーバの設定です。予めmod_wsgiはインストールしておいてください。

肝はWSGIDaemonProcessの部分です。スレッド関連のパラメータを記述していますがきちんと設定しましょうね。これを正しく設置しないとスレッドセーフにならない場合があるため要注意です。DoS攻撃されたらイチコロです。実勢のアクセス量にあわせてチューニングしてください。maximum-requestsはこの値を超えるとカレントプロセスが破棄され新プロセスが再作成されます。ごみメモリもクリアされます。WSGIDaemonProcessのpython-pathの値は自分の環境に合わせ設定してください。python-homeは仮想環境のときに使います。また仮想環境ではないが複数のpythonバージョンが存在するならpython-pathを明示的に使用します。python仮想環境を使って利用する場合はglobalで設定し起動すれば明示的な指定は不要かもしれません。

呼び出すpythonコードの中身を考慮しないで考えた場合はプロセス数とスレッドに関してはもし貴方がプログラムのコードをマルチに動作させることに自信がないのならまずはスレッドセーフにできるだけ安全確実なのはprocess数は任意としてthreadsは’1’にすることです。(もちろん複数のリクエストに対して競合が起きないようにしていないと論外ですよ。)proxy側と呼び出すpython側のプログラムがマルチプロセス・マルチスレッドでスレッドならApacheとpythonプログラムが適正なセッション数で処理できるようprocess&thredsを調整することもできます。つまり後方の呼び出されるプログラムがシングルスレッドなのか、マルチスレッドなのか、マルチプロセスマルチスレッドなのかで状況が違ってきます。それが分かりにくいならthreadsを’1’にしておくことが無難なのです。余裕があるならapacheとpythonアプリケーションのスレッドコネクションの生成の仕方を相互に見極めて調整してゆくと良いでしょう。スレッドの生成が相互に噛み合わないとプログラムが落ちてしまうので注意が必要です。テストに負荷テストのプログラムを使ってthredsやprocessの値を相互(apache側、python側の双方)に調整してゆくことでもっと本格的な設定が可能になります。

Apache起動

サイトにアクセスする例

/hello/の後に任意の文字列を入れてください。ページボディに表示されます。

尚、予めテストサーバにIPアドレスを割り当て名前をWindowsのHostsに登録しておけば下記のように名前ベースのホスト名で実験ができます。



Python Bottle Framework入門 全13回
1.基礎編サーバ起動
2.リクエストメソッド
3.ORM Peewee (MySQL)
4.ORM Peewee CRUD
5.Cookie And Session
6.Abort and Redirect
7.マルチスレッドWEBサーバ
8.デーモン化
9.Json
10.WSGI on SSL
11.Apache連携起動(外部WSGI) SSL接続
12.Apache連携起動(ReverseProxy)SSL接続
13.hprox連携起動(ReverseProxy)SSL接続&HTTP2対応

タグ: , , , , ,

1 2 3