
Explicitly use the `--mode` flag for the webapp development server (`vite`) to make the web frontend choose the appropriate HTTP and WebSocket port to communicate with the backend. This also makes sure that when accessing the frontend via `https://`, the websocket connection uses `wss://`. As a side-effect, this also makes port `:8081` usable in production environments; it would assume it was the development server and try to access the backend on port `:8080`. Reviewed-on: https://projects.blender.org/studio/flamenco/pulls/104296 Reviewed-by: Sybren A. Stüvel <sybren@blender.org>
31 lines
888 B
JavaScript
31 lines
888 B
JavaScript
let url = new URL(window.location.href);
|
|
|
|
// When the web interface is running on a different port than the API, for
|
|
// example when using the Vite devserver, setting the Vite --mode flag to
|
|
// "development" will force port 8080 for the API.
|
|
if (import.meta.env.MODE == 'development') {
|
|
url.port = '8080';
|
|
}
|
|
|
|
const URLs = {
|
|
api: `${url.protocol}//${url.hostname}:${url.port}/`,
|
|
ws: `${url.protocol.replace('http', 'ws')}//${url.hostname}:${url.port}/`,
|
|
};
|
|
|
|
// console.log("Flamenco API:", URLs.api);
|
|
// console.log("Websocket :", URLs.ws);
|
|
|
|
export function ws() {
|
|
return URLs.ws;
|
|
}
|
|
export function api() {
|
|
return URLs.api;
|
|
}
|
|
|
|
// Backend URLs (like task logs, SwaggerUI, etc.) should be relative to the API
|
|
// url in order to stay working when the web development server is in use.
|
|
export function backendURL(path) {
|
|
const url = new URL(path, URLs.api);
|
|
return url.href;
|
|
}
|