Skip to main content

Command Palette

Search for a command to run...

Quickserve with HTTPS: The No-Fuss Guide

Updated
2 min readView as Markdown
D
Software Developer focused on backend infrastructure and networking. Building tools that bridge the gap between high-level development and low-level protocols.

If you're using the QuickServe extension in VS Code and need a Secure Context for local testing (Service Workers, Clipboard API, etc.), you don't need to manually wrestle with OpenSSL via the CLI anymore.

QuickServe has a built-in Self-Healing Mode that handles certificate generation for you. You just need to tweak your settings.json.

Here is the exact setup.

The Baseline Configuration

Navigate to Settings > Extensions > User/Workspace > QuickServe Configuration (or just open your settings.json).

You'll be targeting this JSON block:

"quickserve.https": {
    "enable": true,
    "certPath": "",
    "keyPath": ""
}

By setting "enable": true and leaving the paths empty, QuickServe takes over. What happens next depends on what is installed on your machine.


Method 1: The Self-Healing Fallback (With Browser Warning)

If you don't have any local Certificate Authority tools installed, do absolutely nothing else.

With the empty paths above, QuickServe's Self-Healing Mode kicks in. It automatically generates a standard self-signed certificate in the background to serve your project over HTTPS.

Result: Your browser will throw an ERR_CERT_AUTHORITY_INVALID warning because it's self-signed. Just click Advanced > Proceed to localhost to bypass it, and you're good for quick testing.


Method 2: Trusted Local CA (No Browser Warning)

Use mkcert to create a local Certificate Authority. This permanently prevents browser warnings and avoids strict cross-origin blocks.

1. Install mkcert:

# macOS
brew install mkcert

# Windows (using Chocolatey)
choco install mkcert

# Linux (Ubuntu/Debian)
sudo apt install libnss3-tools mkcert

2. Setup the local CA (Run once per machine):

mkcert -install

3. Let QuickServe Take Over:

With mkcert installed and the certPath/keyPath still empty in your settings.json, simply restart the QuickServe extension. The Self-Healing Mode will detect mkcert and automatically generate a fully trusted local certificate for you.

Result: A smooth, trusted https://127.0.0.1 connection. No red text, no warnings.


Bonus: The Manual Override

If you already have your own custom OpenSSL certificates and want to bypass the Self-Healing Mode entirely, just provide the absolute paths in your settings.json:

JSON

"quickserve.https": {
    "enable": true,
    "certPath": "/absolute/path/to/cert.pem",
    "keyPath": "/absolute/path/to/key.pem"
}

Save the file, restart the extension, and QuickServe will use your specific files.

QuickServe

Part 2 of 2

I built QuickServe to kill the friction of spinning up local servers. This series is where we go beyond the README. I’ll be sharing "How-To" guides, hidden power-user tips, and the logic behind new updates. It’s also a place for open discussion—tell me what features you need and how you’re using the extension in your daily stack.

Start from the beginning

Preview Your Project Inside VS Code with QuickServe (No More Context Switching)

When you're building a web page, even small changes usually follow the same cycle: Save the file. Switch to your browser. Check the result. Switch back to VS Code. Repeat. Those constant window