firebase - 是否可以要求密码才能访问Firebase上托管的网站？

Question

我正在使用Firebase托管网站，并希望能够防止人们访问它，尝试使用.htaccess文件，想知道以前是否有人能够这样做。

Answer 1

这是一个小技巧，它使用Firebase云功能和一些文件重排来模拟HTTP Basic身份验证。

共有3个步骤:

设置必要的云函数

将要保护的文件移到“ secret ”文件夹中

更新您的firebase.json

1.云功能

const USERNAME = 'USERNAME'
const PASSWORD = 'PASSWORD' 
const denyAccess = (res) => {
  res.statusCode = 401;
  res.setHeader('WWW-Authenticate', 'Basic realm="Authorization 
  Required');
  res.end('Unauthorized');
}

exports.authorizeAccess = functions.https.onRequest((req, res) => {
  if (typeof req.headers.authorization !== 'string') {
    denyAccess(res);
    return;
  }

  const base64Auth = req.headers.authorization.split(' ')[1];
  if (typeof base64Auth !== 'string' ) {
   denyAccess(res);
   return;
  }

  const [user, pass] = Buffer.from(base64Auth, 
  'base64').toString().split(':');
  if (user !== USERNAME || pass !== PASSWORD) {
    denyAccess(res);
    return;
  }

  const urlObject = url.parse(req.url);
  urlObject.pathname = 
  `/${PASSWORD}${urlObject.pathname}`;
  const location = url.format(urlObject);

  res.writeHead(302, { location });
  res.end();
});

2.将文件移到 secret 文件夹

假设您在 public中设置为 firebase.json的文件夹如下所示:

.
├── index.html
├── js
|   ├── main.js
|   └── main.js.map
└── styles.css

然后让它看起来像这样

.
└── PASSWORD
    ├── index.html
    ├── js
    |   ├── main.js
    |   └── main.js.map
    └── styles.css

3. firebase.json

{
  ...
  "rewrites": {
    "source": "/"
    "function": "authorizeAccess"
  }
  ...
}

我们必须在生产中使用密码保护源 map ；我们必须首先将它们放在那里，以便哨兵将其拾起。我们的构建脚本将负责将文件移动到必要的文件夹中。