heroku - Angular 2 : X-XSRF-TOKEN is not allowed by Access-Control-Allow-Headers

标签 heroku angular xmlhttprequest cors

我今天正在努力解决这个问题,因为我正在实现跨站点 API 调用。最糟糕的是它在我的本地环境中运行良好,但一旦在 heroku 上,它就会失败并出现以下错误:

XMLHttpRequest cannot load https://restcountries.eu/rest/v1/all. Request header field X-XSRF-TOKEN is not allowed by Access-Control-Allow-Headers in preflight response.

这是触发调用的函数:

  let observable = this._http
    .get(GEO_API_URL + query)
    .map(response => response.json())
    .do(val => {
      this.cache = val;
      observable = null;
    })
    .share();

  return observable;

有什么想法吗?

谢谢。

最佳答案

有同样的问题。
就我而言,原因是在我的 Chrome cookie 中保存了 X-XSRF-TOKEN 字段。 Chrome 以某种方式向 OPTION 请求添加了 header “Access-Control-Request-Headers: x-xsrf-token”。在 Firefox 中,同一页面工作正常,在隐身模式 Chrome 中也是如此。
所以我只是删除了这个 cookie 字段 (X-XSRF-TOKEN),仅此而已。

关于heroku - Angular 2 : X-XSRF-TOKEN is not allowed by Access-Control-Allow-Headers,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38589944/

相关文章:

php - 在 Heroku PHP 上设置新遗迹

angular - ngrx 突出显示网格中新添加的项目

angular - 带有 { emitEvent : false } triggers valueChanges on Angular 4 formgroup 的补丁值

javascript - CE-HTML开发

node.js - Heroku 似乎构建了客户端,但我没有看到 dist 文件夹

node.js - Heroku:错误:找不到模块node-gyp

postgresql - 在 Heroku 上与 Go + Postgres 的连接被拒绝

javascript - 如何知道 Angular (v5) Reactive-Form 是否是从本身是自定义组件的表单字段提交的?

google-app-engine - Google Cloud Storage - 使用 XMLHttpRequest 直接上传会导致 "Access-Control-Allow-Origin"-error

javascript - 在 JavaScript 中,我如何测试在给定时刻是否有任何 AJAX 调用在后台运行?