From ca7bad8909240e29c9663ebe9592503c91ef0eb5 Mon Sep 17 00:00:00 2001 From: Blake Blackshear Date: Thu, 19 May 2022 07:31:02 -0500 Subject: [PATCH] get ingress to play nice with vite --- docker/rootfs/usr/local/nginx/conf/nginx.conf | 12 +++++++----- web/package.json | 2 +- web/src/api/baseUrl.js | 2 +- web/src/api/index.jsx | 2 +- web/src/api/mqtt.jsx | 2 +- web/src/components/JSMpegPlayer.jsx | 2 +- 6 files changed, 12 insertions(+), 10 deletions(-) diff --git a/docker/rootfs/usr/local/nginx/conf/nginx.conf b/docker/rootfs/usr/local/nginx/conf/nginx.conf index c2ccc5079..7437f42fd 100644 --- a/docker/rootfs/usr/local/nginx/conf/nginx.conf +++ b/docker/rootfs/usr/local/nginx/conf/nginx.conf @@ -205,11 +205,13 @@ http { add_header Cache-Control "public"; } - sub_filter 'href="/' 'href="$http_x_ingress_path/'; - sub_filter 'url(/' 'url($http_x_ingress_path/'; - sub_filter '"/dist/' '"$http_x_ingress_path/dist/'; - sub_filter '"/js/' '"$http_x_ingress_path/js/'; - sub_filter '' ''; + sub_filter 'href="/BASE_PATH/' 'href="$http_x_ingress_path/'; + sub_filter 'url(/BASE_PATH/' 'url($http_x_ingress_path/'; + sub_filter '"/BASE_PATH/dist/' '"$http_x_ingress_path/dist/'; + sub_filter '"/BASE_PATH/js/' '"$http_x_ingress_path/js/'; + sub_filter '"/BASE_PATH/assets/' '"$http_x_ingress_path/assets/'; + sub_filter '="/BASE_PATH/"' '=window.baseUrl'; + sub_filter '' ''; sub_filter_types text/css application/javascript; sub_filter_once off; diff --git a/web/package.json b/web/package.json index ec04d3bb4..21b50468c 100644 --- a/web/package.json +++ b/web/package.json @@ -5,7 +5,7 @@ "scripts": { "dev": "vite", "lint": "eslint ./ --ext .jsx,.js,.tsx,.ts", - "build": "tsc && vite build", + "build": "tsc && vite build --base=/BASE_PATH/", "preview": "vite preview", "test": "jest" }, diff --git a/web/src/api/baseUrl.js b/web/src/api/baseUrl.js index 96559c9a8..132f170c5 100644 --- a/web/src/api/baseUrl.js +++ b/web/src/api/baseUrl.js @@ -1,2 +1,2 @@ import { API_HOST } from '../env'; -export const baseUrl = API_HOST || `${window.location.protocol}//${window.location.host}${window.baseUrl || ''}`; +export const baseUrl = API_HOST || `${window.location.protocol}//${window.location.host}${window.baseUrl || '/'}`; diff --git a/web/src/api/index.jsx b/web/src/api/index.jsx index 427c65119..00c78db48 100644 --- a/web/src/api/index.jsx +++ b/web/src/api/index.jsx @@ -4,7 +4,7 @@ import useSWR, { SWRConfig } from 'swr'; import { MqttProvider } from './mqtt'; import axios from 'axios'; -axios.defaults.baseURL = `${baseUrl}/api/`; +axios.defaults.baseURL = `${baseUrl}api/`; export function ApiProvider({ children, options }) { return ( diff --git a/web/src/api/mqtt.jsx b/web/src/api/mqtt.jsx index 0dcfa2939..600cd1fc1 100644 --- a/web/src/api/mqtt.jsx +++ b/web/src/api/mqtt.jsx @@ -34,7 +34,7 @@ export function MqttProvider({ config, children, createWebsocket = defaultCreateWebsocket, - mqttUrl = `${baseUrl.replace(/^http/, 'ws')}/ws`, + mqttUrl = `${baseUrl.replace(/^http/, 'ws')}ws`, }) { const [state, dispatch] = useReducer(reducer, initialState); const wsRef = useRef(); diff --git a/web/src/components/JSMpegPlayer.jsx b/web/src/components/JSMpegPlayer.jsx index 6b22008be..875f0c8ed 100644 --- a/web/src/components/JSMpegPlayer.jsx +++ b/web/src/components/JSMpegPlayer.jsx @@ -5,7 +5,7 @@ import JSMpeg from '@cycjimmy/jsmpeg-player'; export default function JSMpegPlayer({ camera, width, height }) { const playerRef = useRef(); - const url = `${baseUrl.replace(/^http/, 'ws')}/live/${camera}`; + const url = `${baseUrl.replace(/^http/, 'ws')}live/${camera}`; useEffect(() => { const video = new JSMpeg.VideoElement(