Access-Control-Allow-Headers不允许请求头字段X-CSRF-TOKEN

Question

Access-Control-Allow-Headers不允许请求头字段X-CSRF-TOKEN

我正在使用vue和axios进行embed.rock的get请求.

axios({
  method: 'get',
  url: 'https://api.embed.rocks/api?url=' + this.url,
  headers: {
      'x-api-key': 'my-key'
  }
})

Run Code Online (Sandbox Code Playgroud)

当我使用CDN获取带有内联脚本的vue和axios时,我的代码工作正常,我得到了回复.

当我使用外部脚本引用已安装的vue和axios scrpts时,代码不再运行,并且出现以下错误:

无法加载https://api.embed.rocks/api?url=https://www.youtube.com/watch?v=DJ6PD_jBtU0&t=4s:请求标头字段访问控制不允许使用X-CSRF-TOKEN - 飞行前响应中的标题.

当我点击控制台中的错误时,它只会让我:

<!DOCTYPE html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Chi*_*ung 8

Laravel正在设置一个全局配置,以自动包含X-CSRF-TOKEN在您的bootstrap.js文件中的请求标题中.

let token = document.head.querySelector('meta[name="csrf-token"]');
if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}

Run Code Online (Sandbox Code Playgroud)

因此,如果要删除令牌,可以像这样实现:

var instance = axios.create();
delete instance.defaults.headers.common['X-CSRF-TOKEN'];

instance({
    method: 'get',
    url: 'https://api.embed.rocks/api?url=' + this.url,
    headers: {
        'x-api-key': 'my-key'
    }
});

Run Code Online (Sandbox Code Playgroud)

归档时间：	7 年，6 月前
查看次数：	4447 次
最近记录：	7 年，4 月前