Firebase 云功能 + 托管 - 404 未找到答案

【问题标题】：Firebase Cloud Functions + Hosting - 404 Not FoundFirebase 云功能 + 托管 - 404 未找到
【发布时间】：2018-08-07 19:51:02
【问题描述】：

我正在 Firebase 云功能和托管之上构建我的网络应用。我的客户端是使用 create-react-app 构建的，并且我有一个小型快速服务器在云功能中运行，为应用构建提供服务。

在普通浏览器窗口中一切正常，但是我遇到了一个问题，如果我在隐身模式或移动设备中转到任何不是“/”的 url，我会得到 404 和“未找到”

ie：直接点击“https://144blocks.com/week”将在普通浏览器窗口中正常加载，但在隐身和移动设备中会引发以下错误。

我为网站提供服务的 firebase 功能是：

functions/index.js

const functions = require('firebase-functions');
const express = require('express');
const fs = require('fs');
const path = require('path');

const app = express();

app.get('/*', (req, res) => {
    const fullPath = path.normalize(__dirname + '/../react-ui/build/index.html');

    res.set('Cache-Control', 'public, max-age=300, s-maxage=600');
    res.sendFile(fullPath);
});

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

在我的客户端中，我的 firebase.json 文件：

firebase.json

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

我不知道为什么在隐身窗口或移动设备中除了“/”之外，我无法直接点击任何路线。理想情况下，我希望我的所有路由都流经我的 express 服务器上的 app.get(/*，并让我的客户端处理路由。

【问题讨论】：

仅供参考：that URL 在 Mac 上的 Chrome 中也为我提供了 404。顺便说一句，该应用程序看起来很棒，至少在主页动画中。 :-)
@FrankvanPuffelen 感谢您的仔细检查和对应用程序的赞美????
@Onaracs 你是怎么解决这个问题的？

标签： firebase express google-cloud-functions firebase-hosting incognito-mode

【解决方案1】：

Firebase 托管目前存在问题，这似乎影响了许多网站，包括我自己的两个网站。您可以通过此link 了解他们的最新状态。

【讨论】：

感谢您提供此信息，但是，我认为这与此无关，因为我已经看到这个问题几天了。
我相信问题是因为这个错误而发生的 - 对此有什么帮助吗？ stackoverflow.com/questions/47830224/…

【解决方案2】：

我仍然不能 100% 确定这为什么有效，但我通过以下方式解决了这个问题： 1. 在我的functions/index.js 文件中，更新fullPath，因为我认为__dirname + '/../react-ui/build/index.html' 没有解析。

我的名字functions/index.js文件：

const functions = require('firebase-functions');
const express = require('express');
const path = require('path');

const app = express();

app.get('/*', (req, res) => {
    const fullPath = path.normalize(__dirname + '/build/index.html');

    res.set('Cache-Control', 'public, max-age=300, s-maxage=600');
    res.sendFile(fullPath);
});

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

在我的构建过程中，我将构建目录移动到函数文件夹中，以便使用函数部署到 Firebase，因此当我准备部署时，我的项目目录看起来像 functions 中的构建目录和react-ui 相同：

如果有人更深入了解为什么这确实有效，我将不胜感激。

谢谢！

【讨论】：

@EliseChant 不是 100% 相信它为什么会起作用，但确实如此！

【解决方案3】：

尝试运行firebase login。我遇到了这个确切的问题，这是因为我的登录会话已过期。

或者，如果您在使用标准登录时遇到问题，请尝试firebase login --no-localhost。

如果您使用 ci/cd，请使用 firebase login:ci --no-localhost，将您的 ci 令牌保存到您的环境中的 FIREBASE_TOKEN 下并使用 firebase deploy --only functions --token $FIREBASE_TOKEN 进行部署。

【讨论】：