Calling HTTPS URLs from http://localhost

Working around Cross Origin restrictions during development

3 min readFeb 16, 2018

Making requests to HTTPS APIs from HTTP sites running on localhost can be a pain, especially as browsers keep changing how they expose the option.

Browser Settings

The only way to turn off Cross Origin Restrictions in Chrome is to turn off the feature completely when starting the browser by passing arguments to it.

e.g. --disable-web-security --user-data-dir=~/.chrome-disable-web-security

On my Mac, I have the following in my .bash_profile so I can just type chrome at the command prompt so I can quickly start an instance of Chrome with web security disabled for development.

alias chrome=”/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --disable-web-security --user-data-dir=~/.chrome-disable-web-security”

This saves me from having to remember the flags needed and allows me to easily test things in Chrome, although it doesn’t work in *every* case as some servers also require header re-writing (keep reading for more on this).

It’s a bit easier in Firefox but the features related to it are split across multiple options and you may need to disable multiple flags to get things working — and the options (and even plugins) are limited and don’t help in all cases and is unfortunately quite limited in usefulness.

In Safari it’s very easy, as you can turn it off directly from the “Develop” menu, which in turn is enabled under Advanced preferences and you are done.

Simple Reverse Proxy

If those aren’t helpful, an alternative — other than creating your own snake oil certificate — is to use a simple reverse proxy like mitmproxy.

This approach works on all platforms, on all browsers and can be useful in application development too.

It works by re-writing the request/response headers on the fly, allowing you to call remote services from your localhost website without having to edit or disable any security features in your browser.