Caddy as a CORS proxy
CORS is a common issue when you are developing a web application. It is a security mechanism that restricts the resources you can access from another domain.
The usual solution is to contact the API provider and ask them to add your domain to the CORS whitelist. However, this is not always possible. For example, if you are using a third-party API, you may not be able to contact the API provider.
In this article, I will show you how to use Caddy as a (local) CORS proxy to bypass CORS issue.
Quick start
Install Caddy
You can install Caddy in many ways, see the official documentation for more details.
On macOS, you can simply run:
Create a config file (Caddyfile)
Let’s assume that remote API host is https://robwu.nl
, and local proxy we named cors.local
. The Caddyfile
should look like this:
Don’t forget to replace robwu.nl
with the actual domain name.
Configure DNS & TLS
In order to be able to use a local custom domain name and HTTPS, you need to configure DNS and TLS.
Add the following line to /etc/hosts
:
Usually you need to use sudo
to edit this file.
You also need to trust the local CA in order to use HTTPS, run the following command:
Run Caddy
Run Caddy in foreground:
or, run Caddy in background:
Now you can access the proxied API with CORS headers.
Known issues
- Sometimes, the response from the proxied API has duplicate CORS headers.