I use axios for calling API (in front-end). I use the method "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);
});

I got a 405 Method Not Allowed. The method is "OPTIONS" but I use the method ".get()". 405 Method Not Allowed. Method OPTIONS

I test call api with postman and I get 200 OK :

postman 200 OK screenshot

Anyone has an idea ?

I use axios for calling API (in front-end). I use the method "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);
});

I got a 405 Method Not Allowed. The method is "OPTIONS" but I use the method ".get()". 405 Method Not Allowed. Method OPTIONS

I test call api with postman and I get 200 OK :

postman 200 OK screenshot

Anyone has an idea ?

• javascript
• symfony
• cors
• axios
• preflight

• 1 OPTIONS is a pre-flight request that checks if the server you GET/POST from, allows you to GET/POST at all. It's probably some config setting on the server that's blocking your GET. – Shilly Commented Feb 9, 2017 at 13:01
• In the Response headers, I got Access-Control-Allow-Origin:"*" and Allow:"GET, HEAD, POST, PUT, DELETE" so I think GET method is available. – riwanab Commented Feb 9, 2017 at 13:08
• 1 Maybe try changing the Access-Control-Allow-Origin:" * " to the actual origin. Not all browsers allow ACAO="*". But that would normally create a different error, so not sure. I'm sorry, out of other ideas. – Shilly Commented Feb 9, 2017 at 13:12
• Thanks for your answers. ACAO="*" is working for : testapi.post( '/login_check', querystring.stringify({ _username: 'adherent0', _password: 'adherent0' }) so I don't think this is the problem. I think : var configs = { headers: { 'Authorization': 'Bearer ' + token, 'Agency': 'demo0' } }; is the problem but I don't know what I doing wrong – riwanab Commented Feb 9, 2017 at 13:53

2 Answers 2

Like @Shilly says, OPTIONS method is pre-flight on modern browsers when Preflighted requests conditions (MDN) :

In the response header I had Allow:"GET, HEAD, POST, PUT, DELETE". So OPTIONS method is not available and need to configure it on in the server (Apache).

I do the change on 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"

In Request headers I have :

Origin: "null" is a problem. The cause is :

file:// URLs produce a null Origin which can't be authorized via echo-back. Don't trying to perform a CORS request from a file:// URL (see this post for more details)

After put my javascript file on a apache server, the Origin was not null but I need to add NelmioCorsBundle to my Symfony project to allow preflight

So the way to solve this npm install qs.

Then:

import qs from 'qs'

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