feat: allow configuring socket url in browser clients, fix #90

src/client/Client.js

@@ -15,32 +15,18 @@ import logger from '../common/logger.js';
 /**
  * Configuration object for a client running in a browser runtime.
  *
- * @typedef BrowserClientConfig
+ * @typedef ClientConfig
  * @memberof client
  * @type {object}
  * @property {string} role - Role of the client in the application (e.g. 'player', 'controller').
  * @property {object} [app] - Application configration object.
  * @property {string} [app.name=''] - Name of the application.
  * @property {string} [app.author=''] - Name of the author.
  * @property {object} [env] - Environment configration object.
- * @property {string} [env.websockets={}] - Configuration options for websockets.
- * @property {string} [env.subpath=''] - If running behind a proxy, path to the application.
- */
-
-/**
- * Configuration object for a client running in a node runtime.
- *
- * @typedef NodeClientConfig
- * @memberof client
- * @type {object}
- * @property {string} role - Role of the client in the application (e.g. 'player', 'controller').
- * @property {object} [app] - Application configration object.
- * @property {string} [app.name=''] - Name of the application.
- * @property {string} [app.author=''] - Name of the author.
- * @property {object} env - Environment configration object.
- * @property {boolean} env.serverAddress - Domain name or IP of the server.
- * @property {boolean} env.useHttps - Define is the server run in http or in https.
- * @property {boolean} env.port - Port on which the server is listening.
+ * @property {boolean} env.useHttps - Define if the websocket should use secure connection.
+ * @property {boolean} [env.serverAddress=''] - Address the socket server. Mandatory for
+ *  node clients. For browser clients, use `window.location.domain` as fallback if empty.
+ * @property {boolean} env.port - Port of the socket server.
  * @property {string} [env.websockets={}] - Configuration options for websockets.
  * @property {string} [env.subpath=''] - If running behind a proxy, path to the application.
  */
@@ -66,8 +52,7 @@ import logger from '../common/logger.js';
  */
 class Client {
   /**
-   * @param {client.BrowserClientConfig|client.NodeClientConfig} config -
-   *  Configuration of the soundworks client.
+   * @param {client.ClientConfig} config - Configuration of the soundworks client.
    * @throws Will throw if the given config object is invalid.
    */
   constructor(config) {
@@ -114,7 +99,7 @@ class Client {
     /**
      * Configuration object.
      *
-     * @type {client.BrowserClientConfig|client.NodeClientConfig}
+     * @type {client.ClientConfig}
      */
     this.config = config;
 

src/client/Socket.js

@@ -99,25 +99,29 @@ class Socket {
       path = `${config.env.subpath}/${path}`;
     }
 
-    let url;
+    const protocol = config.env.useHttps ? 'wss:' : 'ws:';
+    const port = config.env.port;
+    let serverAddress;
     let webSocketOptions;
 
     if (isBrowser()) {
-      const protocol = window.location.protocol.replace(/^http?/, 'ws');
-      const { hostname, port } = window.location;
+      // if a server address is given in config, use it, else fallback to URL hostname
+      if (config.env.serverAddress !== '') {
+        serverAddress = config.env.serverAddress;
+      } else {
+        serverAddress = window.location.hostname;
+      }
 
-      url = `${protocol}//${hostname}:${port}/${path}`;
       webSocketOptions = [];
     } else {
-      const protocol = config.env.useHttps ? 'wss:' : 'ws:';
-      const { serverAddress, port } = config.env;
+      serverAddress = config.env.serverAddress;
 
-      url = `${protocol}//${serverAddress}:${port}/${path}`;
       webSocketOptions = {
         rejectUnauthorized: false,
       };
     }
 
+    const url = `${protocol}//${serverAddress}:${port}/${path}`;
     let queryParams = `role=${role}&key=${key}`;
 
     if (config.token) {

src/client/index.js

@@ -1,3 +1,9 @@
+/**
+ * @license
+ * Copyright (c) 2014-present IRCAM – Centre Pompidou (France, Paris)
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+
 /**
  * Client-side part of the `soundworks` framework.
  *

src/server/Server.js

@@ -1060,6 +1060,12 @@ Invalid certificate files, please check your:
           },
           env: {
             type: config.env.type,
+            // use to configure the socket if the server is running on a different
+            // location than the one the client was served from (cf. #90)
+            useHttps: config.env.useHttps,
+            serverAddress: config.env.serverAddress,
+            port: config.env.port,
+            // other config, to review
             websockets: config.env.websockets,
             subpath: config.env.subpath,
             useMinifiedFile: useMinifiedFile[role],

src/server/index.js

@@ -1,3 +1,9 @@
+/**
+ * @license
+ * Copyright (c) 2014-present IRCAM – Centre Pompidou (France, Paris)
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+
 /**
  * Server-side part of the *soundworks* framework.
  *