BitScheduler開発日誌、３回目の投稿です。

今回はBitSchedulerのシステム構成を検討し、かねてより興味のあった「Firebaseをガッツリ使ってWebアプリを作ってみる」にチャレンジしてみようと思います。

Firebaseは「アプリ開発のプラットフォーム」という認知が一般的です。ランディングページのコピーでも "App success made simple" と書かれていますしね。
ところがギッチョンチョン、Webのライブラリ(JavaScript)も充実しており、Webアプリでの利用も十分想定されています。

SPAでの課題

FirebaseでWebアプリを作成する際のアーキテクチャーはSPA(Single Page Application)の採用が想定されています。なぜならHostingでは静的なファイルしかホストできませんし、サーバーサイドのモジュールはAuthenticationやCloudMessagingなど、SPAと連携する上で必要な一部の処理においてしか提供されていません。

今回作成するBitSchedulerではJavaScriptが動作しないガラケーにも対応させたいのでSPAは採用できません。
そこで、最近リリースされた新機能"CloudFunctions"を使って解決します。

CloudFunctions とは

まずはCloudFunctionsを使ってhttpリクエストに対してHTMLを返すコードです。
以下のコードでRealtimeDatabaseから値を取得してHTMLとしてレスポンスを返せます。

index.js


// adminモジュールのロードと初期化
const admin = require('firebase-admin');
admin.initializeApp(functions.config().firebase);

// function定義
exports.sample = functions.https.onRequest((req, res) => {

    // databaseより値を取得    
    admin.database().ref('/foo/bar').once('value').then(function(dataSnapshot) {
        var value = dataSnapshot.val();
        // HTMLをレスポンス
        res.status(200).send('<html><body>' + value + ' is your saved data.</body></html>');
    });
});

解説

CloudFunctionsでは以下のイベントをトリガにfunctionを起動できます。

Realtime Database Triggers
Firebase Authentication Triggers
Firebase Analytics Triggers
Cloud Storage Triggers
Cloud Pub/Sub Triggers
HTTP Triggers

HTTP Triggers を使うことでガラケーからのGET, POSTリクエストに対しての処理を記述でき、かつFirebaseのモジュールを使うことでRealtimeDatabaseの値を参照できるので、databaseの値を使って動的ページをレスポンスすることができます。

今までは、これと同じことやろうと思ったらアプリケーションサーバを別途立てて、かつサーバ側でREST API経由でRealtimeDatabaseにアクセスしてレスポンスしなければならず、とても非効率でした。

CloudFunctions 最高っす。

よろしけれ「いいね」してBitSchedulerの開発を応援してください！
みなさんの「いいね」がモチベーションになり開発を加速させます！

BitSchedulerティザーページ

CloudFunctionsでDatabaseの値を使ってHTMLをレスポンスする[BitScheduler開発日誌]

SPAでの課題

CloudFunctions とは

解説