vsReversiアップデート

GCPのデモとして用意していた vsReversiをアップデートしました。

アップデート内容は以下のとおりです。

• ユーザのログインと新規登録を別に
• SPA対応
• デザイン変更

ユーザのログインと新規登録を別に

ユーザ認証にはGCPのIdentity Platform(Firebase Authentication)を使用していますが、これには出来合いのUIとして提供されるもの(Firebase UI)も、単体のAPIも、ログインと新規登録の区別がありません。それらが一緒になったサインインがあるのみです。

しかし日本では、ユーザ登録と登録済みユーザのログインが別になっているのをよく見るので、それらしく分けてみました。やってみて出来なくはないのですが、かえって実装は面倒になってしまった印象です。

またEメールで登録する場合は、OAuth(Google/Facebook/Twitter/etc.)に比べて、追加で実装しなければならないのものが多いので、余計面倒です。具体的には、

• 入力されたEメールアドレスを確認する
• 入力されたEメールアドレスが間違っていた場合にユーザ登録を解除
• ユーザがパスワードを忘れた場合のパスワードリセット
• ユーザがEメールアドレスの変更を希望した場合の対処 (vsReversiでは割愛)
• さらにこれらのUIのカスタマイズ (vsReversiでは割愛)

Firebase UIではこれらの一部が対応済みなので、簡単に実装したいならそれを使うのが楽です。ただしUIのデザインは簡素なものなので、カスタマイズしたくなります。

SPA対応

Angularを使って一部のページをSingle Page Applicationに対応させました。ログイン/新規登録後のページがそれです。マテリアルデザインは採用していないので それっぽい見た目にはなっていないのですが、ページ遷移が速くなりました。

今までGAE/Java8メインで作っていたのですが、「GAE/Java8でSPA対応に苦戦」に記載したように、これは複数のURIに1つのページを割り当てることができないので、実装の変更が大掛かりになりました。具体的には...

• HTMLなどスタティックコンテンツをFirebase Hostingに移行してURI割り当てを解決。
• ajaxリクエストエンドポイントは過去のGAEの実装を流用。ただしCORS(Cross Origin Resource Sharing)に対応。
• 管理者用のページはCloud Runで管理者の認証を実装。

GCPの初期からあるサービスだけに、GAEは単体でいろいろ必要なものが用意されていることを実感できました。今回は対応できないものが見つかったので、他にいろいろと物色することになりました。それぞれが別のサービスとして名前を持っているので、利用したサービスの数が増えています。

デザイン変更

SPA対応のついでですが、見た目だけの変更です。

CPUの思考ルーチンなどその他は以前のままで、変りありません。