Reactjs 未找到React JS和特快专递路线404
我的问题是我正在尝试向我的项目添加编辑功能。我已经在我的教室.js文件中添加了一个/edit路由器,我通过应用程序编辑了这个标志,我在控制台日志中得到了POST/classification/edit 404 398.484 ms-1355。在浏览器控制台日志中,我得到:Reactjs 未找到React JS和特快专递路线404,reactjs,express,routes,Reactjs,Express,Routes,我的问题是我正在尝试向我的项目添加编辑功能。我已经在我的教室.js文件中添加了一个/edit路由器,我通过应用程序编辑了这个标志,我在控制台日志中得到了POST/classification/edit 404 398.484 ms-1355。在浏览器控制台日志中,我得到: App.js:32 POST http://localhost:3002/classroom/edit 404 (Not Found) App.js:52 Error: Bad response from server
App.js:32 POST http://localhost:3002/classroom/edit 404 (Not Found)
App.js:52 Error: Bad response from server
at App.js:40
反应:App.js
教室.js
有谁能帮助我,说明我需要更改什么,然后解释为什么它不工作,这样我就可以从错误中吸取教训?根据提供的代码,似乎有两个问题导致404。第一个是,在react代码中,您正在发出post请求,但路由是一个get
第二个问题是,在react代码中,您试图访问/课堂/编辑,但根据提供的代码,它应该仅为/edit 更新 由于提供了额外的代码,问题似乎是因为您正试图进行post到get路由
react代码中的路由实际上应该是/CHOORK/edit,并且路由处理程序应该更改为post。您需要更新服务器上的教室.js文件部分以使用post方法:
router.post('/edit', function(req, res, next) {
console.log('A flag was edited...');
pool.query("UPDATE classroom SET flagreason = '"+req.body.flagreason+"' WHERE id = '"+req.body.id+"'", function (err, results, fields) {
if(err) throw err;
res.send(JSON.stringify(results));
});
});
目前它正在等待一个GET请求,而您正在发送一个POST,因此它不知道如何处理它。其余的应该没问题。你能展示一下你是如何设置路由器的吗?根据代码,问题似乎来自您试图点击/课堂/编辑,但路线似乎只有/编辑。我想你已经安装了一个教室路由器,我相信问题可能就在那里。请看我更新的问题。我已在您尝试访问/kitcher/edit的react代码中添加了完整的教室.js文件,但我只看到/edit似乎就是问题所在。我已尝试将/kitcher/edit添加到路由中,但不起作用,我已尝试从获取中删除/kitcher。。。还是不走运。我现在已经在问题中添加了express app.js代码,以查看是否也存在任何问题。请参阅标记的正确答案中提到的更新答案,这很有效!非常感谢。
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var index = require('./routes/index');
var classroom = require('./routes/classroom');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', index);
app.use('/classroom', classroom);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// 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.listen(3001);
module.exports = app;
var express = require('express');
var router = express.Router();
var mysql = require('mysql');
var pool = mysql.createPool({
connectionLimit : 30,
host: 'localhost',
user: 'root',
password: 'password',
database: 'dbname'
});
/* GET Classroom listing. */
router.get('/', function(req, res, next) {
console.log('A Client Requested Data...');
pool.query('SELECT * FROM classroom ORDER BY childsname ASC', function(err, results) {
if (err) throw err
var array = [];
for(var i = 0, len = results.length; i < len; i++) {
array.push(results[i]);
}
res.json(array);
});
});
/* EDIT Child Flag */
router.get('/edit', function(req, res, next) {
console.log('A flag was edited...');
pool.query("UPDATE classroom SET flagreason = '"+req.body.flagreason+"' WHERE id = '"+req.body.id+"'", function (err, results, fields) {
if(err) throw err;
res.send(JSON.stringify(results));
});
});
module.exports = router;
router.post('/edit', function(req, res, next) {
console.log('A flag was edited...');
pool.query("UPDATE classroom SET flagreason = '"+req.body.flagreason+"' WHERE id = '"+req.body.id+"'", function (err, results, fields) {
if(err) throw err;
res.send(JSON.stringify(results));
});
});