To use a token based authentication (Implicit Flow) third party API providers usually require you to whiteliste a fully qualified HTTPS domain.

For a project created with vue-cli hosting a HTTPS server is quite easy:

sudo vue-cli-service serve --host test.example.org --port 443 --https

But if your development environment does not support HTTPS or changing the host, you can use Caddy to forward the HTTPS traffic. An example with the domain test.example.org:

  1. Download caddy from github or with homebrew brew install caddy
  2. Redirect domain to local: echo "127.0.0.1 test.example.org" | sudo tee -a /etc/hosts > /dev/null
  3. Start reverse proxy: caddy -host test.example.org -port 443 "proxy / localhost:8080" "tls self_signed"
  4. Visit https://test.example.org and accept the self signed cert. (make sure it is httpS)

Terminal output

Caddy will generate you a temporary self-signed certificate, but you can generate your own, for more check out the Caddy documentation

Disabling Chrome Security checks

You can type thisisunsafe anywhere on the Google Chrome warning page and it will load it without warning.

If you still get certificate errors, you can allow certificate errors from localhost by enabling this flag: chrome://flags/#allow-insecure-localhost.

Other

Before I found Caddy, I used my own solution GLoSS to start up a HTTPS reverse proxy with certificates.