我正在尝试将表单数据从React / Redux发送到本地托管的Express.js服务器 . 但是,我收到了CORS错误:
Access to XMLHttpRequest at 'http://localhost:4000/api/donate' from
origin 'http://localhost:3000' has been blocked by CORS policy: Response
to preflight request doesn't pass access control check: No 'Access-
Control-Allow-Origin' header is present on the requested resource.
VM6535:1 Cross-Origin Read Blocking (CORB) blocked cross-origin
response http://localhost:4000/api/donate with MIME type text/html. See
https://www.chromestatus.com/feature/5629709824032768 for more details.
createError.js:17 Uncaught (in promise) Error: Network Error
at createError (createError.js:17)
at XMLHttpRequest.handleError (xhr.js:87)
这是我设置为使Express.js接收我的React数据的初始CORS策略:
// index.js in the backend project
let cors = require("cors");
const corsOptions = {origin : "http://localhost:3000/" }; // React app is on port 3000
router.post('/api/donate', cors(corsOptions), (req, res, next) => { ....
我以前使用字符串数据向Stripe发送测试信用卡费用并且没有任何错误 . 现在唯一不同的是,在我只使用 react-stripe-elements
的表单/输入组件发送数据之前,现在我也从我的Redux商店发送一些数据 .
即使现在出现此错误,Stripe仍然会响应部分令牌数据(可能是默认值,不确定) .
我的CORS政策缺少什么?我认为白名单localhost:3000会修复它,它似乎 . 但它仍然发出上述错误 .