JavaScript の Jupyter Notebook を Google Cloud Shell の Docker で 動かす

いつも通り、Google Cloud Shell での作業。 JavaScript で Firestore を使うのにあれこれ書いて試したかった。


Google Cloud Shell で Jupyter Notebook を Dockerコンテナとして動かす

Jupyter プロジェクト公式のイメージが Docker Hub に置いてある。

jupyter-docker-stacks.readthedocs.io

今回は、jupyter/base-notebook を使う。 ここの Dockerイメージは、jovyan1というユーザーで Jupyter が起動するようにセットアップしてある。

docker run -p 8080:8888 jupyter/base-notebook

Google Cloud Shell のプレビュー機能でアクセスできるけど、新しいノートブック作ったりできない。リクエストのホスト名チェックではじかれてしまう。

こんなエラーメッセージ Blocking Cross Origin API request for /api/contents.

これは Jupyter の起動オプション2で待ち受けホスト名を指定すればいい。あとついでに、token 認証も無効にする。Google Cloud Shell のプレビューだと認証済みのリクエストしか通ってこないから Jupyter の認証を無効にしてもよい。起動オプションを指定するときは、起動スクリプトも指定する必要がある。

docker run 
    -p 8080:8888 
    jupyter/base-notebook 
    start-notebook.sh --NotebookApp.allow_origin="*" --NotebookApp.token=""

jupyter/base-notebook からカスタムイメージを作る

同じことは Dockerfile でもできるが、今回はコンテナにアタッチして手動で設定した。

IJavascript をイントールする

IJavascript のコードリポジトリにある Dockerfile3 を参考にした。ついでに firebase の Web SDK も追加しておく。

export PATH="/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/opt/conda/bin"
npm install -g ijavascript firebase
ijsinstall

実際コードで require するときには node のグローバルモジュールのパスも追加する必要がある。それは後で Dockerイメージに ENV で書き込む。モジュールがインストールされるパスは npm root -g で表示できる。

Jupyter Notebook を設定する

Notebook をアップデートする

いま(2019/11/21)の latest イメージだと、Notebook の keyboard shortcut エディターが使えないなどの不具合がある。

サーバー側ではこんなエラーメッセージ 404 GET /static/components/react/react-dom.production.min.js

notebook のバージョンを最新では解決されてる。コンテナの中で conda コマンドを使ってアップデートする。

conda install notebook

Notebook の起動オプションを設定する

起動オプションを設定ファイルで設定する。/home/jovyan/.jupyter/juypter_notebook_config.pyに書く。

c.NotebookApp.allow_origin='*'
c.NotebookApp.token=''

Notebook のショートカットキーを設定する

Cell の編集モードで Shift-Enter を押したときに Cell が実行されるのを無効にしたい。チャットツールとかで改行が Shift-Enter だから反対の癖がつくとやっかいだから。それと、ctrl - [で編集モードから抜けるショートカットキーを追加したい。

Keyboard Shortcut Customization — Jupyter Notebook 6.0.2 documentation

/home/jovyan/.jupyter/custom/custom.jsに書く。書く内容は notebook の cell に マジックコマンド%%javascript を使うか、ブラウザの デベロッパーツールのコンソールで実行して確認できる。4

Cell の編集モードは CodeMirror でできている。Jupyter が管理するショートカットキーよりも CodeMirror の持つキー設定が勝つ。ctrl - [は、CodeMirror ではインデント解除に割り当てられているのでそれを削除する。

Jupyter.keyboard_manager.edit_shortcuts.remove_shortcut('Shift-Enter');
Jupyter.keyboard_manager.edit_shortcuts.add_shortcut("ctrl-[", "jupyter-notebook:enter-command-mode")
delete CodeMirror.keyMap.default["Ctrl-["]

編集した Dockerイメージを保存する

上でいじったコンテナをもとに Dockerイメージを作る。ついでに、環境変数と起動オプションを設定する。

docker commit 
    -c "ENV NODE_PATH /opt/conda/lib/node_modules" 
    -c 'CMD ["start-notebook.sh"]' 
    <ここにコンテナid>
    <ここに作成するイメージ名>

Docker Hub にアカウントがあってdocker loginコマンドでログインしてあれば docker pushで自分のイメージをDocker Hub に置ける。