Firebaseを使ってP5をScrapboxで実行する
(2019/11/7)
Firebase Hostingというやつを使う。
手順
ローカルマシンにFirebaseツールをインストール
$ npm install -g firebase-tools
Firebase環境の設定
$ mkdir runp5
$ mkdir runp5/public
$ cd runp5
$ firebase init
Hostingを選択する
その他いろいろ指定する
$ firebase deploy
run-p5になってるのは、6文字以上という制約があるため
runp5.comで動かす
0. firebaseapp.com じゃなくて独自ドメインで動かしたい 1. Google Domainsでrunp5.comを取得する
2. Firebaseに接続する
ダッシュボードで設定する
ステータスが『設定が必要です』となっている間は独自ドメインからは接続できません.しばらく待たないといけないようです.
https://i.gyazo.com/thumb/400//0ecc5e86066b845f5a2b1c0b8cd2807c.png
待てばいいのかな
3時間ぐらい待ってもかわらない... 増井俊之.icon
自動じゃなかったのか...
こんなのを設定した
https://i.gyazo.com/thumb/400/36e91b3592a73c66dbb6ce623bab1485.png
保留中になった
https://i.gyazo.com/thumb/400/140475395b8856a915fa4f844efe2b0f.png
1時間たっても変わらず
最大24時間かかる?
httpsにする方法がわからない
DNSSECとやらの設定なのかもしれない
https://gyazo.com/ede0aac0ea8f2f83952da6a2876f8587
違うかもしれない
やっとhttpsになった(半日後ぐらい)
結果
というわけで、よくわからないが動くようにはなった
ノウハウが多いようで大変だったが
Firebaseは、あまり重要でないサービスを軽く作るには良いのかも
サーバでRuby動かしたりはできないだろうし制限はある
もっと複雑なものはHerokuなどでやるのが良いのだろうが、サーバの機能をほとんど使わない場合はFirebaseで良いということなのだろうか ハマったところ
httpsの設定もよくわからない
index.htmlの中でindex.jsを相対パス指定してたらエラーで動かなかった
/index.jsみたいな指定が必要
ルーティングの方法がわからない
https://runp5.com/project/page/fileを認識するためにはfirebase.jsonに以下のような記述を書く
code:firebase.json
"rewrites": [
{
"source": "/*/*/*",
"destination": "/index.html"
}
],
こう書くと、runp5.com/project/page/fileのようなURLを与えたときindex.htmlに飛ぶ
index.jsの中で、document.location.pathnameが/a/b/cになっている場合を調べる
そういうのをJSでやるのは邪道ではないのか? よくわからない。
JSONでもJSでもルーティングの指定をしなきゃならないのは変だと思う