feat: Support running under subpath (#1451)

client/src/api/http.js

@@ -18,7 +18,7 @@ const http = {};
         return result;
       }, new FormData());
 
-    return fetch(`${Config.SERVER_BASE_URL}/api${url}`, {
+    return fetch(`${Config.BASE_PATH}/api${url}`, {
       method,
       headers,
       body: formData,

client/src/api/socket.js

@@ -10,7 +10,7 @@ import Config from '../constants/Config';
 
 const io = sailsIOClient(socketIOClient);
 
-io.sails.url = Config.SERVER_BASE_URL;
+io.sails.path = `${Config.BASE_PATH}/socket.io`;
 io.sails.autoConnect = false;
 io.sails.reconnection = true;
 io.sails.useCORSRouteToGetCookie = false;

client/src/components/common/Linkify/Link.jsx

@@ -10,6 +10,7 @@ import { useSelector } from 'react-redux';
 import history from '../../../history';
 import selectors from '../../../selectors';
 import matchPaths from '../../../utils/match-paths';
+import Config from '../../../constants/Config';
 import Paths from '../../../constants/Paths';
 
 const Link = React.memo(({ href, content, stopPropagation, ...props }) => {
@@ -23,7 +24,8 @@ const Link = React.memo(({ href, content, stopPropagation, ...props }) => {
     }
   }, [href]);
 
-  const isSameSite = !!url && url.origin === window.location.origin;
+  const isSameSite =
+    !!url && url.origin === window.location.origin && url.pathname.startsWith(Config.BASE_PATH);
 
   const cardsPathMatch = useMemo(() => {
     if (!isSameSite) {

client/src/configs/markdown-plugins/link.js

@@ -4,6 +4,7 @@
  */
 
 import history from '../../history';
+import Config from '../../constants/Config';
 
 const SAME_SITE_CLASS = 'same-site';
 
@@ -30,7 +31,9 @@ function process(token, nextToken) {
     return;
   }
 
-  const isSameSite = url.origin === window.location.origin;
+  const isSameSite =
+    url.origin === window.location.origin && url.pathname.startsWith(Config.BASE_PATH);
+
   const trimOrigin = isSameSite && nextToken.type === 'text' && nextToken.content === href;
 
   if (isSameSite) {

client/src/constants/Config.js

@@ -3,8 +3,7 @@
  * Licensed under the Fair Use License: https://github.com/plankanban/planka/blob/master/LICENSE.md
  */
 
-const SERVER_BASE_URL =
-  import.meta.env.VITE_SERVER_BASE_URL || (import.meta.env.DEV ? 'http://localhost:1337' : '');
+const BASE_PATH = window.BASE_PATH || '';
 
 const ACCESS_TOKEN_KEY = 'accessToken';
 const ACCESS_TOKEN_VERSION_KEY = 'accessTokenVersion';
@@ -20,7 +19,7 @@ const MAX_SIZE_TO_DISPLAY_CONTENT = 256 * 1024;
 const IS_MAC = navigator.platform.startsWith('Mac');
 
 export default {
-  SERVER_BASE_URL,
+  BASE_PATH,
   ACCESS_TOKEN_KEY,
   ACCESS_TOKEN_VERSION_KEY,
   ACCESS_TOKEN_VERSION,

client/src/constants/Paths.js

@@ -3,12 +3,14 @@
  * Licensed under the Fair Use License: https://github.com/plankanban/planka/blob/master/LICENSE.md
  */
 
-const ROOT = '/';
-const LOGIN = '/login';
-const OIDC_CALLBACK = '/oidc-callback';
-const PROJECTS = '/projects/:id';
-const BOARDS = '/boards/:id';
-const CARDS = '/cards/:id';
+import Config from './Config';
+
+const ROOT = `${Config.BASE_PATH}/`;
+const LOGIN = `${Config.BASE_PATH}/login`;
+const OIDC_CALLBACK = `${Config.BASE_PATH}/oidc-callback`;
+const PROJECTS = `${Config.BASE_PATH}/projects/:id`;
+const BOARDS = `${Config.BASE_PATH}/boards/:id`;
+const CARDS = `${Config.BASE_PATH}/cards/:id`;
 
 export default {
   ROOT,

client/src/utils/access-token-storage.js

@@ -8,24 +8,28 @@ import { jwtDecode } from 'jwt-decode';
 
 import Config from '../constants/Config';
 
+const PATH = Config.BASE_PATH || '/';
+
 export const setAccessToken = (accessToken) => {
   const { exp } = jwtDecode(accessToken);
   const expires = new Date(exp * 1000);
 
   Cookies.set(Config.ACCESS_TOKEN_KEY, accessToken, {
     expires,
+    path: PATH,
     secure: window.location.protocol === 'https:',
     sameSite: 'strict',
   });
 
   Cookies.set(Config.ACCESS_TOKEN_VERSION_KEY, Config.ACCESS_TOKEN_VERSION, {
     expires,
+    path: PATH,
   });
 };
 
 export const removeAccessToken = () => {
-  Cookies.remove(Config.ACCESS_TOKEN_KEY);
-  Cookies.remove(Config.ACCESS_TOKEN_VERSION_KEY);
+  Cookies.remove(Config.ACCESS_TOKEN_KEY, { path: PATH });
+  Cookies.remove(Config.ACCESS_TOKEN_VERSION_KEY, { path: PATH });
 };
 
 export const getAccessToken = () => {