axios调用api用GET变成OPTIONS答案

【问题标题】：Axios call api with GET become OPTIONSaxios调用api用GET变成OPTIONS
【发布时间】：2017-06-27 12:01:53
【问题描述】：

我使用 axios 来调用 API（在前端）。我使用“GET”方法：

import axios from 'axios';
import querystring from 'querystring';

var url   = "mydomain.local",
    token = "blablabla...blabla";  

var configs = {
    headers: {
        'Authorization': 'Bearer ' + token,
        'Agency': 'demo0'
    }
};

var testapi = axios.create({
        baseURL: 'http://api.' + url
    });

testapi.get( '/relativeUrl', configs
).then(function (response) {
    console.log(response);
}).catch(function (error) {
    console.log(error);
});

我得到了一个 405 Method Not Allowed。方法是“OPTIONS”，但我使用方法“.get()”。 405 Method Not Allowed. Method OPTIONS

我用邮递员测试调用 api，我得到 200 OK：

postman 200 OK screenshot

有人有想法吗？

【问题讨论】：

OPTIONS 是一个飞行前请求，用于检查您 GET/POST 来自的服务器是否允许您进行 GET/POST。可能是服务器上的某些配置设置阻止了您的 GET。
在响应头中，我得到了 Access-Control-Allow-Origin:"*" 和 Allow:"GET, HEAD, POST, PUT, DELETE" 所以我认为 GET 方法是可用的。跨度>
也许尝试将 Access-Control-Allow-Origin:" * " 更改为实际来源。并非所有浏览器都允许 ACAO="*"。但这通常会产生不同的错误，所以不确定。对不起，出于其他想法。
感谢您的回答。 ACAO="*" 正在为：testapi.post( '/login_check', querystring.stringify({ _username: 'adherent0', _password: 'adherent0' }) 工作，所以我认为这不是问题所在。我认为：var configs = { headers: { 'Authorization': 'Bearer ' + token, 'Agency': 'demo0' } }; 是问题，但我不知道我做错了什么

标签： javascript symfony cors axios preflight

【解决方案1】：

就像@Shilly 所说，当Preflighted requests conditions (MDN) 时，OPTIONS 方法在现代浏览器上是预运行的：

在响应头中我有Allow:"GET, HEAD, POST, PUT, DELETE"。所以OPTIONS方法不可用，需要在服务器（Apache）上配置。

我在 apache (/etc/apache2/sites-available/000-default.conf) 上进行更改：

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers "*"
Header set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

在请求标头中我有：

Origin: "null" 是个问题。原因是：

file:// URLs 产生一个空的 Origin 不能通过授权回声。不要尝试从 file:// URL (see this post for more details) 执行 CORS 请求

将我的 javascript 文件放在 apache 服务器上后，Origin 不为空，但我需要将 NelmioCorsBundle 添加到我的 Symfony 项目中以允许预检

【讨论】：

【解决方案2】：

那么解决这个问题的方法npm install qs。

然后：

import qs from 'qs'

function send(params) {
  return axios.post('/api/create/', qs.stringify(params))
}

【讨论】：