@rubriclab/bunl 0.0.11 → 0.0.12

package/README.md

@@ -39,9 +39,22 @@ bun client -p 3000
 With full args:
 
 ```bash
-bun client --port 3000 --domain localhost:1234 --subdomain my-subdomain
+bun client --port 3000 --domain example.so --subdomain my-subdomain --open
 ```
 
+Or in shortform:
+
+```bash
+bun client -p 3000 -d example.so -s my-subdomain -o
+```
+
+The options:
+
+- `port` / `p` the localhost port to expose eg. **3000**
+- `domain` / `d` the hostname of the server Bunl is running on eg. **example.so**
+- `subdomain` / `s` the public URL to request eg. **my-subdomain**.example.so
+- `open` / `o` to auto-open your public URL in the browser
+
 ### [WIP] Deployment
 
 To build the client code:

package/client.ts

@@ -1,41 +1,65 @@
 import { parseArgs } from "util";
+import browser from "open";
 
 async function main({
   url,
   domain,
   subdomain,
+  open,
 }: {
   url: string;
   domain?: string;
   subdomain?: string;
+  open?: boolean;
 }) {
-  const serverUrl = `ws://${domain || "localhost:1234"}?new${
-    subdomain ? `&subdomain=${subdomain}` : ""
-  }`;
+  const params = new URLSearchParams({
+    new: "",
+    ...(subdomain ? { subdomain } : {}),
+  }).toString();
+  const serverUrl = `ws://${domain}?${params}`;
   const socket = new WebSocket(serverUrl);
 
-  socket.addEventListener("message", (event) => {
+  socket.addEventListener("message", async (event) => {
     const data = JSON.parse(event.data as string);
     console.log("message:", data);
 
+    if (open && data.url) browser(data.url);
+
     if (data.method) {
-      fetch(`${url}${data.path}`, {
+      const res = await fetch(`${url}${data.pathname}`, {
         method: data.method,
         headers: data.headers,
-      })
-        .then((res) => res.text())
-        .then((res) => socket.send(res));
+      });
+
+      const { status, statusText, headers } = res;
+      const body = await res.text();
+
+      const serializedRes = JSON.stringify({
+        pathname: data.pathname,
+        status,
+        statusText,
+        headers: Object.fromEntries(headers),
+        body,
+      });
+
+      socket.send(serializedRes);
     }
   });
 
   socket.addEventListener("open", (event) => {
     if (!(event.target as any).readyState) throw "Not ready";
   });
+
+  socket.addEventListener("close", () => {
+    console.log(`\x1b[31mfailed to connect to server\x1b[0m`);
+    process.exit();
+  });
 }
 
 /**
- * Eg. `bun client.ts -p 3000 -d tunnel.example.so -s my-subdomain`
- * > my-subdomain.tunnel.example.so will be proxied to localhost:3000
+ * Eg. `bun client.ts -p 3000 -d example.so -s my-subdomain -o`
+ * > my-subdomain.example.so will be proxied to localhost:3000
+ * See README for full usage.
  */
 const { values } = parseArgs({
   args: Bun.argv,
@@ -47,20 +71,28 @@ const { values } = parseArgs({
     },
     domain: {
       type: "string",
+      default: "localhost:1234",
       short: "d",
     },
     subdomain: {
       type: "string",
       short: "s",
     },
+    open: {
+      type: "boolean",
+      short: "o",
+    },
   },
   allowPositionals: true,
 });
 
 if (!values.port) throw "pass -p 3000";
 
+const { port, domain, subdomain, open } = values;
+
 main({
-  url: `localhost:${values.port}`,
-  domain: values.domain,
-  subdomain: values.subdomain,
+  url: `localhost:${port}`,
+  domain,
+  subdomain,
+  open,
 });

package/package.json

@@ -3,15 +3,16 @@
     "bunl": "build/client.js"
   },
   "name": "@rubriclab/bunl",
-  "description": "expose localhost to the world",
-  "version": "0.0.11",
+  "description": "Expose localhost to the world",
+  "version": "0.0.12",
   "license": "MIT",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/RubricLab/bunl.git"
   },
   "dependencies": {
-    "human-id": "^4.1.1"
+    "human-id": "^4.1.1",
+    "open": "^10.1.0"
   },
   "devDependencies": {
     "@types/bun": "latest"

package/server.ts

@@ -7,6 +7,7 @@ const port = Bun.env.PORT || 1234;
 const scheme = Bun.env.SCHEME || "http";
 const domain = Bun.env.DOMAIN || `localhost:${port}`;
 
+// TODO: replace this with Redis to preserve sessions across deployments
 const clients = new Map<string, ServerWebSocket<Client>>();
 const clientData = new Map<string, any>();
 
@@ -17,7 +18,9 @@ serve<Client>({
 
     if (reqUrl.searchParams.has("new")) {
       const requested = reqUrl.searchParams.get("subdomain");
-      const id = requested && !clients.has(requested) ? requested : uid();
+      let id = requested || uid();
+      if (clients.has(id)) id = uid();
+
       const upgraded = server.upgrade(req, { data: { id } });
       if (upgraded) return;
       else return new Response("upgrade failed", { status: 500 });
@@ -32,14 +35,14 @@ serve<Client>({
     // The magic: forward the req to the client
     const client = clients.get(subdomain)!;
     const { method, url, headers } = req;
-    const path = new URL(url).pathname;
-    client.send(JSON.stringify({ method, path, headers }));
+    const { pathname } = new URL(url);
+    client.send(JSON.stringify({ method, pathname, headers }));
 
     // Wait for the client to cache its response above
     await sleep(1);
 
     let retries = 5;
-    let res = clientData.get(subdomain);
+    let res = clientData.get(`${subdomain}/${pathname}`);
 
     // Poll every second for the client to respond
     // TODO: replace poll with a client-triggered callback
@@ -47,20 +50,26 @@ serve<Client>({
       await sleep(1000);
       retries--;
 
-      res = clientData.get(subdomain);
+      res = clientData.get(`${subdomain}/${pathname}`);
 
       if (retries < 1) {
-        console.log(`\x1b[31m${subdomain} not responding \x1b[0m`);
-        return new Response("client not responding :(", { status: 500 });
+        return new Response("client not responding", { status: 500 });
       }
     }
 
-    return new Response(res);
+    const { status, statusText, headers: resHeaders, body } = JSON.parse(res);
+    const init = { headers: resHeaders, status, statusText };
+    delete resHeaders["content-encoding"];
+    delete resHeaders["Content-Encoding"];
+
+    return new Response(body, init);
   },
   websocket: {
     open(ws) {
-      console.log("connecting to", ws.data.id);
       clients.set(ws.data.id, ws);
+      console.log(
+        `\x1b[32mconnected to ${ws.data.id} (${clients.size} total)\x1b[0m`
+      );
       ws.send(
         JSON.stringify({
           url: `${scheme}://${ws.data.id}.${domain}`,
@@ -69,7 +78,9 @@ serve<Client>({
     },
     message(ws, message) {
       console.log("message from", ws.data.id);
-      clientData.set(ws.data.id, message);
+
+      const { pathname } = JSON.parse(message as string);
+      clientData.set(`${ws.data.id}/${pathname}`, message);
     },
     close(ws) {
       console.log("closing", ws.data.id);