ui: Add Websocket prefix settings (#449)

packages/hydrooj/src/model/setting.ts

@@ -197,6 +197,7 @@ SystemSetting(
     Setting('setting_server', 'server.url', '/', 'text', 'server.url', 'Server BaseURL'),
     Setting('setting_server', 'server.upload', '256m', 'text', 'server.upload', 'Max upload file size'),
     Setting('setting_server', 'server.cdn', '/', 'text', 'server.cdn', 'CDN Prefix'),
+    Setting('setting_server', 'server.ws', '/', 'text', 'server.ws', 'WebSocket Prefix'),
     Setting('setting_server', 'server.port', 8888, 'number', 'server.port', 'Server Port'),
     Setting('setting_server', 'server.xff', null, 'text', 'server.xff', 'IP Header'),
     Setting('setting_server', 'server.xhost', null, 'text', 'server.xhost', 'Hostname Header'),

packages/hydrooj/src/service/layers/base.ts

@@ -7,10 +7,12 @@ import type { HydroRequest, HydroResponse } from '../server';
 export interface UiContextBase {
     cdn_prefix: string;
     url_prefix: string;
+    ws_prefix: string;
 }
 export const UiContextBase: UiContextBase = {
     cdn_prefix: '/',
     url_prefix: '/',
+    ws_prefix: '/',
 };
 
 export default async (ctx, next) => {
@@ -62,6 +64,7 @@ export default async (ctx, next) => {
     };
     const UiContext: any = cloneDeep(UiContextBase);
     if (!process.env.DEV) UiContext.cdn_prefix = system.get('server.cdn');
+    if (!process.env.DEV) UiContext.ws_prefix = system.get('server.ws');
     UiContext.domainId = domainId;
     UiContext.domain = domainInfo;
     ctx.HydroContext = {

packages/ui-default/components/message/index.page.ts

@@ -37,7 +37,7 @@ const onmessage = (msg) => {
   return true;
 };
 
-const url = new URL('/home/messages-conn', window.location.href);
+const url = new URL(`${UiContext.ws_prefix}home/messages-conn`, window.location.href);
 // TODO handle a better way for cookie
 url.searchParams.append('sid', document.cookie);
 const endpoint = url.toString().replace('http', 'ws');

packages/ui-default/pages/home_messages.page.jsx

@@ -31,7 +31,7 @@ const page = new NamedPage('home_messages', () => {
 
     reduxStore = store;
 
-    const sock = new WebSocket('/home/messages-conn');
+    const sock = new WebSocket(`${UiContext.ws_prefix}home/messages-conn`);
     sock.onmessage = (message) => {
       const msg = JSON.parse(message.data);
       store.dispatch({

packages/ui-default/pages/manage_dashboard.page.js

@@ -4,7 +4,7 @@ import { NamedPage } from 'vj/misc/Page';
 const page = new NamedPage('manage_dashboard', async () => {
   const { default: WebSocket } = await import('../components/socket');
 
-  const sock = new WebSocket('/manage/check-conn');
+  const sock = new WebSocket(`${UiContext.ws_prefix}manage/check-conn`);
   sock.onopen = () => {
     $('<blockquote class="blue"><p>Connection opened.</p></blockquote>').appendTo('#messages');
   };

packages/ui-default/pages/problem_detail.page.jsx

@@ -141,7 +141,7 @@ const page = new NamedPage(['problem_detail', 'contest_detail_problem', 'homewor
     const { default: ScratchpadReducer } = await import('../components/scratchpad/reducers');
     const { Provider, store } = await loadReactRedux(ScratchpadReducer);
 
-    const sock = new WebSocket(UiContext.pretestConnUrl);
+    const sock = new WebSocket(UiContext.ws_prefix + UiContext.pretestConnUrl);
     sock.onmessage = (message) => {
       const msg = JSON.parse(message.data);
       store.dispatch({

packages/ui-default/pages/record_detail.page.ts

@@ -8,7 +8,7 @@ const page = new NamedPage('record_detail', async () => {
     import('diff-dom'),
   ]);
 
-  const sock = new WebSocket(UiContext.socketUrl);
+  const sock = new WebSocket(UiContext.ws_prefix + UiContext.socketUrl);
   const dd = new DiffDOM();
   sock.onmessage = (message) => {
     const msg = JSON.parse(message.data);

packages/ui-default/pages/record_main.page.ts

@@ -11,7 +11,7 @@ const page = new NamedPage('record_main', async () => {
     import('diff-dom'),
   ]);
 
-  const sock = new WebSocket(UiContext.socketUrl);
+  const sock = new WebSocket(UiContext.ws_prefix + UiContext.socketUrl);
   const dd = new DiffDOM();
 
   sock.onopen = () => sock.send(JSON.stringify({ rids: UiContext.rids }));

packages/ui-default/templates/problem_detail.html

@@ -13,14 +13,14 @@
   {{ set(UiContext, 'postSubmitUrl', url('problem_submit', pid=pdoc.docId, query={tid:tdoc.docId})) }}
   {{ set(UiContext, 'getSubmissionsUrl', url('record_main', query={fullStatus:'true', pid:pdoc.docId, tid:tdoc.docId})) }}
   {{ set(UiContext, 'getRecordDetailUrl', url('record_detail', rid='{rid}', query={tid:tdoc.docId})) }}
-  {{ set(UiContext, 'pretestConnUrl', "/record-conn?pretest=1&uidOrName=" + handler.user._id + "&pid=" + pdoc.docId + "&domainId=" + handler.args.domainId + "&tid=" + tdoc.docId) }}
+  {{ set(UiContext, 'pretestConnUrl', "record-conn?pretest=1&uidOrName=" + handler.user._id + "&pid=" + pdoc.docId + "&domainId=" + handler.args.domainId + "&tid=" + tdoc.docId) }}
   {{ set(UiContext, 'tdoc', tdoc) }}
 {% else %}
   {{ set(UiContext, 'canViewRecord', true) }}
   {{ set(UiContext, 'postSubmitUrl', url('problem_submit', pid=pdoc.docId)) }}
   {{ set(UiContext, 'getSubmissionsUrl', url('record_main', query={fullStatus:'true', pid:pdoc.docId})) }}
   {{ set(UiContext, 'getRecordDetailUrl', url('record_detail', rid='{rid}')) }}
-  {{ set(UiContext, 'pretestConnUrl', "/record-conn?pretest=1&uidOrName=" + handler.user._id + "&pid=" + pdoc.docId + "&domainId=" + handler.args.domainId) }}
+  {{ set(UiContext, 'pretestConnUrl', "record-conn?pretest=1&uidOrName=" + handler.user._id + "&pid=" + pdoc.docId + "&domainId=" + handler.args.domainId) }}
 {% endif %}
 </script>
 <div class="row">

packages/ui-default/templates/record_detail.html

@@ -1,7 +1,7 @@
 {% import "components/problem.html" as problem with context %}
 {% extends "layout/basic.html" %}
 {% block content %}
-{{ set(UiContext, 'socketUrl', "/record-detail-conn?domainId=" + rdoc.domainId + "&rid=" + rdoc._id) }}
+{{ set(UiContext, 'socketUrl', "record-detail-conn?domainId=" + rdoc.domainId + "&rid=" + rdoc._id) }}
 <div class="row">
   <div class="medium-9 columns">
     {% include 'record_detail_status.html' %}

packages/ui-default/templates/record_main.html

@@ -2,7 +2,7 @@
 {% block content %}
 {{ set(
   UiContext, 'socketUrl',
-  "/record-conn?domainId=" + handler.args.domainId
+  "record-conn?domainId=" + handler.args.domainId
   + (("&tid=" + filterTid) if filterTid else "")
   + (("&uidOrName=" + filterUidOrName) if filterUidOrName else "")
   + (("&pid=" + filterPid) if filterPid else "")