From ef669cfa94ca47887fa24db947d9d566cd771192 Mon Sep 17 00:00:00 2001
From: Felix Ableitner <me@nutomic.com>
Date: Tue, 19 Apr 2022 13:52:06 +0200
Subject: [PATCH] fix websocket debug

---
 src/server/index.tsx | 9 +++++++--
 src/shared/env.ts    | 5 +++--
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/server/index.tsx b/src/server/index.tsx
index 869ca660..cdd0f0ad 100644
--- a/src/server/index.tsx
+++ b/src/server/index.tsx
@@ -11,7 +11,7 @@ import process from "process";
 import serialize from "serialize-javascript";
 import { App } from "../shared/components/app/app";
 import { SYMBOLS } from "../shared/components/common/symbols";
-import { httpBaseInternal } from "../shared/env";
+import { httpBaseInternal, wsUriBase } from "../shared/env";
 import {
   ILemmyConfig,
   InitialFetchRequest,
@@ -28,9 +28,14 @@ const extraThemesFolder =
   process.env["LEMMY_UI_EXTRA_THEMES_FOLDER"] || "./extra_themes";
 
 server.use(function (_req, res, next) {
+  // in debug mode, websocket backend may be on another port, so we need to permit it in csp policy
+  var websocketBackend;
+  if (process.env.NODE_ENV == "development") {
+    websocketBackend = wsUriBase;
+  }
   res.setHeader(
     "Content-Security-Policy",
-    "default-src 'none'; connect-src 'self'; img-src * data:; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; form-action 'self'; base-uri 'self'"
+    `default-src 'none'; connect-src 'self' ${websocketBackend}; img-src * data:; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; form-action 'self'; base-uri 'self'`
   );
   next();
 });
diff --git a/src/shared/env.ts b/src/shared/env.ts
index 3b93882a..238cd5d4 100644
--- a/src/shared/env.ts
+++ b/src/shared/env.ts
@@ -1,6 +1,6 @@
 import { isBrowser } from "./utils";
 
-const testHost = "127.0.0.1:8536";
+const testHost = "0.0.0.0:8536";
 
 let internalHost =
   (!isBrowser() && process.env.LEMMY_INTERNAL_HOST) || testHost; // used for local dev
@@ -35,7 +35,8 @@ if (isBrowser()) {
 
 export const httpBaseInternal = `http://${host}`; // Don't use secure here
 export const httpBase = `http${secure}://${host}`;
-export const wsUri = `ws${secure}://${wsHost}/api/v3/ws`;
+export const wsUriBase = `ws${secure}://${wsHost}`;
+export const wsUri = `${wsUriBase}/api/v3/ws`;
 export const pictrsUri = `${httpBase}/pictrs/image`;
 export const isHttps = secure.endsWith("s");