Locally testing a website on its real domain

In rare circumstances, you want to use a websites full domain (say https://mywebsite.com) while testing in dev mode. This can be useful if you need to test third party integrations like embeds, cookie banners, Google Tag Manger or other integrations that allowlist your actual domain.

To achieve this, we will have to

• make our system resolve mywebsite.com to localhost,
• run a reverse proxy on localhost:443 with a (locally signed and accepted) SSL certificate for mywebsite.com,
• forward the traffic to our actual dev server.

On linux, this can be achieved with these steps (instructions for Ubuntu):

Resolving mywebsite.com to 127.0.0.1

Add an entry to /etc/hosts of the form

Copy127.0.0.1 mywebsite.com

Generate an SSL certificate with "mkcert"

• Install mkcert:

  Copysudo apt install mkcert libnss3-tools
  

• Install mkcert as a local certificate authority:

  Copymkcert -install
  

• Generate an SSL certificate for you domain:

  Copymkcert mywebsite.com
  

Set up a reverse proxy using that certificate with "caddy"

• Install caddy

  Copysudo apt install caddy
  

• Disable the global caddy service

  Copysudo systemctl stop caddy.service
  sudo systemctl disable caddy.service
  

• Create a file named Caddyfile

  Copymywebsite.com {
    tls ./name-of-the-generated-cert.pem ./name-of-the-generated-cert-key.pem
    reverse_proxy localhost:3000
  }  
  

• Start caddy

  Copysudo caddy run
  

  (This requires sudo because we want to bind to restricted port 443.)

Now you should be able to open your dev server by going to https://mywebsite.com. Don't forget to remove the change to /etc/hosts when you're done testing.