Question

我想通过以下评论中的Brahma Dev和一些在线阅读。在这里为人们提供解决方案，并在我最终回来时。

未为预检请求(OPTIONS verb)指定标题，但对于正常情况＆＃39;请求（POST，在我的情况下）。这就是ARC和Chrome控制台之间标题不同的原因。一旦我弄清楚这一点，我认为该模块对我来说没用，因为我可以自己设置所有标题。所以我删除了它，并为＆＃39; / auth＆＃39;添加了OPTTIONS路由。包含所有请求的标题：

// preflight request for /auth
router.options('/auth', function(req, res){
    res.header('Access-Control-Allow-Origin', 'https://domain');
    ...
    res.end()
});

现在一切正常：]

我使用的是fetch而不是jQuery的ajax，因为我需要在调用API之后设置cookie。

正如我在标题中所说，fetch似乎是错误地读取标题。我有一个包含以下javascript代码的页面：

var data = { 'user': 'test', 'pass': 'test' }; // read from a form
var headers = new Headers();
headers.append('Content-Type', 'application/json');
headers.append('Accept', 'application/json');
fetch('https://domain:port/api/auth', {
    method: 'POST',
    credentials: 'include',
    headers: headers,
    body: JSON.stringify(data)
}).then(function(data){
    $('#result').text(data);
    console.log(data);
}).catch(function(err){
    $('#result').text(err);
    console.log(err);
});

服务器端，我设置了一条带快递的路线，cors module就像这样：

const express = require('express');
const app = express();
const router = express.Router();
app.use(cors());

var corsOptions = {
  origin: 'https://domain',
  optionsSuccessStatus: 200
}

router.post('/auth', cors(corsOptions), function(req, res){
    console.log('Auth request received');
    res.setHeader('Content-Type', 'application/json');
    res.setHeader('Access-Control-Allow-Credentials', true);
    res.setHeader('Access-Control-Allow-Origin', 'https://domain');
    res.json({'msg':'test'});
});

app.use('/api', router);

在chrome上，我从控制台获得以下异常：

Fetch API无法加载https://domain:port/api/auth。对预检请求的响应没有通过访问控制检查：＆＃39;访问控制 - 允许 - 来源＆＃39;响应中的标题不能是通配符＆＃39; *＆＃39;当请求的凭据模式为＆＃39; include＆＃39;时。起源＆＃39; https://domain＆＃39;因此不允许访问。

在不使用CORS模块的情况下，fetch似乎没有看到我设置了Access-Control-Allow-Origin，因为我得到一个异常，告诉我在请求的资源上没有这种类型的头。我也试过使用＆＃39; set＆＃39;方法而不是＆＃39; setHeader＆＃39;。

我可以使用Advanced REST Client查看标题并获得响应。这里发生了什么？

Javascript fetch从快速响应中读取错误的标题？

0 个答案: