When you need HTTPS on LOCAL environment, local-ssl-proxy is the best solution

Implementing single-sign-on (SSO) with nextauth.js and Slack, LOCAL environment also needs HTTPS support. In this case, it is very easy and useful that using local-ssl-proxy like a reverse proxy server.

This article is for Windows PC.

Installing local-ssl-proxy

Local-ssl-proxy only supports global installation. Install as below:

npm install -g local-ssl-proxy

An example usage is below:

npx local-ssl-proxy --source 3001 --target 3000

In this example, an application is running on port 3000. Run local-ssl-proxy on port 3001 targeting for port 3000.

https://github.com/cameronhunter/local-ssl-proxy

It works but SSL warnings

You'll get a warning because the certificate is self-signed, this is safe to ignore during development.

Create an effective certificate using mkcert.

Installing scoop

On Windows, it is very easy that installing mkcert using scoop. Following the quickstart, run as below:

Set-ExecutionPolicy RemoteSigned -Scope CurrentUser
irm get.scoop.sh | iex

https://scoop.sh/

Installing mkcert

Mkcert is the best solution for creating certificates on Windows. It is easier than installing OpenSSL and others as below:

scoop bucket add extras
scoop install mkcert

This installation should be failed without Git. Install Git first if you don’t have.

https://github.com/FiloSottile/mkcert

Running mkcert

Create a local certificates authority (CA). The following command must be run as administrator privilege. If you have run as not administrator privilege, redo with running mkcert -uninstall.

mkcert -install

Then, create a key and a certificate for localhost as below:

mkcert localhost

You should have gotten localhost-key.pem and localhost.pem.

Running local-ssl-proxy with the certificate enabled

npx local-ssl-proxy --key localhost-key.pem --cert localhost.pem --source 3001 --target 3000

Running local-ssl-proxy every time is exhausting

Npm-run-all is the best solution. It can run multiple commands for serial or parallel. Install as below:

npm install -D npm-run-all

Then, change package.json as below:

/* package.json */
{
  "scripts": {
    "dev": "npm-run-all -p dev:*",
    "dev:app": "next dev",
    "dev:ssl": "local-ssl-proxy --key localhost-key.pem --cert localhost.pem --source 3001 --target 3000"
    /* snipped */
  }
  /* snipped */
}

Running npm run dev, commands matching with dev:* will be run for parallel.

https://www.npmjs.com/package/npm-run-all

Blog