如何解决从 javascript 中的不同 url 获取 json 数据的跨域问题？

Question

我正在尝试从 URL 获取 JSON 数据，但它给了我一个错误（跨源请求被阻止：同源策略不允许读取位于 http://core.agricx.com/api/Apiagricx/get_config_test 的远程资源。（原因：CORS 标头 'Access-Control- Allow-Origin' 缺失）。

后端代码（节点js）

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

前端代码(dashboard.js)

fetch('https://core.agricx.com/api/Apiagricx/get_config_test', {
    method: "GET",
    credentials: "include",
    cache: "no-cache"
})
.then(response => response.json())
.then(out => {
   console.log("for out");
   console.log(out);
})
.catch(err => {
   console.log("for err");
   console.error(err);
});

我希望您可以在直接输入 URL 时看到 JSON 数据输出。但是代码将进入 catch 块并阻止我从该 URL 获得的响应。

Answer 1

一个简单的方法是使用 node.js 包cors。

安装包cors，并在server.js 或任何您的节点代码的开头包含以下代码。

var cors = require('cors')

var app = express()
app.use(cors())

有关更多详细信息和配置选项，请参阅related npm page。