【发布时间】：2020-12-08 07:57:03
【问题描述】：
我正在尝试在我的节点 js 与 apache2 Web 服务器后端与我的 React 前端之间建立初始连接。我是这一切的新手，并试图在部署之前使其在本地机器上工作。 我阅读了有关 CORS 的信息并用它解决了访问源标头的问题，但我不明白我在这里缺少什么。
服务器运行并监听 3000 端口 3001端口上的前端
我的前端代码是：
import React from 'react';
import axios from 'axios';
import logo from './logo.svg';
import './App.css';
export default class App extends React.Component {
state = {
persons: []
}
componentDidMount() {
axios.get(`/ping`, {
headers: {
"Access-Control-Allow-Origin": "*"
}
})
.then(res => {
const persons = res.data;
this.setState({ persons });
})
}
render() {
return (
<h1>dfdfdfdfdf{this.state.persons}</h1>
)
}
}
我的后端代码是：
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var cors = require('cors');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use(cors());
app.use('/', indexRouter);
app.use('/users', usersRouter);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
next(createError(404));
});
const hostname = '127.0.0.1';
const port = 3000;
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
app.use(express.static(path.join(__dirname, 'build')))
app.get('/ping', (req, res) => {
return res.send('pong')
})
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname, 'build', 'index.html'))
})
app.listen(port, hostname, () => {
console.log(`Server running at http://${hostname}:${port}/`);
});
module.exports = app;
我不断收到错误消息：
加载资源失败：服务器响应状态为 404（未找到） 0.chunk.js:779 未处理的承诺拒绝：错误：请求失败，状态码为 404 （匿名函数）（0.chunk.js:779） promiseReactionJob
【问题讨论】：
-
你有一个像
app.use(function(req, res, next) { next(createError(404)); });这样的中间件设置，这会产生一个错误。错误被传递到下一个错误处理程序中间件，该中间件以错误的形式响应。您可以评论该中间件，因为它会在没有任何条件的情况下创建错误。 -
这是问题的一部分，我还不得不更改 url 路径。谢谢！
标签： node.js reactjs web server apache2