Express 不路由一些 jQuery 请求

Question

我有一个烦人的问题。 我正在尝试建立一个简单的网站。该网站使用我使用 nodejs 和 express 构建的 api。在开发 API 时，我经常使用 Postman 检查功能。一切正常并且仍然​​正常（使用 Postman）。

现在我开始在我的网站上工作。第一个 GET 和 POST 工作正常。 （我尝试了一些轻量级的 ajax 库，没有一个有效，只有 jQuery 似乎对我有用）

现在我正在尝试使用 PUT 动词更新项目。使用邮递员再次更新工作正常。但是尝试使用 jQuery 并不会在 express 中触发正确的路由。为了检查这一点，我添加了一个简单的 console.log，如果 express 使用了最后一个中间件，该中间件也返回一个 404 statuscode 和一个在处理 PUT 的函数中的 console.log。每次我使用 jQuery 更新元素时​​，它都会变为 404。如果我使用 Postman，我会看到来自 PUT 函数的消息。

我的 APIController（带 Express 的 NodeJS）：

let express = require('express');
//let path = require('path');
let bodyParser = require('body-parser');
let mongoose = require('mongoose');
mongoose.connect('mongodb://localhost:27017/test', { useMongoClient: true });
require('./Models/InitModels');

let app = express();
app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true}));

let routes = require('./Routes/APIRoutes');
routes(app);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
    res.status(404);
    console.log("Returning 404 to request");
});

app.set('port', 2017);
app.listen(2017);
console.log("Starting API Controller");

API 路线（这里只有 Karte 很重要）：

module.exports = function(app) {
let benutzer = require('../Controller/BenutzerController');
let gruppe = require('../Controller/GruppenController');
let zugriffslog = require('../Controller/ZugriffsLogController');
let karten = require('../Controller/KartenController');
let zugriffszeit = require('../Controller/ZugriffsZeitenController');

app.route('/karten')
    .put(karten.put)
    .post(karten.post)
    .delete(karten.delete);

然后是 KartenController：

exports.post = (req, res) => {
    if (req.body.search) {
        Karte.find(req.body.search)
            .populate('benutzer').populate('gruppen')
            .exec((err, karten) => {
                res.json(karten)
            });
    } else if(req.body.karte) {
        if (this.createdKarte !== null) {
            res.json({"error": {"code": 110}}); // card needs to be scanned
        } else {
            let newKarte = new Karte(req.body.karte);
            newKarte.save();
            //this.createdKartenDatum = new Date();
            res.json(newKarte);

            // Add Karte To User
            //Benutzer.findOneAndUpdate({_id: newKarte.benutzer}, {$push: {karten: newKarte._id}});
            //Benutzer.findOneAndUpdate({_id: newKarte.benutzer}, {$pull: {karten: newKarten._id}});

            this.kartenCreateDatum = new Date();
            this.createdKarte = newKarte;
            this.kartenScannPending = true;

            // Abort after some time
            setTimeout(scannTimeExpired, timeTillCreationExpires);
        }
    } else if(req.body.status) {
        if (this.kartenScannPending) {
            res.json({"status": {"code": 300}}); // waiting for card to be scanned
        } else if (this.kartenScannFehler !== null) {
            res.json(this.kartenScannFehler); // fehler aufgetreten
            this.kartenScannFehler = null; // aufräumen
        } else if (this.kartenScannErfolgreich) {
            res.json({"status": {"code": 500, "date": this.kartenCreateDatum}}); // karte gescanned
            this.kartenScannErfolgreich = false;
        } else {
            res.json({"status": {"code": 404}}); // no card needs to be scanned
        }
    } else {
        res.json({ "error": "U SUCK" });
    }
};

exports.put = (req, res) => {
    console.log("Trying to put a Card)");
    if (req.body.karte) {
        if (req.body.karte.name && req.body.karte._id) {
            Karte.findOneAndUpdate({_id: req.body.karte._id}, {$set: req.body.karte}, {new: true},(err, karte) => res.json(karte));
        } else {
            res.json({"error": {"code": 120}});
        }
    } else {
        res.json({"error": {"code": 120}});
    }
};

我的 Javascript 如下所示：

$.ajax({
    type: "POST",
    context: this,
    url: "http://localhost:2017/karten",
    data: {
        search: {
            benutzer: {
                _id: this.benutzer._id
            }
        }
    },
    async: true,
    success: function (data) {
        console.log(data);
    },
    dataType: "json"
});

// Zugriffszeiten abfragen
$.ajax({
    type: "PUT",
    context: this,
    url: "http://localhost:2017/karten",
    data: {
        karte: {
            _id: this.karte._id,
            name: "PLS WORK !!!"
        }
    },
    async: true,
    success: function (data) {
        console.log(data);
    },
    dataType: "json"
});

结果：

第一个：

正在工作并给了我两张卡片的数组

第二个：

给我一​​个 ERR::EMPTY_RESPONSE（因为 404） 并且nodejs控制台输出“返回404请求”

用 Postman 尝试同样的方法，一切正常，卡片得到更新

我真的希望有人能帮我解决这个问题，因为我已经为此工作了很长时间，而且似乎看不出我的错误。

感谢您阅读所有内容:)

Answer 1

感谢jfriend00，我找到了问题的解决方案。我没有正确响应选项请求。 我不得不在我的 APIController 中添加几行代码：

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "POST, GET, PUT, DELETE");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");

    // The routes wont fire on that options-request, so it sends a 404 response and thus the ajax request times out
    //intercepts OPTIONS method
    if ('OPTIONS' === req.method) {
        //respond with 200
        console.log("Received options request");
        res.send(200);
    }
    else {
        //move on
        next();
    }
});

现在一切正常。