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

Question

我尝试从 URL 获取 JSON 数据，但出现错误(跨源请求被阻止:同源策略不允许读取 http://core.agricx.com/api/Apiagricx/get_config_test 处的远程资源。(原因:缺少 CORS header “Access-Control-Allow-Origin”)。

后端代码(node 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 block 并阻止我从该 URL 获得的响应。

Answer 1

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

安装软件包，cors ，并在 server.js 或任何 Node 代码的开头包含以下代码。

var cors = require('cors')

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

请参阅related npm page了解更多详细信息和配置选项。