@statewalker/webrun-http-browser 0.1.0 → 0.2.1

package/dist/index-sw.js

@@ -1,18 +1,4 @@
-// @statewalker/webrun-http-browser v0.1.0 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
-function serializeError(error) {
-  return Object.assign({
-    message: error,
-    stack: error.stack,
-  }, error);
-}
-
-function deserializeError(error) {
-  if (typeof error === "string") {
-    error = { message: error };
-  }
-  return Object.assign(new Error(error.message), error);
-}
-
+// @statewalker/webrun-http-browser v0.2.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 // See https://github.com/agenjs/agen-utils/blob/main/src/iterator.js
 async function* iterate(init, queue = []) {
   let promise, notify, push = async (error, value, done) => {
@@ -51,6 +37,126 @@ async function* iterate(init, queue = []) {
   }
 }
 
+function newRegistry(onError = console.error) {
+  let counter = 0;
+  const registrations = {};
+  const register = (action) => {
+    const id = counter++;
+    return (registrations[id] = Object.assign(
+      function (skip) {
+        try {
+          delete registrations[id];
+          return !skip && action && action();
+        } catch (error) {
+          onError(error);
+        }
+      },
+      { action }
+    ));
+  };
+  const unregister = (action) =>
+    Object.values(registrations).forEach((r) => r.action === action && r(true));
+  const clear = () => Object.values(registrations).forEach((r) => r());
+  return Object.assign([register, clear, unregister], {
+    register,
+    clear,
+    unregister
+  });
+}
+
+function promisifyRequest(request) {
+    return new Promise((resolve, reject) => {
+        // @ts-ignore - file size hacks
+        request.oncomplete = request.onsuccess = () => resolve(request.result);
+        // @ts-ignore - file size hacks
+        request.onabort = request.onerror = () => reject(request.error);
+    });
+}
+function createStore(dbName, storeName) {
+    const request = indexedDB.open(dbName);
+    request.onupgradeneeded = () => request.result.createObjectStore(storeName);
+    const dbp = promisifyRequest(request);
+    return (txMode, callback) => dbp.then((db) => callback(db.transaction(storeName, txMode).objectStore(storeName)));
+}
+let defaultGetStoreFunc;
+function defaultGetStore() {
+    if (!defaultGetStoreFunc) {
+        defaultGetStoreFunc = createStore('keyval-store', 'keyval');
+    }
+    return defaultGetStoreFunc;
+}
+/**
+ * Get a value by its key.
+ *
+ * @param key
+ * @param customStore Method to get a custom store. Use with caution (see the docs).
+ */
+function get(key, customStore = defaultGetStore()) {
+    return customStore('readonly', (store) => promisifyRequest(store.get(key)));
+}
+/**
+ * Set a value with a key.
+ *
+ * @param key
+ * @param value
+ * @param customStore Method to get a custom store. Use with caution (see the docs).
+ */
+function set(key, value, customStore = defaultGetStore()) {
+    return customStore('readwrite', (store) => {
+        store.put(value, key);
+        return promisifyRequest(store.transaction);
+    });
+}
+
+function serializeError(error) {
+  return Object.assign({
+    message: error,
+    stack: error.stack,
+  }, error);
+}
+
+function deserializeError(error) {
+  if (typeof error === "string") {
+    error = { message: error };
+  }
+  return Object.assign(new Error(error.message), error);
+}
+
+async function callChannel(mainChannel, callType, params, ...transfers) {
+  return new Promise((resolve, reject) => {
+    const channel = new MessageChannel();
+    channel.port1.onmessage = (ev) => {
+      const { result, error } = ev.data;
+      if (error) reject(deserializeError(error));
+      else resolve(result);
+    };
+    mainChannel.postMessage({ type: callType, params }, [
+      channel.port2,
+      ...transfers,
+    ]);
+  });
+}
+
+function handleChannelCalls(mainChannel, callType, handler) {
+  const messageListener = async (event) => {
+    if (!event.data || event.data.type !== callType) return;
+    const [port, ...transfers] = event.ports;
+    let response = {};
+    try {
+      const params = event.data.params;
+      response.result = await handler(event, params, ...transfers);
+    } catch (error) {
+      response.error = serializeError(error);
+    }
+    port.postMessage(response);
+  };
+  mainChannel.addEventListener("message", messageListener);
+  try {
+    mainChannel.start && mainChannel.start();
+  } catch (e) {}
+  return () => mainChannel.removeEventListener("message", messageListener);
+}
+
 async function* recieveData(onMessage) {
   yield* iterate((iterator) => {
     return onMessage(async ({ done = true, value, error } = {}) => {
@@ -115,7 +221,10 @@ function newChannel(port) {
       await listener(data);
     }
   };
-  const channel = newInvokationChannel(port, notifyAll);
+  const channel = newInvokationChannel({
+    port,
+    handler: notifyAll,
+  });
 
   const start = () => channel.start();
 
@@ -153,15 +262,20 @@ function newChannel(port) {
   };
 }
 
-function newInvokationChannel(port, handler = () => {
-  throw new Error("Handler not implemented");
+function newInvokationChannel({
+  port,
+  handler = () => {
+    throw new Error("Handler not implemented");
+  },
+  onError = console.error,
+  newCallId = () =>
+    newInvokationChannel.__counter = (newInvokationChannel.__counter || 0) + 1,
 }) {
   const MESSAGE_TYPE_REQUEST = "REQUEST";
   const MESSAGE_TYPE_RESPONSE = "RESPONSE";
   const EVENT_MESSAGE = "message";
 
   const requests = {};
-  let requestCounter = 0;
   const listener = async (event) => {
     const data = event.data || {};
     const { type, callId } = data;
@@ -198,17 +312,25 @@ function newInvokationChannel(port, handler = () => {
   };
 
   const start = async () => {
-    port.addEventListener(EVENT_MESSAGE, listener);
-    await port.start();
+    try {
+      port.addEventListener(EVENT_MESSAGE, listener);
+      port.start && await port.start();
+    } catch (e) {
+      onError(e);
+    }
   };
 
   const close = async () => {
-    port.removeEventListener(EVENT_MESSAGE, listener);
-    await port.close();
+    try {
+      port.removeEventListener(EVENT_MESSAGE, listener);
+      port.close && await port.close();
+    } catch (e) {
+      onError(e);
+    }
   };
 
   const invoke = async function (request = {}, ...transfers) {
-    const callId = ++requestCounter;
+    const callId = newCallId();
     return new Promise((resolve, reject) => {
       try {
         requests[callId] = { resolve, reject };
@@ -366,278 +488,300 @@ async function sendHttpRequest(communicationPort, request) {
   return await clientStub(request);
 }
 
-async function callChannel(mainChannel, callType, params, ...transfers) {
-  return new Promise((resolve, reject) => {
-    const channel = new MessageChannel();
-    channel.port1.onmessage = (ev) => {
-      const { result, error } = ev.data;
-      if (error) reject(deserializeError(error));
-      else resolve(result);
-    };
-    mainChannel.postMessage({ type: callType, params }, [
-      channel.port2,
-      ...transfers,
-    ]);
-  });
-}
-
-function handleChannelCalls(mainChannel, callType, handler) {
-  const messageListener = async (event) => {
-    if (!event.data || event.data.type !== callType) return;
-    const [port, ...transfers] = event.ports;
-    let response = {};
-    try {
-      const params = event.data.params;
-      response.result = await handler(event, params, ...transfers);
-    } catch (error) {
-      response.error = serializeError(error);
-    }
-    port.postMessage(response);
+function splitServiceUrl(url, separator = "~") {
+  let key = "";
+  let path = "";
+  let str = url + "";
+  const idx = str.indexOf(separator);
+  let baseUrl = "";
+  if (idx >= 0) {
+    baseUrl = str.substring(0, idx + separator.length);
+    str.substring(idx + separator.length)
+      .replace(/^([^\/]+)/, (match, $1) => {
+        baseUrl += match;
+        if (baseUrl.length < str.length) baseUrl += "/";
+        key = $1;
+        path = str.substring(baseUrl.length);
+        return "";
+      });
+  }
+  return {
+    url,
+    key,
+    baseUrl,
+    path,
   };
-  mainChannel.addEventListener("message", messageListener);
-  try {
-    mainChannel.start && mainChannel.start();
-  } catch (e) {}
-  return () => mainChannel.removeEventListener("message", messageListener);
-}
-
-function promisifyRequest(request) {
-    return new Promise((resolve, reject) => {
-        // @ts-ignore - file size hacks
-        request.oncomplete = request.onsuccess = () => resolve(request.result);
-        // @ts-ignore - file size hacks
-        request.onabort = request.onerror = () => reject(request.error);
-    });
-}
-function createStore(dbName, storeName) {
-    const request = indexedDB.open(dbName);
-    request.onupgradeneeded = () => request.result.createObjectStore(storeName);
-    const dbp = promisifyRequest(request);
-    return (txMode, callback) => dbp.then((db) => callback(db.transaction(storeName, txMode).objectStore(storeName)));
-}
-let defaultGetStoreFunc;
-function defaultGetStore() {
-    if (!defaultGetStoreFunc) {
-        defaultGetStoreFunc = createStore('keyval-store', 'keyval');
-    }
-    return defaultGetStoreFunc;
-}
-/**
- * Get a value by its key.
- *
- * @param key
- * @param customStore Method to get a custom store. Use with caution (see the docs).
- */
-function get(key, customStore = defaultGetStore()) {
-    return customStore('readonly', (store) => promisifyRequest(store.get(key)));
-}
-/**
- * Set a value with a key.
- *
- * @param key
- * @param value
- * @param customStore Method to get a custom store. Use with caution (see the docs).
- */
-function set(key, value, customStore = defaultGetStore()) {
-    return customStore('readwrite', (store) => {
-        store.put(value, key);
-        return promisifyRequest(store.transaction);
-    });
 }
 
-class SwPortDispatcher {
-  constructor({ self, log }) {
-    this.self = self;
-    this.log = log;
-    // Contains mapping between path prefixes and clientIds
-    this.handlersIndex = new Map();
+class HttpError extends Error {
+  constructor(options) {
+    super(options.message);
+    this.status = options.status;
+    this.statusText = options.statusText;
   }
-
-  get scope() {
-    return new URL("./", import.meta.url) + "";
+  getResponseOptions(options = {}) {
+    return Object.assign(this.toJson(), options);
+  }
+  toJson() {
+    return {
+      status: this.status,
+      statusText: this.statusText,
+      message: this.message,
+    };
   }
 
-  async loadChannelInfo(key) {
-    await this._checkActivation();
-    let result;
-    for (let channelInfo of this.handlersIndex.values()) {
-      if (channelInfo.key !== key) continue;
-      const clientId = channelInfo.clientId;
-      const client = await self.clients.get(clientId);
-      if (!client) {
-        // Client gone. Remove the corresponding handlers from the index.
-        this.handlersIndex.delete(clientId);
-        throw Object.assign(new Error("Error 410: Resource Gone"), {
-          status: 410,
-        });
-      }
-      result = channelInfo;
-      break;
+  static fromError(error) {
+    if (!(error instanceof HttpError)) {
+      error = new HttpError(Object.assign({
+        status: 500,
+        statusText: "Bad Request",
+        reason: error.message,
+      }));
     }
-    return result;
+    return error;
   }
 
-  start() {
-    this._cleanup = handleChannelCalls(
-      this.self,
-      "UPDATE_COMMUNICATION_PORT",
-      async (event, channelInfo, port) => {
-        const clientId = event.source.id;
-        this.log("[UPDATE_COMMUNICATION_PORT]", clientId, channelInfo);
-        await this._updateChannelInfo({ ...channelInfo, port, clientId });
-        return { ...channelInfo };
-      },
-    );
-    this.self.onmessage = () => {};
-
-    this.self.addEventListener("install", (event) => {
-      this.log("Skip waiting on install.", event);
-      this.self.skipWaiting();
+  static errorResourceNotFound(options = {}) {
+    return new HttpError({
+      status: 404,
+      statusText: "Error 404: Resource not found",
+      ...options,
     });
-
-    this.self.addEventListener("activate", async (event) => {
-      this.log(
-        "Claim control over all clients.",
-        event,
-        clients,
-        this.self.clients,
-      );
-      event.waitUntil((async () => {
-        await this.self.clients.claim();
-        await this._checkActivation();
-      })());
+  }
+  static errorForbidden(options = {}) {
+    return new HttpError({
+      status: 403,
+      statusText: "Error 403: Forbidden",
+      ...options,
     });
   }
 
-  async stop() {
-    if (this._cleanup) {
-      await this._cleanup();
-      this._cleanup = undefined;
-    }
+  static errorResourceGone(options = {}) {
+    return new HttpError({
+      status: 410,
+      statusText: "Error 410: Resource Gone",
+      ...options,
+    });
   }
 
-  async _checkActivation() {
-    return this._activationPromise = this._activationPromise ||
-      this._activate();
+  static errorInternalError(options) {
+    return new HttpError({
+      ...options,
+      status: 500,
+      statusText: "Error 500: Internal error",
+    });
   }
+}
 
-  async _activate() {
-    this.log("[checkActivation]");
-    let clientsIndex = await this._loadClientIds();
-    for (let [clientId, client] of clientsIndex.entries()) {
-      const messageChannel = new MessageChannel();
-      const port = messageChannel.port1;
-      const channelInfo = await callChannel(
-        client,
-        "UPDATE_COMMUNICATION_PORT",
-        {},
-        messageChannel.port2,
-      );
-      await this._updateChannelInfo({ ...channelInfo, port, clientId });
-    }
-  }
+function startRelayServiceWorker(self) {
+  const [register, clear] = newRegistry();
 
-  async _updateChannelInfo(channelInfo) {
-    this.log("[updateClientInfo]", channelInfo);
-    this.handlersIndex.set(channelInfo.clientId, channelInfo);
-    await this._updateClientIds([]);
+  if (typeof self.skipWaiting === "function") {
+    console.log("self.skipWaiting() is supported.");
+    self.addEventListener("install", (e) => {
+      // See https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-global-scope-skipwaiting
+      e.waitUntil(self.skipWaiting());
+    });
+  } else {
+    console.log("self.skipWaiting() is not supported.");
   }
 
-  async _loadClientIds() {
-    const clientIds = new Set((await get("clientIds")) || []);
-    return await this._updateClientIds(clientIds);
+  if (self.clients && (typeof self.clients.claim === "function")) {
+    console.log("self.clients.claim() is supported.");
+    self.addEventListener("activate", (e) => {
+      // See https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#clients-claim-method
+      e.waitUntil(self.clients.claim());
+    });
+  } else {
+    console.log("self.clients.claim() is not supported.");
   }
 
-  async _updateClientIds(clientIds) {
-    clientIds = new Set(clientIds);
-    for (let clientId of this.handlersIndex.keys()) {
-      clientIds.add(clientId);
+  const clientsRegistry = newClientsRegistry({
+    self,
+    get,
+    set,
+  });
+
+  // This listener handles the following message types:
+  // * registration: registers new clients as service providers
+  // * handles service calls rounting:
+  //   - it gets the clientKey defined in the call
+  //   - it uses the serviceKey to get the service-specifc channel
+  //   - it creates a new message channel and sent its ports to peers
+
+  register(handleChannelCalls(self, "REGISTER", async (event, data) => {
+    return await clientsRegistry.addClient(data.key, event.source);
+  }));
+  register(handleChannelCalls(self, "UNREGISTER", async (event, data) => {
+    return await clientsRegistry.removeClient(data.key);
+  }));
+
+  // Transfers all parameters (and ports) to the target client.
+  register(handleChannelCalls(self, "CONNECT", async (event, data, port) => {
+    const { key } = data;
+    const client = await clientsRegistry.getClient(key);
+    if (!client) {
+      throw new Error(`Target client was not found. Target key: "${key}".`);
+    }
+    return await callChannel(client, "CONNECT", data, port);
+  }));
+
+  const fetchListener = (event) => {
+    const request = event.request;
+    const params = splitServiceUrl(request.url);
+    const { key } = params;
+    if (key) {
+      const handler = async () => {
+        try {
+          const channel = new MessageChannel();
+          const client = await clientsRegistry.getClient(key);
+          if (!client) {
+            throw HttpError.errorResourceGone(params);
+          }
+          const data = {
+            type: "http",
+            key,
+          };
+          if (!await callChannel(client, "CONNECT", data, channel.port2)) {
+            throw HttpError.errorForbidden(params);
+          }
+          return await sendHttpRequest(channel.port1, request);
+        } catch (error) {
+          error = HttpError.fromError(error);
+          const options = error.getResponseOptions(params);
+          return new Response(JSON.stringify(options), {
+            ...options,
+            headers: {
+              "Content-Type": "text/javascript",
+            },
+          });
+        }
+      };
+      event.respondWith(handler());
     }
-    const index = new Map();
-    for (let clientId of clientIds) {
-      const client = await this.self.clients.get(clientId);
-      if (client) index.set(clientId, client);
-      else this.handlersIndex.delete(clientId);
+  };
+  self.addEventListener("fetch", fetchListener);
+  register(() => self.removeEventListener("fetch", fetchListener));
+
+  return clear;
+}
+
+// --------------------------------------------
+// errors.js
+
+// --------------------------------------------
+
+function newClientsRegistry({
+  self,
+  key = "clientsIds",
+  get,
+  set,
+}) {
+  let _index;
+  async function loadClientsIndex() {
+    if (!_index) {
+      const entries = (await get(key)) || [];
+      _index = Object.fromEntries(entries);
     }
-    await set("clientIds", [...index.keys()].sort());
+    return _index;
+  }
+  async function storeClientsIndex() {
+    const index = await loadClientsIndex();
+    const entries = Object.entries(index);
+    await set(key, entries);
     return index;
   }
-}
 
-class SwHttpDispatcher extends SwPortDispatcher {
-  constructor(options) {
-    super(options);
+  async function addClient(clientKey, client) {
+    const index = await loadClientsIndex();
+    const clientId = client.id;
+    let result = false;
+    if (!(clientId in index)) {
+      index[clientKey] = clientId;
+      await storeClientsIndex();
+      result = true;
+    }
+    return result;
   }
 
-  start() {
-    super.start();
-    this.self.addEventListener("fetch", this._handleFetchEvent.bind(this));
+  async function removeClient(clientKey) {
+    const index = await loadClientsIndex();
+    let result = false;
+    if (clientKey in index) {
+      delete index[clientKey];
+      await storeClientsIndex();
+      result = true;
+    }
+    return result;
   }
 
-  _handleFetchEvent(event) {
-    event.respondWith((async () => {
-      const request = event.request;
-      try {
-        const requestUrl = request.url;
-        const rootUrl = this.scope;
-        let channelInfo;
-        if (requestUrl.indexOf(rootUrl) === 0) {
-          const key = requestUrl
-            .substring(rootUrl.length)
-            .replace(/^\/?([^\/]+).*$/, "$1");
-          // console.log(`* rootUrl="${rootUrl}" requestUrl="${requestUrl}" key="${key}"`);
-          channelInfo = await this.loadChannelInfo(key);
-        }
-        if (channelInfo && channelInfo.port) {
-          return await sendHttpRequest(channelInfo.port, request);
-        } else {
-          const newRequest = new Request(requestUrl, {
-            method: request.method,
-            headers: request.headers,
-            body: request.body,
-            referrer: request.referrer,
-            referrerPolicy: request.referrerPolicy,
-            // mode: request.mode,
-            credentials: request.credentials,
-            cache: request.cache,
-            redirect: request.redirect,
-            integrity: request.integrity,
-          });
-          return await fetch(newRequest);
-        }
-
-        // const requestUrl = request.url;
-        // let url = requestUrl.replace(
-        //   /^.*\/[0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12}(.*)$/,
-        //   "$1",
-        // );
-        // if (url !== requestUrl) {
-        //   url = new URL(
-        //     "/packages/webrun-http-browser/src" + url,
-        //     self.location.href,
-        //   );
-        // }
-      } catch (error) {
-        console.error(error);
-        return new Response(null, {
-          status: 500,
-          statusText: "Error 500: Internal error",
-        });
-      }
-    })());
+  async function getClient(clientKey) {
+    const index = await loadClientsIndex();
+    const clientId = index[clientKey];
+    const client = await self.clients.get(clientId);
+    if (!client) {
+      delete index[clientKey];
+      await storeClientsIndex();
+    }
+    return client;
   }
-}
-function startHttpDispatcher({ self, log }) {
-  const dispatcher = new SwHttpDispatcher({ self, log });
-  dispatcher.start();
-  return () => {
-    dispatcher.stop();
+
+  return {
+    getClient,
+    addClient,
+    removeClient,
   };
 }
-
-const result = startHttpDispatcher({
-  self,
-  log: console.log.bind(console, "[sw]"),
-});
-
-export { result };
+// ----------------------------------------------------
+// Content of the "idb-keyval" package
+// import { get, set } from "idb-keyval";
+
+// function promisifyRequest(request) {
+//   return new Promise((resolve, reject) => {
+//     // @ts-ignore - file size hacks
+//     request.oncomplete = request.onsuccess = () => resolve(request.result);
+//     // @ts-ignore - file size hacks
+//     request.onabort = request.onerror = () => reject(request.error);
+//   });
+// }
+// function createStore(dbName, storeName) {
+//   const request = indexedDB.open(dbName);
+//   request.onupgradeneeded = () => request.result.createObjectStore(storeName);
+//   const dbp = promisifyRequest(request);
+//   return (txMode, callback) =>
+//     dbp.then((db) =>
+//       callback(db.transaction(storeName, txMode).objectStore(storeName))
+//     );
+// }
+// let defaultGetStoreFunc;
+// function defaultGetStore() {
+//   if (!defaultGetStoreFunc) {
+//     defaultGetStoreFunc = createStore("keyval-store", "keyval");
+//   }
+//   return defaultGetStoreFunc;
+// }
+// /**
+//  * Get a value by its key.
+//  *
+//  * @param key
+//  * @param customStore Method to get a custom store. Use with caution (see the docs).
+//  */
+// function get(key, customStore = defaultGetStore()) {
+//   return customStore("readonly", (store) => promisifyRequest(store.get(key)));
+// }
+// /**
+//  * Set a value with a key.
+//  *
+//  * @param key
+//  * @param value
+//  * @param customStore Method to get a custom store. Use with caution (see the docs).
+//  */
+// function set(key, value, customStore = defaultGetStore()) {
+//   return customStore("readwrite", (store) => {
+//     store.put(value, key);
+//     return promisifyRequest(store.transaction);
+//   });
+// }
+
+startRelayServiceWorker(self);
+//