feat: Stitcher compatible with live streams (#122)

* Added support for multiple tags in EXTINF segment group * Refactored manual interstitials to support CUE * Error early when KV is not available on CF worker * Remove unused env variables for test * Simplified filter * Change content-type * Made sessionId optional * Do not expose outUrl * Added error log in app
superstreamerapp · Nov 22, 2024 · 4958411 · 4958411
1 parent da6e66e
commit 4958411
Show file tree

Hide file tree

Showing 30 changed files with 394 additions and 358 deletions.
diff --git a/bun.lockb b/bun.lockb
diff --git a/packages/api/src/env.ts b/packages/api/src/env.ts
@@ -1,13 +1,10 @@
 import { parseEnv } from "shared/env";
 
 export const env = parseEnv((z) => ({
-  // process
   PORT: z.coerce.number().default(52001),
-  HOST: z.string().default("0.0.0.0"),
-
-  // config.env
-  REDIS_HOST: z.string(),
-  REDIS_PORT: z.coerce.number(),
+  HOST: z.string().optional(),
+  REDIS_HOST: z.string().default("localhost"),
+  REDIS_PORT: z.coerce.number().default(6379),
   S3_ENDPOINT: z.string(),
   S3_REGION: z.string(),
   S3_ACCESS_KEY: z.string(),

diff --git a/packages/app/src/routes/(dashboard)/_layout/player.tsx b/packages/app/src/routes/(dashboard)/_layout/player.tsx
@@ -1,4 +1,4 @@
-import { Card } from "@nextui-org/react";
+import { Card, Modal, ModalBody, ModalContent } from "@nextui-org/react";
 import { createFileRoute } from "@tanstack/react-router";
 import { useRef, useState } from "react";
 import { CodeEditor } from "../../../components/CodeEditor";
@@ -14,14 +14,15 @@ export const Route = createFileRoute("/(dashboard)/_layout/player")({
 function RouteComponent() {
   const formRef = useRef<FormRef>(null);
   const [url, setUrl] = useState<string | null>(null);
+  const [error, setError] = useState<string | null>(null);
 
   const schema = useSwaggerSchema(
     `${window.__ENV__.PUBLIC_STITCHER_ENDPOINT}/swagger/json`,
     "/session",
   );
 
   return (
-    <div className="p-8 h-screen flex gap-4">
+    <div className="h-screen p-8 flex gap-4">
       <div className="grow">
         <Player url={url} lang="eng" metadata={{}} />
         <Card className="mt-4 p-4">
@@ -46,6 +47,8 @@ function RouteComponent() {
           schema={schema}
           localStorageKey="stitcherEditor"
           onSave={async (body) => {
+            setError(null);
+
             const response = await fetch(
               `${window.__ENV__.PUBLIC_STITCHER_ENDPOINT}/session`,
               {
@@ -57,14 +60,30 @@ function RouteComponent() {
               },
             );
 
+            const data = await response.json();
             if (response.ok) {
-              const { url } = await response.json();
-              formRef.current?.setValue("url", url);
-              setUrl(url);
+              formRef.current?.setValue("url", data.url);
+              setUrl(data.url);
+            } else {
+              setError(data);
             }
           }}
         />
       </Card>
+      <Modal
+        isOpen={error !== null}
+        onClose={() => setError(null)}
+        size="5xl"
+        scrollBehavior="inside"
+      >
+        <ModalContent>
+          <ModalBody className="p-4">
+            <pre className="text-xs text-red-500">
+              {JSON.stringify(error, null, 2)}
+            </pre>
+          </ModalBody>
+        </ModalContent>
+      </Modal>
     </div>
   );
 }
diff --git a/packages/artisan/src/env.ts b/packages/artisan/src/env.ts
@@ -1,12 +1,11 @@
 import { parseEnv } from "shared/env";
 
 export const env = parseEnv((z) => ({
-  // config.env
+  REDIS_HOST: z.string().default("localhost"),
+  REDIS_PORT: z.coerce.number().default(6379),
   S3_ENDPOINT: z.string(),
   S3_REGION: z.string(),
   S3_ACCESS_KEY: z.string(),
   S3_SECRET_KEY: z.string(),
   S3_BUCKET: z.string(),
-  REDIS_HOST: z.string(),
-  REDIS_PORT: z.coerce.number(),
 }));
diff --git a/packages/bolt/src/env.ts b/packages/bolt/src/env.ts
@@ -2,8 +2,8 @@ import { parseEnv } from "shared/env";
 
 const env = parseEnv((z) => ({
   // config.env
-  REDIS_HOST: z.string(),
-  REDIS_PORT: z.coerce.number(),
+  REDIS_HOST: z.string().default("localhost"),
+  REDIS_PORT: z.coerce.number().default(6379),
 }));
 
 export const connection = {

diff --git a/packages/stitcher/package.json b/packages/stitcher/package.json
@@ -28,13 +28,13 @@
     "@matvp91/elysia-swagger": "^2.0.0",
     "@superstreamer/api": "workspace:*",
     "@xmldom/xmldom": "^0.8.10",
-    "cryptr": "^6.3.0",
     "dom-parser": "^1.1.5",
     "elysia": "^1.1.24",
     "hh-mm-ss": "^1.2.0",
     "lru-cache": "^11.0.2",
     "luxon": "^3.5.0",
     "redis": "^4.7.0",
+    "secure-encrypt": "^1.0.12",
     "shared": "workspace:*",
     "superjson": "^2.2.1",
     "uuid": "^10.0.0",

diff --git a/packages/stitcher/runtime/local.ts b/packages/stitcher/runtime/local.ts
@@ -1,10 +1,5 @@
-import { parseEnv } from "shared/env";
 import { createApp } from "../src";
-
-const env = parseEnv((z) => ({
-  PORT: z.coerce.number().default(52002),
-  HOST: z.string().default("0.0.0.0"),
-}));
+import { env } from "../src/env";
 
 const app = createApp({
   aot: true,

diff --git a/packages/stitcher/src/adapters/kv/cloudflare-kv.ts b/packages/stitcher/src/adapters/kv/cloudflare-kv.ts
@@ -0,0 +1,21 @@
+import type { KVNamespace } from "@cloudflare/workers-types";
+
+// Make sure wrangler.toml has a binding named "kv".
+const kv = process.env["kv"] as unknown as KVNamespace;
+
+if (!kv) {
+  throw new ReferenceError(
+    'No kv found for Cloudflare, make sure you have "kv"' +
+      " set as binding in wrangler.toml.",
+  );
+}
+
+export async function set(key: string, value: string, ttl: number) {
+  await kv.put(key, value, {
+    expirationTtl: ttl,
+  });
+}
+
+export async function get(key: string) {
+  return await kv.get(key);
+}
diff --git a/packages/stitcher/src/adapters/kv/index.ts b/packages/stitcher/src/adapters/kv/index.ts
@@ -0,0 +1,15 @@
+import { env } from "../../env";
+
+interface KeyValue {
+  set(key: string, value: string, ttl: number): Promise<void>;
+  get(key: string): Promise<string | null>;
+}
+
+export let kv: KeyValue;
+
+// Map each KV adapter here to their corresponding import.
+if (env.KV === "cloudflare-kv") {
+  kv = await import("./cloudflare-kv");
+} else if (env.KV === "redis") {
+  kv = await import("./redis");
+}
diff --git a/packages/stitcher/src/adapters/kv/redis.ts b/packages/stitcher/src/adapters/kv/redis.ts
@@ -0,0 +1,23 @@
+import { createClient } from "redis";
+import { env } from "../../env";
+
+const REDIS_PREFIX = "stitcher";
+
+const client = createClient({
+  socket: {
+    host: env.REDIS_HOST,
+    port: env.REDIS_PORT,
+  },
+});
+
+await client.connect();
+
+export async function set(key: string, value: string, ttl: number) {
+  await client.set(`${REDIS_PREFIX}:${key}`, value, {
+    EX: ttl,
+  });
+}
+
+export async function get(key: string) {
+  return await client.get(`${REDIS_PREFIX}:${key}`);
+}
diff --git a/packages/stitcher/src/env.ts b/packages/stitcher/src/env.ts
@@ -1,10 +1,13 @@
 import { parseEnv } from "shared/env";
 
 export const env = parseEnv((z) => ({
-  SERVERLESS: z.coerce.boolean().default(false),
+  PORT: z.coerce.number().default(52002),
+  HOST: z.string().optional(),
+
+  KV: z.enum(["redis", "cloudflare-kv"]).default("redis"),
+  REDIS_HOST: z.string().default("localhost"),
+  REDIS_PORT: z.coerce.number().default(6379),
 
-  REDIS_HOST: z.string(),
-  REDIS_PORT: z.coerce.number(),
   PUBLIC_S3_ENDPOINT: z.string(),
   PUBLIC_STITCHER_ENDPOINT: z.string(),
   PUBLIC_API_ENDPOINT: z.string(),

diff --git a/packages/stitcher/src/filters.ts b/packages/stitcher/src/filters.ts
@@ -1,10 +1,25 @@
+import { t } from "elysia";
 import type { MasterPlaylist } from "./parser";
 
 export interface Filter {
   resolution?: string;
   audioLanguage?: string;
 }
 
+export function formatFilterToQueryParam(filter?: Filter) {
+  if (!filter) {
+    return undefined;
+  }
+  return btoa(JSON.stringify(filter));
+}
+
+export const filterSchema = t.Optional(
+  t
+    .Transform(t.String())
+    .Decode((value) => JSON.parse(atob(value)) as Filter)
+    .Encode((filter) => btoa(JSON.stringify(filter))),
+);
+
 function parseRange(input: string): [number, number] | null {
   const match = input.match(/^(\d+)-(\d+)$/);
 
@@ -77,24 +92,3 @@ export function filterMasterPlaylist(master: MasterPlaylist, filter: Filter) {
     });
   }
 }
-
-export function getFilterFromQuery(query: Record<string, string>) {
-  const filter: Filter = {};
-  if ("filter.resolution" in query) {
-    filter.resolution = query["filter.resolution"];
-  }
-  if ("filter.audioLanguage" in query) {
-    filter.audioLanguage = query["filter.audioLanguage"];
-  }
-  return filter;
-}
-
-export function getQueryParamsFromFilter(filter: Filter) {
-  const queryParams: Record<string, string> = {};
-
-  Object.entries(filter).forEach(([key, value]) => {
-    queryParams[`filter.${key}`] = value;
-  });
-
-  return queryParams;
-}