无法让 CORS 在 Firefox 中工作

Question

我正在尝试获取一个使用 MEAN 堆栈的简单示例，但我注意到我的 DELETE 请求在 Firefox 中不起作用。我相信这是由于 CORS。

当我单击链接以向我的 ExpressJS 后端提交带有 angularJS 的 DELETE 请求时，我看到首先调用了 GET 请求，然后调用了实际的 DELETE 请求，但 DELETE 请求从未完成。

这一切似乎在 Chrome 中都可以正常工作。没有调用意外的 GET 请求，并且 DELETE 请求实际上完成了。如何在 Firefox 中进行这项工作？

cors 的快递部分：

// CORS Stuff in app.js
app.all('*', function (req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With, Content-Type, Authorization, Content-Length");
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');

    if(req.method == 'OPTIONS') {
      res.send(204);
      //next();
    } else {
      next();
    }

    //res.send(200);
});

app.get('/notes', note.get(db));
app.post('/notes', note.create(db));
app.put('/notes/:id', note.update(db));
app.delete('/notes/:id', note.delete(db));

然后我有这个 note.js 文件

exports.delete = function(db) {
    return function(req, res) {

        console.log('were in delete middleware');

        //var note_id = req.body.id;
        var note_id = req.params.id;

        console.log("note_id = "+note_id);

        var collection = db.get('notes');
        collection.remove(
            {_id: note_id}
        ),

        function(err, doc) {
            console.log('were in delete middleware function');
            // If it failed, return error
            if (err) {
                console.log('were in delete error');
                res.send("There was a problem deleting that note from the database.");
            } else {
                console.log('were in delete success');
                res.send(200);
            }
        }
    }
}

我的浏览器网址是http://localhost:63342/express_example/public/#/

更新

我的服务器用这个来响应预检请求：

服务器控制台： 选项 /notes/53568807130e0f701f000001 200 0ms - 2b GET /notes 304 8ms

浏览器控制台：

Answer 1

所以这不是 CORS 的问题，您的代码中有一个小逻辑错误。

问题在于这个调用：

collection.remove(
    {_id: note_id}
),

我将假设它需要第二个参数，它是一个回调函数，这可能就是您以, 而不是; 结束语句的原因。此外，您将回调函数定义为下一条语句，但从不使用它。因此，为什么删除永远不会结束，回调永远不会被调用，因为它没有传递给collection.remove() 调用。

试试这个：

var collection = db.get('notes');
collection.remove(
    {_id: note_id},
    function(err, doc) {
        console.log('were in delete middleware function');
        // If it failed, return error
        if (err) {
            console.log('were in delete error');
            res.send("There was a problem deleting that note from the database.");
        } else {
            console.log('were in delete success');
            res.send(200);
        }
    });

不确定为什么这适用于 Chrome 而不是 firefox，但如果不得不猜测，Chrome 可能会从您的 CORS 处理程序中获取 204 并且只是接受它。这只是一个猜测，因为您在上面发布的代码永远不会向客户端返回响应。

Answer 2

除非您的 Express 处理程序实际删除了该对象，否则您可能不应该使用 204 响应自动回复。您没有在此处发布您的处理程序，但对于 Mongoose/MongoDB，它可能看起来像：

app.delete('/records/:recordId', function(req, res){
  req.record.remove(function(err){
    if (err) {
      console.log("Error deleting record");
      return res.json(500, {error: err});
    }
    return res.json(204);
  });
});

Answer 3

您所做的问题是它打开您的服务器以接收来自所有域的请求。之前失败的原因是，如果您注意到请求标头的主机为 localhost: 3000，但您的服务器只接受来自 localhost: 63342 的请求

您可能不必担心将其开放给所有域，除非您担心其他人制作的应用程序会访问您的服务器，该应用程序将在客户端计算机上运行。任何人都可以使用 fiddler 或任何 REST 客户端（如 Advanced REST Client）访问服务器。