2020-05-24responderとsqlite3で簡単なウェブサイトを作ってみたりsellPython,SQL,SQLite3,jinja2,responder最近「Nuxt.jsとPythonで作る!ぬるさくAIアプリ開発入門」という本を読んで、その本でかなり新しいpythonのウェブフレームワークであるresponderが紹介されているので興味を持ってもっと調べて色々勉強した後、簡単なウェブサイトを作ってみたいと思います。今回の目標のサイトは、SQLデータベースと接続して、データを表示したり、追加したり、更新したり、削除したりすることができるサイトです。データベースは一番簡単であるsqlite3を使います。使うモジュールについて本の他に、responderとsqlite3の使い方については色んな方の記事を読みました。WebSocketで簡易チャットアプリPython+ResponderでWEBアプリケーションを構築する。PythonPythonでsqliteこれらの記事はとても参考になったので、ここでは基本な使い方については省略します。準備データベースは簡単のためにSQLiteにします。SQLiteは実際のサイトを作る時にはあまり向いていないが、MySQLやPostgreSQLとは違って、SQLiteは特にインストールする必要なく、最初からついているから便利です。使うpythonモジュールは主にresponderとsqlite3だけです。sqlite3はpythonの標準モジュールなので、インストールする必要があるのはresponderだけ。responderの公式サイトではpipenvを使うと言われていますが、普通のpipでも簡単にインストールできます。responder機能このような簡単なウェブサイトを作ります。integer今回の目標はただちゃんとデータベースに接続してやり取りできることを確認したいだけなので、簡単のために2列しかないテーブルにします。(namae))ファイルサイトは全部ただこの5つのファイルから成されます。.htmlファイルはjinja2テンプレートです。jinja2は今まで使ったことはないが、ちょっとdjangoのテンプレートと似ています。ちなみにファイルの名前は見ての通り「とある魔術の禁書目録」からです。スタイルシート環境OSやとpythonとresponderのバージョンが違ってもあまり問題ないと思いますが一応今回で試した時の環境を書いておきます。0.12.13コード次は各ファイルの中のコードの説明。htmlテンプレートjinja2テンプレートのhtmlファイルindex.htmlまずはインデックスページ。データをダウンロードするリンクがあります。toaru.html次は、とあるキャラのデータを表示したり編集したりするページ。インデックスに戻るリンクno.htmlそして、何かの間違いが起きたら出るページ。インデックスへ戻るリンクしかない。-~</a></body>python魔術を使ってサイトの全てを操るファイルです。大きいサイトなら色々なファイルに分解するべきかもしれませんが、今回は小さいサイトなので、分ける必要なく一つのファイルにします。全部のルートのコントローラーと、データベースに接続するコードは全てここに書いてあります。api.run()ルートは7つありますが、実際にテンプレートを使うの'/''/toaru/{namae}''/no'3つだけ。それに加えて'/insert''/update/{namae0}''/delete/{namae}'これらはデータベースとのやり取りをして他のページにリダイレクトするのです。'/insert'と'/update/{namae0}'のページはフォームからのデータを受け取る必要があってawaitが使われるのでasync関数にしています。pythonのasyncとawaitについては最近勉強したばかりです。asyncioresponderを使う時に、例え私達は直接asyncとawaitを書かなくても、そもそもresponderの中ではasyncとawaitで動く関数がいっぱいなので、非同期処理について理解しておいたらとても役に立ちます。最後に、'/download'はデータベースの中の全部のデータをjsonファイルに保存するためのページです。サーバを実行する時にデータベースは作成されます。その後はデータベースを収めるファイル(ここではdedicatus545.dbという名前)が現れます。'/librorum'templates_dirはテンプレートのあるフォルダ。デフォルトではtemplatesというフォルダにありますが、今回はフォルダを使わないので'.'に指定します。static_dirは静的ファイルのあるフォルダ。デフォルトではstaticというフォルダですが、ここでは'librorum'にします。static_routeは静的ファイルのルートで、デフォルトでは'/static'ですが、同じように'/librorum'にする必要があります。3;}実行と結果コードの準備が完成したら、次はサーバ.pyコードの実行です。ここではfirefoxで行きます。何かの間違いがなければこのようなページは表示されるはずです。データが入っていないので、まずは追加してみます。名前とレベルを入力して追加ボタンをクリックすると、データが追加されます。「ダウンロード」のリンクをクリックしたら、データはjsonファイルにされてダウンロードできます。この方法ならjsonに変換する時にこのように漢字はユニコードになってしまいます。https://qiita.com/nassy20/items/adc59c4b7abd202dda26ただ、それでもfirefoxとかで調べたらちゃんと漢字に戻っているので、今回はこのままでもいいと思います。次は、試しにフォームに何も入れずに追加ボタンをクリックすると、エラーが起きてこのページになります。エラーが出る原因は、名前が入れられていないからreq.media()を使う時に、'namae'キーがなくてparam['namae']を呼ぶとエラーになります。エラーを避けるためには.get()を使った方がいいですが、今回はそもそも空っぽにできる必要があるわけではないのでここではこのままでいいです。インデックスに戻って、一つ名前をクリックしてリンクに入ったらデータ編集ページになります。試しにレベルを空っぽにして、更新ボタンをクリックするとエラーが出てまたnoのページへ。一度このページに戻って、今回ちゃんと新しいデータを入力して、ボタンをクリックしたら、データは更新されます。インデックスに戻ったらデータはもうちゃんと更新したと確認できます。最後に、また編集ページに入って削除ボタンをするとそのデータは消えます。これで全部の機能のテストは完了。終わりにこうやってresponderとsqlite3でウェブサイトができました。単純であまり使い物にならないウェブサイトかもしれませんが、本格的なサイトを作るための基本の練習としては使えると思います。