catalinaの備忘録

ソフトウェアやハードウェアの備忘録。後で逆引きできるように。

外出先からDNNの学習状況を確認したい

今回はchainerでの学習進捗を見るのが目的ですが、あんまりchainer関係ないです。webフロントまわりですね。

やりたいこと・その経緯

DNNを試しておいて、自動で学習してる間にちょっと出かけたりとかしたいです。

そうすると出先で学習の経過が見えたほうが便利ですよね。

帰宅中の電車の中で結果を見ることができれば、次どうするかの策を移動中に考えることができます。

リモートデスクトップでいいじゃない

外出先でもVPN使えばPCにログインできるので、リモートデスクトップでなんとかなったりします。

ただWindowsリモートデスクトップって今回やりたいことに対して少々オーバースペックです。ちょっとjpegファイルみたりログ読みたいだけなのに。

そのうえ外出先だとスマホからのアクセスがメインになるので、リモートデスクトップが操作しづらいです。

というわけで、外出先から自宅のPCにアクセスしてchainerの学習状況を確認するための「使いやすい」構成を考えてみました。

  • Chainerが走ってるPCでWebサーバを走らせる
  • VPNはこれまで通り使う
  • WebサーバからChainerの状況を読み出す
  • スマホのブラウザから進捗が確認できる

こんなところでしょうか。 実験用のWebサーバをそのまま外部に公開するのはセキュリティ的に少々怖いので、VPNは維持しておきます。

使用するフレームワークの選定

DNNのフレームワークはchainerを使います。

Webサーバとしては候補は色々ありますが、ChainerがPythonなのでPythonで統一したいところです。

とりあえずWebから見たい情報は

  • 学習の進捗
  • グラフの形状
  • 各層の状況

などでしょうか。

グラフの形状を見れるなら、そこから画面遷移したいとか要望が増えることも考えられます。

画面遷移とか考えるとbottleでは少々力不足です。 せっかくなので、勉強も兼ねてDjangoを使ってみることにします。

今回使うDjangoは公式のチュートリアルをやっておけば最低限の扱いはできそうな感じでした。 https://docs.djangoproject.com/ja/1.11/intro/tutorial01/

ではやってみます。

環境

環境はいつものです。

Djangoを使う準備

Djangoとはpythonでwebアプリケーションを作るためのフレームワークです。 軽く触ってみた感触ではよくあるフレームワークと同じなのかなと思っています。

まずはインストールしてコマンド類を確認します。

pip install django

Webサーバを立てる

プロジェクトを作ります。 このときプロジェクトと同名のWebアプリケーションも自動で生成されます。

django-admin.exe startproject dnn_view
cd dnn_view

しばらくはこのディレクトリがカレントであったほうが作業しやすいです。 ほとんどのコマンドはこのディレクトリに生成されたmanage.pyで使うので。

どんなコマンドがあるのかは

python manage.py --help

で確認できます。

とりあえずサーバを立ち上げてみます。

python ./manage.py runserver

これでhttp://127.0.0.1:8000 にアクセスすればDjangoのページが開きます。

同様にして http://127.0.0.1:8000/admin にアクセスするとWebサイト管理者用の画面が開きますが、まだユーザー作ってないので入れません。

管理ユーザーを作る

今回使用するDjangoのバージョンでは、DBのマイグレーションしてからユーザーを作る手順になります。 DBはデフォルトでSQLite使ってくれるみたいなので、当面は気にしなくていいでしょう。

python ./manage.py migration
python ./manage.py createsuperuser

ユーザー名、メールアドレス、パスワード、再確認パスワードを入力して完成。 先ほどの管理者用のページでログインできるようになります。

とはいえ、今回は管理者ページを使ったことは何もしません。

Webページを作る

初めてのDjangoなので、簡単なページを作ることにします。 幸いにもChainerは進捗状況をpngに吐いてくれる機能があるので、このpng画像を張り付けただけのページWebサーバで見せることにします。

次のものを作成・変更します。

  • URLとビューを結びつける urls.py。djangoが作ったものに変更を加えます
  • ビューを表現するviews.py。これもdjnagoが作ってくれてます
  • ビューの具体的な表示内容を示すhtml。自前で書きます。

URLとメソッドを結びつける

ページのパス名とpythonメソッドを結びつける必要があります。 とりあえず適当なviewに結び付けます。

from django.conf.urls import url
from django.contrib import admin
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from . import views

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^dnn_view/', views.net),
]

これでhttp://127.0.0.1:8000/dnn/ へブラウザでアクセスするとviews.pyに定義されたnetという関数が呼び出されます。

ビューをつくる

ビューをつくります。 アプリケーションのディレクトリ(urls.pyとかと同じ階層)にtemplateディレクトリを作ってて、その中にdnn_view/index.htmlを置いたので、このファイルを読み出して使うという単純なものです。

from django.template import loader
from django.http import HttpResponse

def net(request):
    t = loader.get_template('dnn_view/index.html')
    return HttpResponse(t.render())

テンプレートをつくる

お行儀よくテンプレートで定義することにします。パスがちょっとアレなのでお行儀良くないかもしれませんが。

これはUWPでいうXAMLに相当するものかなと思っています。

Microsoft-Edgeさんで実験していると、DocTypeなしのHTMLだと警告がうるさいので、つけておきます。

{% load static %}
<!DOCTYPE html>
<img src="{% static "loss.png" %}" alt="My image"/>

どうしてEdge?

私のスマホはWindowsPhoneです。なのでEdge。

あとはPC版EdgeだとUAのエミュレーション試験機能もついてるので。こいつですね。 f:id:Catalina1344:20170805012100p:plain

モバイル用UAに設定してから適当なサイト見るとモバイル用のボタンとか増えたりして楽しかったりします。

テンプレートと画像のパスを登録する

Djangoが静的ファイル(画像とかcssとか)を探すときに使うパスを登録しておきます。 本番だとこういうやりかたはオススメできないみたいな話もありますが、所詮は実験用なので良しとします。

どうやらDjangoにはデプロイ用に静的ファイルまとめてくれる機能があるらしいです。今回は目的からそれるので試しません。

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.11/howto/static-files/

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static"),
    'C:/myproject/deep_learning/sdks/result', # chainerの学習結果が吐かれるパス
]

できた!

これでブラウザから http://127.0.0.1:8000/dnn_view/ にアクセスするとこんなの出ました。よさげですね。

f:id:Catalina1344:20170805012147p:plain

感想と今後

これで学習の経過は見れるようになりました。 出かける前に仕掛けておいて、昼休みとかに進捗どうですかと確認したりとかできますね。 あとはスナップショットとグラフ構造も見せるようにしてUIつければ、色々と楽しいかもしれません。

それでは今回はこれくらいで。