使用 Polymer Iron-ajax 和 Node.js 发出 CORS 请求

2022-01-15 00:00:00 cors express ajax polymer

我正在尝试使用 Polymer 和 Node 检索数据,但正在努力获得有效的响应.我收到一个飞行前响应错误,提示 access-control-allow-origin 是不允许的.

I am trying to retrieve data using Polymer and Node, but am struggling to get a valid response back. I get a pre-flight response error that says the access-control-allow-origin is not allowed.

我在 localhost:4001 上运行 Polymer,在 localhost:8080 上运行 Node.

I am running Polymer on localhost:4001 and Node on localhost:8080.

如何配置节点或客户端以加载响应?

How can I configure either Node or the Client to load a response?

客户

<iron-ajax id="ajaxUser"
  url="http://localhost:8080/node/api/mssql/login"
  method="post"
  handle-as="json"
  Content-Type="application/json"
  headers='{"Access-Control-Allow-Origin": "*"}'
  params="[[params]]"
  on-response="saveUserCredentials"
  last-response="{{user}}"></iron-ajax>

节点

const corsOptions = {
  allowedHeaders: ['Content-Type', 'Access-Control-Allow-Origin']
}

app.options('*', cors(corsOptions))

...

app.use((req, res, next) => { // Enable Cross-Origin Resource Sharing (CORS)
  res.header("Access-Control-Allow-Origin", "*")
  res.header("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT")
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Authorization, x-api-key")
  next()
})

错误

加载失败
http://localhost:8080/login?username=user&password=password:
请求的资源上不存在Access-Control-Allow-Origin"标头.
因此,Origin 'http://localhost:4001' 是不允许访问的.响应的 HTTP 状态代码为 400.

Failed to load
http://localhost:8080/login?username=user&password=password:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:4001' is therefore not allowed access. The response had HTTP status code 400.

推荐答案

问题代码段中的Node配置没有处理OPTIONS请求.

The Node configuration in the code snippet in the question doesn’t handle OPTIONS requests.

为了确保正确处理 CORS 预检,考虑安装 npm cors 包:

To ensure CORS preflights get handled correctly, consider installing the npm cors package:

npm install cors

然后做这样的事情:

var express = require('express')
  , cors = require('cors')
  , app = express();
app.options('*', cors()); // preflight OPTIONS; put before other routes

这将处理预检响应和其他 CORS 方面,而无需您在应用程序代码中从头开始手动编写自己的处理.

That’ll handle the preflight response and other CORS aspects without you needing to manually write your own handling from scratch in your application code.

https://www.npmjs.com/package/cors#configuration-option 提供了所有选项的更多详细信息.

https://www.npmjs.com/package/cors#configuration-option has more details on all the options.

相关文章