0

I'm trying to make an axios get-request from a spa app to a python falcon server that should be all set for CORS requests. I'm providing the following headers to my request:

const getHeaders = {
  headers: {
    'Access-Control-Expose-Headers': 'X-json',
    'Access-Control-Allow-Headers': '*',
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Request-Method': 'get',
    'Access-Control-Request-Headers': 'X-custom-header',
    'Content-Type': 'application/json',
    Accept: 'application/json',
  },
};

There's a lot of stuff there because I've scavenged through a bunch of threads already trying to find a fix, but nothing seems to work for me.

I've managed to make requests to this same server before using JavaScripts fetch api and disabling cors on the browser with a chrome plugin.

I've hit a bit of a brick wall now, any help is appreciated. I'm using webpack-dev-server for development, but I've also got an express setup for production where I've tried to set these same headers with use on express, but the problem repeats.

Thanks!

Julius Rajala
  • 9
  • 1
  • 2
  • `Access-Control` headers are **response** headers. You should not provide them in the request. – Quentin Jan 16 '17 at 16:47
  • `getHeaders` implies you are making a GET request, why are you setting a `Content-Type`? There is no request body to describe the content of. – Quentin Jan 16 '17 at 16:49
  • "python falcon server" / "I'm using webpack-dev-server for development, but I've also got an express setup for production where I've tried to set these same headers with use on express" — If you have a problem implementing CORS on Express or Webpack Server then you could try asking a question about that. You should include your Python / Webpack / Express code in an [mcve]. You should also quote the exact error message you are getting in the browser console. There are quite a few CORS related errors. You should make it clear which URLs (mentioned in the error) refer to which servers. – Quentin Jan 16 '17 at 16:50
  • So I'm the boy who cried wolf, had the guy check out his stuff on the backend and it turns out that's where the problem lied. Headers weren't set there correctly. 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods': '*', Worked for me on the frontend. – Julius Rajala Jan 16 '17 at 17:15

1 Answers1

0

CORS allow origin is set on the server, not client. You'll either need to set those headers on the server, or create your own server to contact the Python server and then serve the request.

D. Walsh
  • 1,963
  • 1
  • 21
  • 23
  • After a LOT of messing around- I came to the following conclusions: **1)** Your backend has to support CORS (I'm usning laravel and I use this [**https://github.com/barryvdh/laravel-cors**](https://github.com/barryvdh/laravel-cors) ) and **2)** Axios configs that are working for me are: axios.defaults.headers.common['Content-Type'] = 'application/x-www-form-urlencoded, application/json' axios.defaults.headers.common.crossDomain = true axios.defaults.headers.common['Access-Control-Allow-Origin'] = '*' axios.defaults.headers.common['Accept'] = 'application/json, text/plain, */*' – Anthony Jul 11 '17 at 08:14