やわらかしかっけい

なんでもすぐに忘れてしまう自分のために

FirebaseでBasic認証かける

qiita.com

まぁ、こちらに書いてある通りなのですが…

  1. Firebaseコンソール上でプロジェクト作る
  2. ローカルにディレクトリ作って、ターミナルでそこへ行く

ここまでは Hosting の時と同じ

firebase init

( ) Database: Deploy Firebase Realtime Database Rules
( ) Firestore: Deploy rules and create indexes for Firestore
(*) Functions: Configure and deploy Cloud Functions
(*) Hosting: Configure and deploy Firebase Hosting sites
( ) Storage: Deploy Cloud Storage security rules

これの時に、Hostingに加えてFunctionsも選択する

  • Javacsript or Typescript ? と聞かれる
  • ESLint 使いますか ?
    • なんとなくNoにする
  • 足りないパーツをnpmでinstallしてよい?
    • Yes
      • functions/node_modules/ というフォルダが作られた。中にメチャクチャ色んなのが入っている。

piblicフォルダの中身全部消す

$ cd public
$ rm *

functions/static を作り、適当な index.html を置いておく

functions/index.js の中身書き換える

const functions = require('firebase-functions')
const express = require('express')
const basicAuth = require('basic-auth-connect')

const app = express()

app.all('/*', basicAuth(function(user, password) {
  return user === 'アイディ〜' && password === 'パスワ〜ド';
}));

app.use(express.static(__dirname + '/static/'))

exports.app = functions.https.onRequest(app)

firebase.json書き換える

{
  "hosting": {
    "public": "public",
    "rewrites": [
      {
        "source": "**",
        "function": "app"
      }
    ],
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

npm install する

$ cd functions
$ npm install --save express
$ npm install --save basic-auth-connect
$ cd ..

firebase deploy


できた〜〜〜〜