diff --git a/client/src/app/api/apiConstants.js b/client/src/app/api/apiConstants.js
index fd2e10e78..9b7e6084e 100644
--- a/client/src/app/api/apiConstants.js
+++ b/client/src/app/api/apiConstants.js
@@ -1,2 +1,3 @@
 // TODO: should be defined dynamically?
-export const serverURL = 'http://localhost:4001/';
+export const serverURL = 'http://localhost';
+export const NODE_PORT = 4001;
diff --git a/client/src/app/api/eventsApi.js b/client/src/app/api/eventsApi.js
index 9ce2bba16..03fba6354 100644
--- a/client/src/app/api/eventsApi.js
+++ b/client/src/app/api/eventsApi.js
@@ -1,5 +1,12 @@
 import axios from 'axios';
-import { serverURL } from './apiConstants';
+import { NODE_PORT } from '../api/apiConstants';
+
+// get origin from URL
+const serverURL = window.location.origin.replace(
+  window.location.port,
+  `${NODE_PORT}/`
+);
+
 export const eventsNamespace = 'events';
 export const eventsURL = serverURL + eventsNamespace;
 
diff --git a/client/src/app/api/playbackApi.js b/client/src/app/api/playbackApi.js
index cce209bc8..a3a6ac2db 100644
--- a/client/src/app/api/playbackApi.js
+++ b/client/src/app/api/playbackApi.js
@@ -1,5 +1,12 @@
 import axios from 'axios';
-import { serverURL } from './apiConstants';
+import { NODE_PORT } from '../api/apiConstants';
+
+// get origin from URL
+const serverURL = window.location.origin.replace(
+  window.location.port,
+  `${NODE_PORT}/`
+);
+
 export const playbackNamespace = 'playback';
 const playbackURL = serverURL + playbackNamespace;
 
diff --git a/client/src/app/api/settingsApi.js b/client/src/app/api/settingsApi.js
index fa0c9d2e0..334ed2589 100644
--- a/client/src/app/api/settingsApi.js
+++ b/client/src/app/api/settingsApi.js
@@ -1,5 +1,12 @@
 import axios from 'axios';
-import { serverURL } from './apiConstants';
+import { NODE_PORT } from '../api/apiConstants';
+
+// get origin from URL
+const serverURL = window.location.origin.replace(
+  window.location.port,
+  `${NODE_PORT}/`
+);
+
 export const settingsNamespace = 'settings';
 export const settingsURL = serverURL + settingsNamespace;
 
diff --git a/client/src/app/context/socketContext.js b/client/src/app/context/socketContext.js
index b5d600098..89cde317d 100644
--- a/client/src/app/context/socketContext.js
+++ b/client/src/app/context/socketContext.js
@@ -1,8 +1,16 @@
 import { createContext, useContext, useEffect, useState } from 'react';
 import io from 'socket.io-client';
 import { serverURL } from '../api/apiConstants';
+import { NODE_PORT } from '../api/apiConstants';
 
 export const SocketContext = createContext([[], () => {}]);
+// get origin from URL
+const serverURL = window.location.origin.replace(
+  window.location.port,
+  `${NODE_PORT}/`
+);
+
+const SocketContext = createContext([[], () => {}]);
 
 export const useSocket = () => {
   return useContext(SocketContext);