快速节点服务器的 Firefox CORS 失败

Question

我将 Express.js 与 CORS 中间件一起使用。我在 Firefox v73.0.1（64 位）上出现了非常奇怪的行为

清理 firefox 配置文件...所以没有缓存。

1. 我尝试直接请求http://localhost/search?q=AMZN，我得到了预期的结果。
2. 我打开在 localhost:3000 上运行的 web 应用程序。所有这些请求都没有使用 TLS/SSL。
3. 我收到“跨源请求被阻止：同源策略不允许在http://localhost/search?q=AMZN读取远程资源。（原因：CORS 请求没有成功）。” 当它尝试访问 API 服务器后端时。
4. 我刷新了直接访问 localhost 的另一个选项卡（之前成功的请求相同），然后我得到了“连接重置”。

Chrome 不会这样做...

我一直在看wireshark，Firefox 只是发送一个GET 请求（其中几个？为什么？？我只做一个），发送标头等，然后是连接重置。

听起来像节点做错了什么？或者我不知道。

const express = require('express');
const fetch = require('node-fetch');
const util = require('util');
const app = express();
const port = 80;

var cors = require('cors')

var copts = {
  origin: function (origin, callback) {
      console.log('yeah');
    // allow all
    callback(null, true);
  }
}

const SEARCH_URL = 'https://api.stocktwits.com/api/2/streams/symbol/%s.json';

app.get('/search', cors(copts), (req, res) => {

“是的”部分永远不会被击中。

非常简单的客户端代码。

return fetch(BACKEND_URL + uri).then(response => {

尝试删除 CORS 中间件并添加这些标头，基于在 chrome 中检查 github 的跨浏览器请求响应

    res.header('Access-Control-Allow-Methods', 'GET');
    res.header('Access-Control-Max-Age', '3600');
    res.header('Vary', 'Origin, Access-Control-Request-Headers, Access-Control-Request-Method, Accept-Encoding');
    res.header('Access-Control-Allow-Origin', '*');

我并没有真正捕获选项处理程序，所以也许这并不重要。我在 GET 响应中找到了这些标头。

Answer 1

节点服务器可能会因无效请求而崩溃，因此您会收到重置错误。

使用 cors 包：

您需要optionsSuccessStatus在cors某些旧浏览器的选项中添加属性 。并OPTIONS handler启用飞行前请求。

const express = require('express');
const fetch = require('node-fetch');
const util = require('util');
const app = express();
const port = 80;
var cors = require('cors')
var copts = {
    origin: function (origin, callback) {
        console.log('yeah');
        callback(null, true);
    },
    optionsSuccessStatus: 200
}
app.options("*", cors(copts));
const SEARCH_URL = 'https://api.stocktwits.com/api/2/streams/symbol/%s.json';
app.get('/search', cors(copts), (req, res) => { });

With headers.: 你Access-Control-Allow-Headers在 response中丢失headers，你需要Access-Control-Allow-Headers在 response header 中添加header 以允许Access-Control-Allow-Originheader。

尝试这个。

const express = require('express');
const fetch = require('node-fetch');
const util = require('util');
const app = express();
const port = 80;
var cors = require('cors')
var copts = {
    origin: function (origin, callback) {
        console.log('yeah');
        // allow all
        callback(null, true);
    }
}
const SEARCH_URL = 'https://api.stocktwits.com/api/2/streams/symbol/%s.json';
app.get('/search', (req, res) => { 
    res.header('Access-Control-Allow-Methods', 'GET, OPTIONS');
    res.header('Access-Control-Allow-Headers', 'Origin');
    res.header('Access-Control-Allow-Origin', '*');
    res.status(200).send("Ok")
});