Introduction

きっかけ

PythonのWebアプリケーションを作成しようとしたのですが、BottleやDjangoといったフレームワークを使おうにも完全にJavaScriptの使い方を忘れてしまいました。そこで、フロントエンドで簡単にPythonを使う方法がないかと思い、Googleで検索してみたところBrythonというJavaScriptのモジュールを見つけました。忘れっぽいので使い方など備忘録としてまとめておきます。

自己紹介

自己紹介ページ

環境情報
Python 3.6.5 |Anaconda, Inc.|
Windows10

問題点

参考情報が古いものばかりですね。BottleやFlask、DjangoといったPythonのフレームワークが使える人には必要ないですからね…。

20190208
また上記のフレームワークとくらべて圧倒的にトラブルに対する情報量が少ないです。
僕はあきらめました。(理由後述)

対象者

・Python3系を使っているユーザー(Anacondaでインストール)
・Brythonの初心者の方
・1を聞いて10を理解できるエンジニア
・Windowsの人

非対象者

・Bottle, Djangoなどのフレームワークが自分の手足のように使える人~~(教えてください)~~
・JavaScriptを使い慣れている人
・説明下手な筆者を攻撃しようとするエンジニア
・Macの人

Let's Start

こちらの参照サイトにお世話になりました。
上記のサイトを軸にわからないとこなどで適宜調べたもの、エラー対処などをまとめておきます。
それでは張り切ってまいりましょう。

1.Brythonとは？

PythonをWebブラウザ上で動かすことができるようにするJavaScriptのライブラリだそうです。
開発自体はだいぶ前ですが、Python3にも対応しています。

ダウンロードはこちら
上のページがよくわからない場合はこちら

Cf)
GitHubからのダウンロードについて

大事なのは、

brython.js
brython_stdlib.js

の二つのファイルだそうです。
~~でもbrython_stdlib.jsの使い道はよくわかっていません。~~

Sample Code

Sample.html

<html>
    <head>
        <script type="text/javascript" src="brython\www\src\brython.js"></script>
      </head>
    <body onload="brython()">
      <script type="text/python" >
        from browser import document, alert

        def echo(event):
           alert(document["zone"].value)

        document["mybutton"].bind("click", echo)
         </script>
       <input id="zone">
       <button id="mybutton">click !</button>
      </body>
  </html>

これを「Sample.html」というファイル名で保存すればweb上でPythonが動く姿を目の当たりにできます。
上から7行目のbrowserというモジュールはBrython特有のモジュールらしいです。

2.Brythonでの応用

最初に断っておきますが、僕は失敗しました。

ファイルの分割方法

課題：
可読性の高さが、Pythonの良さなので可読性を上げるためにも、PythonのファイルとHTMLのファイルを分割します。もちろん以下のような理由でも、分割したかったです。

20190208
AtomというEditorでコードを書いていますが、Htmlファイル内のPythonはコメントアウトが、Python式のコメントアウトになるので、そのまま保存してしまうと、Htmlファイルの実行時にエラーが生じる点は地味ですが面倒な問題ですね。
解決策としては、Pythonファイルを外部から取得する形？したほうがいいですね。

Sampleコードの場合で説明しますと、以下のような二つのファイルで作成します。

Sample.html
Sample.py

「Sample.html」のscriptの部分を外部ファイルで置き換えます。

Sample.html

<html>
    <head>
        <script type="text/javascript" src="brython\www\src\brython.js"></script>
      </head>
    <body onload="brython()">
      <script type="text/python" src="Sample.py">
         </script>
       <input id="zone">
       <button id="mybutton">click !</button>
      </body>
  </html>

Sample.py

from browser import document, alert
def echo(event):
    alert(document["zone"].value)

document["mybutton"].bind("click", echo)

再度述べますが、この部分で失敗しました。
こちらのサイトでは成功しているようです。

Access to XMLHttpRequest at 'ローカルファイルのPath' from origin 'null' has been blocked by CORS policy: 
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

CORSという問題があるようです。
調べたところローカルファイルにアクセスするには、「http, data, chrome, chrome-extension, https」という方法でのみやり取りできるようです。
つまりローカルファイル同士で、値のやり取りをすることができないようです。
~~このあたりでBrythonが面倒になってきました。~~

Cf)CORSに関連する情報(結局よくわからなかった)
Qiita記事
 英語のDocument

Cf)CORSに関連したBrython情報(結局よくわからなかった)
作者への質問
 BrythonのDocument

3.結論 (またの章名をあきらめた理由ともいう)

サーバーの問題

もともとのきっかけとしてローカルサーバーを立てるのが、面倒でBrythonを始めましたが、CORSの問題に対処していろいろ調べているうちに、サーバーを立てる必要が出てきました。サーバーの詳細は先ほど紹介したこちらのサイトの中で記述されています。
しかし「server.py」の格納位置やディレクトリの構造などを考えていたら、Bottleなどのフレームワークで実装したほうが簡単と思いました。

拡張性に対する不安

Brythonによる実装で使おうとしていた分野が、Brython上で実装できるほどの技術力が自分にはないためです。
あきらめを決めたサイトから以下引用

例えば、BrythonはJavaScript実行環境で動きますし、JythonはJava環境、IronPythonは.NET系ですね。ただし、実装具合はあまり期待しないほうが良いでしょう。
以下にイメージを書きます。
上ほど簡単、下ほど難しい
・Pythonの基本的文法の実装
・標準ライブラリの基本的なものだけ実装
・標準ライブラリの応用的なものも実装
・外部ライブラリの基本的なものなら動く実装
・外部ライブラリの応用的なものも動く実装
最下段ともなると、C言語でのPython実装（つまり普通のPython実装）以外にはないでしょう。なぜなら、大抵の応用的な大規模な外部ライブラリは、一部にC言語による拡張が使われており、これを他のプラットフォームで工数をかけずにそのまま動作させるのは至難だからです。
仮にピュアPythonで書かれたライブラリであっても、その内部で色々な標準ライブラリを必要としていると、そのどこかの中で「まだ実装されていない」例外が飛ぶ可能性が高いからです。
とはいえ、JythonやIronPythonあたりはある程度まともに動くようになってきたので、モノ好き連中がいろいろ試しているようです。

やりたいことが自然言語処理分野だったのですが、上の5つの中でいうと、一番難しいものです。
そこで普通にBottleをはじめとしたフレームワークを使おうと思いました。
今回BrythonをいじっているうちにそれなりにJavaScriptを思い出してきたので…

Brythonでは、外部Scriptを使うような実装は向かないです。
あくまでPythonの既存ライブラリのみをJavaScript上で動かしたいときは強い破壊力を秘めています。
今後Brythonを使う人にとって少しでも参考になればと思い、記録しておきます。

その他参照サイト

http://blog.livedoor.jp/hamu_nbr/archives/43114283.html
https://hitoribucho.com/post/20170623180316
https://tech-joho.info/python%E5%85%A5%E9%96%80%E3%82%B3%E3%83%B3%E3%83%86%E3%83%B3%E3%83%84%E3%81%AE%E3%81%8A%E4%BE%9B%E3%81%ABbrython/

Cf.)QiitaのBrython関係のサイトはほとんど古いものばかりですが、参考までに載せておきます。
https://qiita.com/ryo_grid/items/5e34220ed48f4580126d
https://qiita.com/jack-low/items/8e17b26030440217c18c
https://qiita.com/n_0r2/items/90d1d61b14c6a2865289
https://qiita.com/SaitoTsutomu/items/32a89fa45b1aad41da5d

Brython初心者のための覚え書き