Mark Alaniz
Development

No 'Access-Control-Allow-Origin'? No problem.

Mark Alaniz
bees
What you'll find at https://cors-anywhere.herokuapp.com/

I was recently working on refactoring MTGA Pathway and changing where I was making requests from. I decided to use web workers to help make requests in the background instead of in my main application process. However, I ran into one of the dreaded console messages stopping me in my tracks. ...no Access-Control-Allow-Origin.

I was pretty bummed I had to pause my workflow just to deal with this issue. After doing some digging I found THIS. Essentially, all you have to do is make your http request to cors-anywhere with your API or resource appended to the end of the url. For example, "https://cors-anywhere.herokuapp.com/https://website/api" and your request should work flawlessly now with no CORS issues. Your experience may vary of course.

Additionally you may have to tack on additional headers for this to work properly such as "X-Requested-With" : "XMLHttpRequest" depending on the status code you get back. I used Axios for all of this so it was as simple as saying,

axios({  method: 'get',  url: '/api',  headers: {   'X-Requested-With' : 'XMLHttpRequest'  }});

© 2021 — Mark Alaniz, Developer

Credits for design and development go to Marguerite Roth