反应连接到节点Cors预检失败

节点服务器

var app = express(); app.use(function(req, res, next) { res.header('Access-Control-Allow-Credentials', true); res.header('Access-Control-Allow-Origin', req.headers.origin); res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE'); res.header('Access-Control-Allow-Headers', 'X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept'); if ('OPTIONS' == req.method) { res.send(200); } else { next(); } }); 

React JS Fetch

 function request(url, options) { return fetch(url, options) .then(checkStatus) .then(parseJSON); } export function* login() { const username = yield select(makeSelectUsername()); const password = yield select(makeSelectPassword()); const requestURL = 'http://myurlhere.com:1337/user/login/'; const requestOptions = { method: 'POST', mode: 'cors', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, body: JSON.stringify( {username: username, password: password} ) } try { const result = yield call(request, requestURL, requestOptions); yield put(loginApiCallSuccess(result)); } catch (err) { yield put(loginApiCallFailure(err)); } } 

我需要帮助确定我的请求或服务器端处理哪里有问题，在预检失败后，chrome会取消我的请求，又或者我的预检请求失败。

我在本地主机上运行反应，并使用不同的URL连接到远程服务器。

从我可以告诉预检请求失败，那么铬是取消请求。 但是，当我在本地运行请求时，login仍然成功地在节点端login路由。

在单步执行代码时，在执行预检操作之后，实际调用中的服务会收到400错误。 如果我运行这个调用，并且不通过，我会在开发工具的networking选项卡中得到（取消）。 但是每次在服务器端调用都是成功的。

 General Request URL:http://jenkins.murmillosoftware.com:1337/user/register/ Request Method:POST Status Code:400 Bad Request Remote Address:52.5.222.29:1337 Referrer Policy:no-referrer-when-downgrade Response Headers view source Access-Control-Allow-Credentials:true Access-Control-Allow-Headers:X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept, Origin Access-Control-Allow-Methods:GET,PUT,POST,DELETE Access-Control-Allow-Origin:http://127.0.0.1:3000 Connection:keep-alive Content-Length:47 Content-Type:application/json; charset=utf-8 Date:Wed, 16 Aug 2017 22:24:48 GMT ETag:W/"2f-vn6Bxm14Gkpb5HFTCsgU2h3Nq3o" set-cookie:connect.sid=s%3AjPVtqIoi6zy0QPmhfFkprFObfwj_J-Lw.sPvW3qRc1Vwj4R6qFBtW0oXykF68Qn%2FAwmLCWrg51qc; Path=/; HttpOnly X-Powered-By:Express Request Headers view source Accept:application/json Accept-Encoding:gzip, deflate Accept-Language:en-US,en;q=0.8 Cache-Control:no-cache Connection:keep-alive Content-Length:44 Content-Type:application/json Host:jenkins.murmillosoftware.com:1337 Origin:http://127.0.0.1:3000 Pragma:no-cache Referer:http://127.0.0.1:3000/login? User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36 Request Payload view source {username: "fdasfas", password: "asdfasdf"} password : "asdfasdf" username : "fdasfas" 

Answer 1

你有没有试过快递/ Cors我最近也有访问允许来源问题，然后我下载快递/ Cors从

 npm install cors 

然后添加你的程序

 var express = require('express') var cors = require('cors') var app = express() app.use(cors()) app.get('/products/:id', function (req, res, next) { res.json({msg: 'This is CORS-enabled for all origins!'}) }) app.listen(80, function () { console.log('CORS-enabled web server listening on port 80') }) 

你也可以在[link] https://github.com/expressjs/cors中看到其他方法使用cors