我无法部署与json-server reactJS应用



我有一个应用程序,有json-server作为数据库。我想把它部署在herooku。所以我创建了这样的服务器。

const jsonServer = require('json-server');
const server = jsonServer.create();
const router = jsonServer.router('db.json');
const middlewares = jsonServer.defaults({ static: './build' });
const port = process.env.PORT || 8000;
const cors = require('cors');
const corsOptions = {
origin: '*',
credentials: true, //access-control-allow-credentials:true
optionSuccessStatus: 200,
};
server.use(cors(corsOptions));
server.use(middlewares);
server.use(router);
server.listen(port);

我还更改了包json文件的脚本部分。

"scripts": {
"start": "concurrently "react-scripts start" "json-server --watch db.json --port 8000 "",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"proxy": "http://localhost:8000",

我还创建了Procfile,并添加了Web: node server.js

在本机工作。但是当我在heroku中部署它时,它并没有获取数据。这也是网络get请求不工作。

Request URL: http://localhost:8000/cars
Referrer Policy: strict-origin-when-cross-origin
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: https://car-app1.herokuapp.com
Cache-Control: no-cache
Content-Encoding: gzip
Content-Type: application/json; charset=utf-8
Date: Tue, 28 Sep 2021 07:51:14 GMT
ETag: W/"b63-2tPS49o89NSMpXwMALi1soZWiMs"
Expires: -1
Pragma: no-cache
Vary: Origin, Accept-Encoding
X-Content-Type-Options: nosniff
X-Powered-By: Express

您的应用程序正在尝试访问本地主机。您应该使用heroku更改请求url。

错误的请求:http://localhost:8000/cars

正确的要求:https://car-app1.herokuapp.com/cars/