Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers in preflight response

I send POST request to other server api and get error

XMLHttpRequest cannot load http://example.com/api/v1/auth. Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers in preflight response.

After that, I config vue headers like this.

Vue.http.options.xhr = {withCredentials: true}
Vue.http.options.emulateJSON = true
Vue.http.options.emulateHTTP = true
Vue.http.options.crossOrigin = true

Vue.http.headers.common['Access-Control-Allow-Origin'] = '*'
Vue.http.headers.common['Content-Type'] = 'application/x-www-form-urlencoded'
Vue.http.headers.common['Accept'] = 'application/json, text/plain, */*'
Vue.http.headers.common['Access-Control-Allow-Headers'] = 'Origin, Accept, Content-Type, Authorization, Access-Control-Allow-Origin'

but, that error has occurred. Can you give me correct config Vue-resouce to fix this problem.

Thanks so much.

[adexphem]

I tried this inside js/bootsrap.js

window.axios.defaults.headers.common = { ‘Accept’: ‘application/json’, ‘Content-Type’: ‘application/json’ };

That worked for me after spending more than 4 hours battling with same error. I’m on Laravel, Vuejs 2.4.2 and using Axios

[lephuhai]

@steffans Sorry, I’m using postman for send request to api. It still work. I don’t think problem lies in server?