Javascript &引用；“访问控制允许来源”；客户端使用Vue.js，服务器端使用Express时出现CORS问题

我正在尝试使用Vue.js和Axios在Jazz上调用API，但出现以下错误：

访问位于“”的XMLHttpRequest _此处“来自源”已被CORS策略阻止：对飞行前请求的响应未通过访问控制检查：否 “Access Control Allow Origin”标头出现在请求的服务器上 资源

我一直在寻找其他解决方案，比如

"Content-Type": "application/json",
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods": "OPTIONS",
"Access-Control-Allow-Headers": "Content-Type, Authorization",
"Access-Control-Allow-Credentials": "true"

到我的代码，它仍然没有工作。即使我为Access Control Allow Origin执行了通配符，我仍然会遇到CORS问题，无法调用我的API。我在客户端使用Vue和Typescript，并设法让Express在服务器端工作。以下是我的Axios API调用的代码片段：

return Axios.post('https://jazz.api.com/api/extra_stuff_here', context.getters.getRequest,
        {
          headers: {
            "Content-Type": "application/json",
            "Access-Control-Allow-Origin": "*",
            "Access-Control-Allow-Methods": "OPTIONS",
            "Access-Control-Allow-Headers": "Content-Type, Authorization",
            "Access-Control-Allow-Credentials": "true"
          }
        }
      )

这是我在这个TypeScript文件中调用API的地方，这是我的server.js：

var express = require('express');
var path = require('path');
var cors = require('cors');
var bodyParser = require('body-parser');
var morgan = require('morgan');

var app = express();
app.use(morgan('dev'));
app.use(cors());
app.use(bodyParser.json());

var publicRoot = './dist';

//app.use(express.static(path.join(__dirname, '/dist')));
app.use(express.static(publicRoot));

app.get('/', function (req, res) {
    res.sendFile("index.html", { root: publicRoot });
});

app.use(function(req, res, next) { 
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Authorization");
    res.header("Content-Type", "application/json");
    res.header("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
    res.header("Access-Control-Allow-Credentials", "true");
    next();
}); 

app.listen(process.env.PORT || 80, function() {
    console.log("listening on port 80");
});

---

不管我怎么做，我都无法解决CORS的问题。在我将express添加到应用程序之前，我仍然遇到同样的问题，认为服务器端的express可能会解决CORS问题。然而，这没有帮助。之前，我通过执行npm运行服务来运行我的Vue应用程序。但是任何帮助都会很好！这可能是Jazz的问题吗？

您已经添加了cors中间件，但尚未为选项请求启用它

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

尝试向服务器添加类似的内容以启用它。 您可以在此处的express docs中进一步阅读

---

您已经添加了cors中间件，但尚未为选项请求启用它

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

尝试向服务器添加类似的内容以启用它。 您可以在此处的express docs中进一步阅读

---

更新：我没有设法解决Axios的CORS问题，但我确实找到了解决办法。我没有使用Axios库，而是使用

fetch

调用API。由于我的请求调用只需传入参数并根据参数获取数据，因此我的应用程序使用

fetch

。当我进行研究时，我发现使用

fetch

？但是，嘿，它对我有效，所以我将坚持这个解决方案。以下是我的代码，供任何人参考：

return fetch('https://dev.jazz.com/api/stuff_goes_here', {
  method: 'post',
  body: JSON.stringify(<request object goes here>)
}).then((res) => res.json())
.then((data) => {
  return data;
}).catch((err)=>console.log(err))

return-fetch（'https://dev.jazz.com/api/stuff_goes_here', {
方法：“post”，
正文：JSON.stringify（）
}).然后（（res）=>res.json（））
。然后（（数据）=>{
返回数据；
}).catch（（err）=>console.log（err））

更新：我没有设法解决Axios的CORS问题，但我确实找到了解决方法。我没有使用Axios库，而是使用

fetch

调用API。由于我的请求调用只需传入参数并根据参数获取数据，因此我的应用程序使用

fetch

。当我进行研究时，我发现使用

fetch

？但是，嘿，它对我有效，所以我将坚持这个解决方案。以下是我的代码，供任何人参考：

return fetch('https://dev.jazz.com/api/stuff_goes_here', {
  method: 'post',
  body: JSON.stringify(<request object goes here>)
}).then((res) => res.json())
.then((data) => {
  return data;
}).catch((err)=>console.log(err))

return-fetch（'https://dev.jazz.com/api/stuff_goes_here', {
方法：“post”，
正文：JSON.stringify（）
}).然后（（res）=>res.json（））
。然后（（数据）=>{
返回数据；
}).catch（（err）=>console.log（err））

-试试这个解决方案。@CheezyCode刚刚试过，但仍然没有成功。。仍然存在CORS问题..从客户端代码中删除访问控制-*头它们不属于那里，并且不会更改服务器处理CORS的方式因此，您的express代码中没有定义post（）路由，只有use（）和get（）@PatrickEvans好的，我删除了它！当然，我还是会遇到同样的问题——有什么办法可以解决吗试试这个解决方案。@CheezyCode刚刚试过，但仍然没有成功。。仍然存在CORS问题..从客户端代码中删除访问控制-*头它们不属于那里，并且不会更改服务器处理CORS的方式因此，您的express代码中没有定义post（）路由，只有use（）和get（）@PatrickEvans好的，我删除了它！当然，我仍然会遇到同样的问题——有什么办法可以解决吗？我不知道我必须这么做。我刚试过，但运气不好。我仍然得到同样的CORS问题。我现在想知道这是否与爵士乐有关？我不知道我必须这么做。我刚试过，但运气不好。我仍然得到同样的CORS问题。我现在想知道它是否与爵士乐有关？当Axios不这样做的时候，如何才能获得可能的工作？他们不是在引擎盖下做同样的事情吗？当Axios不这样做的时候，他们怎么能找到可能的工作呢？他们不是在引擎盖下做同样的事情吗？