From 8aeaf845cb0d57225ff77069059b879b37dea80b Mon Sep 17 00:00:00 2001 From: Silberengel Date: Sat, 1 Nov 2025 17:02:51 +0100 Subject: [PATCH] fixed proxy setup --- PROXY_SETUP.md | 48 ++++++++++++++++++++++++++--- src/components/WebPreview/index.tsx | 5 +++ src/hooks/useFetchWebMetadata.tsx | 16 +++++++++- 3 files changed, 63 insertions(+), 6 deletions(-) diff --git a/PROXY_SETUP.md b/PROXY_SETUP.md index 575bfc2..7312dd6 100644 --- a/PROXY_SETUP.md +++ b/PROXY_SETUP.md @@ -9,16 +9,33 @@ When building and deploying on the remote server, you need to build the Docker i ### For Manual Docker Run Commands +**IMPORTANT:** `VITE_PROXY_SERVER` must be set during Docker BUILD (as a build argument), NOT at runtime. It gets baked into the JavaScript bundle. + Rebuild the Jumble image with the correct proxy URL: ```bash +# Build with the correct proxy URL (baked into the JS bundle) +# Users access via https://jumble.imwald.eu, so proxy must be HTTPS too docker build \ - --build-arg VITE_PROXY_SERVER=http://jumble.imwald.eu:8090 \ + --build-arg VITE_PROXY_SERVER=https://jumble.imwald.eu:8090 \ -t silberengel/imwald-jumble:12 \ . # Then push to Docker Hub docker push silberengel/imwald-jumble:12 + +# Then on the remote server, pull and restart: +docker stop imwald-jumble +docker rm imwald-jumble +docker pull silberengel/imwald-jumble:12 + +# Run with the same command (NO env vars needed for proxy - it's already in the bundle) +docker run -d \ + --name imwald-jumble \ + --network jumble-network \ + -p 0.0.0.0:32768:80 \ + --restart unless-stopped \ + silberengel/imwald-jumble:12 ``` **Note on Docker Network:** @@ -38,8 +55,8 @@ docker network create jumble-network ### 1. Set Environment Variables Before Building ```bash -export JUMBLE_PROXY_SERVER_URL="http://jumble.imwald.eu:8090" -export JUMBLE_SOCIAL_URL="http://jumble.imwald.eu:32768" +export JUMBLE_PROXY_SERVER_URL="https://jumble.imwald.eu:8090" +export JUMBLE_SOCIAL_URL="https://jumble.imwald.eu" ``` ### 2. Rebuild the Docker Image @@ -64,12 +81,33 @@ docker-compose up -d - What URL is being used to fetch metadata - Any errors (CORS, network, etc.) +## Update Proxy Server's ALLOW_ORIGIN + +Since users access via `https://jumble.imwald.eu`, you need to update the proxy server's `ALLOW_ORIGIN`: + +```bash +# Stop the proxy container +docker stop imwald-jumble-proxy +docker rm imwald-jumble-proxy + +# Restart with correct ALLOW_ORIGIN (must match how users access the frontend) +docker run -d \ + --name imwald-jumble-proxy \ + --network jumble-network \ + -p 0.0.0.0:8090:8080 \ + -e ALLOW_ORIGIN=https://jumble.imwald.eu \ + -e ENABLE_PPROF=true \ + --restart unless-stopped \ + ghcr.io/danvergara/jumble-proxy-server:latest +``` + ## Important Notes - The `VITE_PROXY_SERVER` value is baked into the JavaScript bundle during build time -- You MUST rebuild the Docker image if you change `JUMBLE_PROXY_SERVER_URL` -- The proxy server's `ALLOW_ORIGIN` must match the frontend URL (`JUMBLE_SOCIAL_URL`) +- You MUST rebuild the Docker image if you change `VITE_PROXY_SERVER` +- The proxy server's `ALLOW_ORIGIN` must match the frontend URL users access (`https://jumble.imwald.eu`) - Both must use the same protocol (http vs https) +- If the proxy is accessed via HTTPS on port 8090, make sure HTTPS is configured for that port ## Troubleshooting diff --git a/src/components/WebPreview/index.tsx b/src/components/WebPreview/index.tsx index 0da037e..7224d3c 100644 --- a/src/components/WebPreview/index.tsx +++ b/src/components/WebPreview/index.tsx @@ -79,7 +79,12 @@ function stripMarkdown(content: string): string { export default function WebPreview({ url, className }: { url: string; className?: string }) { const { autoLoadMedia } = useContentPolicy() const { isSmallScreen } = useScreenSize() + + console.log(`[WebPreview] Rendering with URL: ${url}, autoLoadMedia: ${autoLoadMedia}`) + const { title, description, image } = useFetchWebMetadata(url) + + console.log(`[WebPreview] Metadata received - title: ${title || 'none'}, description: ${description || 'none'}, image: ${image || 'none'}`) const hostname = useMemo(() => { try { diff --git a/src/hooks/useFetchWebMetadata.tsx b/src/hooks/useFetchWebMetadata.tsx index b91fe4f..280e7c5 100644 --- a/src/hooks/useFetchWebMetadata.tsx +++ b/src/hooks/useFetchWebMetadata.tsx @@ -6,8 +6,22 @@ export function useFetchWebMetadata(url: string) { const [metadata, setMetadata] = useState({}) useEffect(() => { + if (!url) { + console.log('[useFetchWebMetadata] No URL provided') + return + } + + console.log(`[useFetchWebMetadata] Fetching metadata for URL: ${url}`) + // Pass original URL - web service will handle proxy conversion - webService.fetchWebMetadata(url).then((metadata) => setMetadata(metadata)) + webService.fetchWebMetadata(url) + .then((metadata) => { + console.log(`[useFetchWebMetadata] Received metadata for ${url}:`, metadata) + setMetadata(metadata) + }) + .catch((error) => { + console.error(`[useFetchWebMetadata] Error fetching metadata for ${url}:`, error) + }) }, [url]) return metadata