JavaScript
ニフクラ mobile backendはスマートフォンアプリのバックエンド（サーバサイド）で必要な技術を提供します。しかし、バックエンドが必要なのはアプリだけとは限りません。サーバサイドで動く、Webアプリケーションにおいてもデータベースやストレージのような仕組みは必要です。
JavaScript SDKはWebブラウザ上のJavaScriptでも動作します。しかし、その際にアプリケーションキーとクライアントキーを入力しなければなりません。この二つのキーはニフクラ mobile backendのアプリ認証キーとして使われますので簡単に閲覧できる状態にあるのはよくありません。
そこで今回はWebアプリケーションでニフクラ mobile backendを安全に使うための方法を紹介します。
方法はつ
Webアプリケーションでニフクラ mobile backendを使う方法は主につあります。
- サーバサイド
- 署名作成処理をサーバサイド化
- 署名作成処理をWeb Assembly化
サーバサイド
JavaScript SDKはNode.js上でも動作します。そこで、ExpressといったWebアプリケーションフレームワークと組み合わせて使う方法があります。最近流行のVueのSSR（サーバサイドレンダリング）を提供するNuxtとNCMBを組み合わせることもできます。
サーバサイドの場合、アプリケーションキーやクライアントキーを隠蔽できますので、安心してWebアプリケーションの中で利用できます。
コミュニティベースではRuby SDK、PHP SDKをリリースしています。これらのSDKを使うことで、より簡単にサーバサイドのプログラミング言語からmBaaSを利用できます。
署名作成処理をサーバサイド化
NCMBMania/ncmb_server_v2 と NCMBMania/sign_server_v2 を組み合わせることで署名作成処理をサーバサイドで行えるようになります。署名処理作成だけをサーバ化しますので、使い方は普段のJavaScript SDKと同じです。
この方法は手軽ですが、署名作成処理の分だけネットワークアクセスが一回増えてしまうのが難点です。署名サーバはHerokuでも立てられるようにしていますので、アクセスが少ない限りは無料で使い続けられるでしょう。
署名作成処理をWeb Assembly化
NCMBMania/wasmとNCMBMania/ncmb_js_wasm: JavaScriptの署名処理をWebAssemblyに置き換えたSDKです。を組み合わせることで署名作成処理をWebAssemblyで行います。WebAssemblyはWebブラウザ上で動作する実行ファイルで、コードが難読化されるのでクライアントキーを簡単に読み取られづらくなります。
この方法は上記の署名作成処理のサーバサイド化と比べてネットワークアクセスが発生しないというメリットがあります。ただしWebAssemblyをサポートしたブラウザでしか動作せず、IE11では使えないでしょう。
なお、WebアプリケーションでmBaaSを利用する際にはデータの保存時にはACLの利用、そしてクラスごとの権限設定を正しく指定するのが必須です。
まとめ
いずれの方法についても一長一短があります。簡単にまとめると次のようになります。
| サーバサイド | 署名作成処理をサーバサイド化 | 署名作成処理をWeb Assembly化 | |
|---|---|---|---|
| SEO | ○ | × | × |
| 認証後のセッション | △ | ○ | ○ |
| SDKの修正 | × | ○ | ○ |
| 対象ブラウザ | ○ | ○ | △ |
| 外部サーバ | 要 | 要 | 不要 |
| ネットワークアクセス数 | ○ | × | ○ |
通常のJavaScript SDKをそのままWebブラウザ上で動かすのはリスクが大きいので注意しましょう。なお、署名作成処理をサーバサイド化したり、WebAssembly化したとしても、デコンパイルやロジックは見えたままであるというリスクはあります。その点は注意して利用する必要があるでしょう。そうしたロジックも隠蔽したい場合にはサーバサイドで実行したり、スクリプトの利用をお勧めします。
