Description
Describe the bug
When not using SSL locally with netlify dev
, edge functions will see the hostname requested by the HTTP client (curl
in these examples).
However, when using SSL locally with netlify dev
, edge functions will see the hostname as localhost
and the port number used will also be changed to the randomly assigned port that a netlify dev
HTTP server is listening on (which is not the port the client makes the request to).
This should not occur. For local development, the edge function should correctly receive the URL requested by the client even when SSL is being used.
Steps to reproduce
Reproduction steps:
- Provision a local SSL certificate. (I used the Let’s Encrypt
certbot
utility to do so.) - Configure
netlify dev
to use that certificate for SSL:
You can define a local SSL configuration withnetlify dev
using the following syntax innetlify.toml
:
[dev.https]
certFile = "ssl/fullchain.pem" ## these are the filenames used by Let’s Encrypt
keyFile = "ssl/privkey.pem" ## these are the filenames used by Let’s Encrypt
- Add the hostname in question to the local
/etc/host
file like so (usingfoo.example.com
here):
127.0.0.1 localhost foo.example.com
- Make an edge functions that logs the request URL. I used this:
import type {Context, Config } from "https://edge.netlify.com";
export default (request: Request, context: Context) => {
const requestURL = new URL(request.url);
console.log("Logging requestURL:");
console.log(requestURL);
return context.next();
};
export const config: Config = {
path: "/*",
excludedPath: ["/*.css", "/*.js"],
onError: "bypass"
};
- Start the CLI dev instance with:
netlify dev
- Make a request to the site locally using:
curl https://foo.example.com:8888/
(note: the URL is using HTTPS)
- at this point the logging should show this (and it will if HTTP only is used):
[request-logging] Logging requestURL:
[request-logging] URL {
href: "https://foo.example.com:8888/",
origin: "https://foo.example.com:8888",
protocol: "https:",
username: "",
password: "",
host: "foo.example.com:8888",
hostname: "foo.example.com",
port: "8888",
pathname: "/",
hash: "",
search: ""
}
- Note that, instead, it shows something like this:
[request-logging] Logging requestURL:
[request-logging] URL {
href: "http://localhost:49419/",
origin: "http://localhost:49419",
protocol: "http:",
username: "",
password: "",
host: "localhost:49419",
hostname: "localhost",
port: "49419",
pathname: "/",
hash: "",
search: ""
}
The protocol, hostname, and port - all three - have been changed from the point of view of the edge function.
If SSL is not used with netlify dev
this does not occur. Without local SSL, the edge functions gets the correct request information from the client.
Note, you will need to use a real domain name you control to provision the SSL. The domain used in testing was not foo.example.com
and that is only a placeholder for the actual domain used.
Configuration
The netlify.toml
sections that are applicable:
[dev]
command = "hugo server -w" # Command to start your dev server
port = 8888 # The port that the netlify dev will use
targetPort = 1313
publish = "public" # The path to your static content folder
[dev.https]
certFile = "ssl/fullchain.pem"
keyFile = "ssl/privkey.pem"
The edge function code request-logging.ts
:
import type {Context, Config } from "https://edge.netlify.com";
export default (request: Request, context: Context) => {
const requestURL = new URL(request.url);
console.log("Logging requestURL:");
console.log(requestURL);
return context.next();
};
export const config: Config = {
path: "/*",
excludedPath: ["/*.css", "/*.js"],
onError: "bypass"
};
Environment
System:
OS: macOS 13.5
CPU: (10) arm64 Apple M1 Pro
Memory: 4.30 GB / 32.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 18.16.0 - ~/.nvm/versions/node/v18.16.0/bin/node
npm: 9.5.1 - ~/.nvm/versions/node/v18.16.0/bin/npm
npmGlobalPackages:
netlify-cli: 16.0.2