Question

在部署时，heroku告诉我我的构建成功，但是获得Failed to load resource: the server responded with a status of 400 (Bad Request)的图标和清单以及Manifest: Line: 1, column: 1, Unexpected token.灯塔告诉我它没有链接到我的manifest.json所有。我不确定这些是否相关，如果是这种情况，我将提出一个新问题。我正在将Reactjs与节点服务器一起使用。

这是我的server.js

const express = require("express");
const bodyParser = require("body-parser");
const path = require("path");
const app = express();
const PORT = process.env.PORT || 3001;

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

if (process.env.NODE_ENV === "production") {
   app.use(express.static("client/build"));
}

app.get("*", (req, res) => {
  res.sendFile(path.join(__dirname, "./client/public/index.html"));
});


app.listen(PORT, function() {
  console.log(`  ==> API Server now listening on PORT ${PORT}!`);
});

这是我index.html的头

<head>
    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1, 
    shrink-to-fit=no">
    <meta name="theme-color" content="#000000">
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
    <title>React App</title>
</head>

This is my file structure

This is my github repo

让我知道您是否需要更多信息，如果这是重复的问题，或者这些问题无关，那么我可以采取相应的行动。

Answer 1

在redirect(request.url)上部署了react-app

之后，我遇到了同样的问题

firebase-hosting和manifest.json在google-chrome DevTools的favicon.ico标签中给了400 Bad Request

运行network后，如果您在firebase询问您要用作公用目录时未输入build的情况？（公开） 那么您将不得不转到根项目文件夹中的firebase init文件并手动更改托管->“ public”：“ build”

会是这样

firebase.json

如果您{ "hosting": { "public": "build", "ignore": [ "firebase.json", "**/.*", "**/node_modules/**" ], "rewrites": [ { "source": "**", "destination": "/index.html" } ] } }，请同时检查this和this's。

Answer 2

就我而言，转到文件 public/index.html

改变

<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png" />

到

<link rel="manifest" href="manifest.json" />
<link rel="shortcut icon" href="favicon.ico" />

希望能帮到你。

400（错误请求），并且找不到manifest.json

2 个答案: