CORS and Prototyping with live APIs

Over the last number of weeks I have been working with: Create React App, Razzle, After.js and Next.js to evaluate them for future projects. (More on this in a future post.) While doing this I wanted to use production APIs that I was familiar with so that I could focus only on the framework.

But there was one problem, APIs in all environments were missing one thing!

Access-Control-Allow-Origin: *

And with that you get:

No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:3000' is therefore not allowed access.
If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled


Now there are many ways around this and I was looking for something super simple. I wanted something that I could share with the team and include as part of the prototype codebase. I found a couple of packages that offered parts of what I wanted. Some were full featured and ready for production! Others difficult to set up and unclear if they would work. In the end I created my own package (local-cors-proxy) that met my exact use case.


The goal was simple, allow any API to be called without CORS issues and needing anything changed on the backend. This package does that by creating a simple proxy to bypass CORS issues. It is a dev only solution to help you rapidly prototype out your React / Vue / Angular (+ many many more) apps.

Getting started is easy, you can install the package globally or on a project by project basis.

Here is a simple example:

npm install -g local-cors-proxy

Take this as the example API endpoint that we are requesting that has CORS issues:

First we start the proxy:

lcp --proxyUrl

Then we can make a request to the proxy:

Then in your client code, the new API endpoint would look like:


End result will be a request to without the CORS issues!

Alternatively you can install the package locally and add a script to your project:

"scripts": {
  "proxy": "lcp --proxyUrl"

And run it then via the command yarn proxy

Icon: block by Alina Oleynik from the Noun Project