Don't use / as webUrl, prefer NEXT_PUBLIC_WEB_URL or VERCEL_URL

src/web/next.config.js

@@ -35,6 +35,13 @@ loadApiUrlFromEnv(envDevelopmentPath);
 // Try to copy them across from existing values
 envVarsToForward.forEach((envVar) => forwardToNext(envVar));
 
+// NOTE: on Vercel, the value we get from VERCEL_URL for the WEB_URL will be
+// missing the leading https://.  If it's not there, add it now so the front-end
+// can count on it always being an absolute URL.
+process.env.NEXT_PUBLIC_WEB_URL = process.env.NEXT_PUBLIC_WEB_URL.startsWith('https://')
+  ? process.env.NEXT_PUBLIC_WEB_URL
+  : `https://${process.env.NEXT_PUBLIC_WEB_URL}`;
+
 // Indicate what the build values we're using are going to be.
 envVarsToForward.forEach((envVar) =>
   console.info(`Using NEXT_PUBLIC_${envVar}=${process.env[`NEXT_PUBLIC_${envVar}`]}`)

src/web/src/config.ts

@@ -4,15 +4,8 @@
 // The URL to use when accessing the Telescope 1.0 backend APIs
 const telescopeUrl = process.env.NEXT_PUBLIC_API_URL;
 
-// The URL where our front-end is being hosted. If we don't have a URL,
-// we use the current page's, and include a fallback of '/' for server-side rendering.
-const webUrl =
-  // Either we have it defined via Docker env,
-  process.env.NEXT_PUBLIC_WEB_URL ||
-  // Or we're in Vercel, and the host provides it,
-  process.env.VERCEL_URL ||
-  // Or we need to make a guess.
-  (typeof window !== 'undefined' ? window.location.href : '/');
+// The URL where our front-end is being hosted.
+const webUrl = process.env.NEXT_PUBLIC_WEB_URL;
 
 // The various Telescope 2.0 microservice endpoints we use
 const imageServiceUrl = process.env.NEXT_PUBLIC_IMAGE_URL;