Reactjs 未找到React JS和特快专递路线404

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

我的问题是我正在尝试向我的项目添加编辑功能。我已经在我的教室.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
    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));
  });
});