HTTPS for Next.js v12

create-cert.sh

#!/bin/bash

###> Utils
if [[ -t 2 ]] && [[ -z "${NO_COLOR-}" ]] && [[ "${TERM-}" != "dumb" ]]; then
  NOFORMAT='\033[0m' RED='\033[0;31m' GREEN='\033[0;32m' ORANGE='\033[0;33m' BLUE='\033[0;34m' PURPLE='\033[0;35m' CYAN='\033[0;36m' YELLOW='\033[1;33m'
else
  NOFORMAT='' RED='' GREEN='' ORANGE='' BLUE='' PURPLE='' CYAN='' YELLOW=''
fi
debug()   { echo >&2 -e"${CYAN}[DEBUG] $* ${NOFORMAT}"; }
info()    { echo >&2 -e "${BLUE}[INFO] $* ${NOFORMAT}"; }
success() { echo >&2 -e "${GREEN}[SUCCESS] $* ${NOFORMAT}"; }
warning() { echo >&2 -e "${ORANGE} [WARNING] $* ${NOFORMAT}"; }
error()   { echo >&2 -e "${RED}[ERROR] $* ${NOFORMAT}"; exit 1; }
###< Utils

VIRTUAL_HOST="dev.project.com"
CERT_FILE="../certs/${VIRTUAL_HOST}.cert"
CERT_KEY="../certs/${VIRTUAL_HOST}.key"

info "Creating certificate for ${VIRTUAL_HOST} using 'mkcert'..."
mkcert -key-file ${CERT_KEY} -cert-file "${CERT_FILE}" "*.${VIRTUAL_HOST}" ${VIRTUAL_HOST}

info "Make sure /usr/local/share/ca-certificates directory exists..."
sudo mkdir -p /usr/local/share/ca-certificates

info "Adding new certificate to the system trust store..."
if [[ "${OSTYPE}" == "linux-gnu"* ]]; then
  LINUX_SYSTEM_CERT="/usr/local/share/ca-certificates/${VIRTUAL_HOST}.crt"
  info "Adding new ${LINUX_SYSTEM_CERT}..."
  sudo cp --force "${CERT_FILE}" "${LINUX_SYSTEM_CERT}"

  # Update the CA store for Debian/Ubuntu-based systems.
  elif sudo bash -c 'command -v update-ca-certificates' >/dev/null 2>&1; then
    sudo update-ca-certificates

  # Update the CA store for Fedora/RHEL-based systems.
  elif command -v update-ca-trust >/dev/null 2>&1; then
    sudo update-ca-trust
  else
    error "Cannot find 'update-ca-certificates' or 'update-ca-trust' command. Aborting..."
  fi

# Add certificate for macOS.
elif [[ "${OSTYPE}" == "darwin"* ]]; then
  info "Adding trusted certificate to system keychain..."
  sudo security add-trusted-cert -d -r trustRoot -k "/Library/Keychains/System.keychain" "${CERT_FILE}"
fi
success "Certificate for ${VIRTUAL_HOST} has been created successfully and added to the system trust store."

server.js

/** Run using 'node server.js' **/
const { createServer: createHttpsServer } = require('https');
const next = require('next');
const fs = require('fs');

const VIRTUAL_HOST = 'dev.project.com';
const CERT_FILE = `./certs/${VIRTUAL_HOST}.cert`;
const CERT_KEY = `./certs/${VIRTUAL_HOST}.key`;

if (!fs.existsSync(CERT_FILE) || !fs.existsSync(CERT_KEY)) {
  console.error('Error: Missing SSL certificates:', [CERT_KEY, CERT_FILE].join(', '));
  process.exit();
}

const dev = process.env.NODE_ENV !== 'production';
const PORT = process.env.PORT || 3001;
const app = next({ dev, hostname: VIRTUAL_HOST, port: PORT });
const handle = app.getRequestHandler();

app
  .prepare()
  .then(() => {
    const server = createHttpsServer(
      {
        key: fs.readFileSync(CERT_KEY),
        cert: fs.readFileSync(CERT_FILE),
      },
      (req, res) => handle(req, res)
    );

    return server.listen(PORT, VIRTUAL_HOST, (err) => {
      if (err) throw err;
      console.log(`> Ready on https://${VIRTUAL_HOST}:${PORT}`);
    });
  })
  .catch((err) => {
    console.error(err);
  });