[{"_1":2,"_170":-5,"_171":-5},"loaderData",{"_3":4,"_91":92},"root",{"_5":6,"_34":35,"_64":65},"ctx",{"_7":8,"_23":-5,"_24":25,"_26":27,"_28":20,"_29":20,"_30":20,"_31":32,"_33":20},"auth",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5,"_18":-5,"_19":20,"_21":22},"sessionClaims","sessionId","sessionStatus","userId","actor","orgId","orgRole","orgSlug","orgPermissions","factorVerificationAge","isAuthenticated",false,"tokenType","session_token","user","preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","notificationCount",0,"flagDenols","ENV",{"_36":37,"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59,"_60":61,"_62":63},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","40d33e9c7bacd1f32863183408ee0e4ae3e5f5a3","RENDER_GIT_BRANCH","main","CLERK_PUBLISHABLE_KEY","pk_live_Y2xlcmsudmFsLnRvd24k","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","API_URL","https://api.val.town","clerkState",{"_66":67},"__internal_clerk_state",{"_68":69,"_70":45,"_71":72,"_73":72,"_74":20,"_75":72,"_76":72,"_77":72,"_78":72,"_79":80,"_89":20,"_90":20},"__clerk_ssr_state",{"_21":22,"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5,"_18":-5,"_19":20},"__publishableKey","__proxyUrl","","__domain","__isSatellite","__signInUrl","__signUpUrl","__afterSignInUrl","__afterSignUpUrl","__clerk_debug",{"_81":20,"_19":20,"_82":72,"_83":84,"_85":72,"_86":45,"_87":20,"_88":72},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","routes/embed.x.$handle.$name.$",{"_93":94,"_95":96,"_97":98,"_99":100,"_147":148,"_167":168,"_169":-5},"handle","peterqliu","name","staticServer","path","index.ts","project",{"_101":102,"_95":96,"_103":104,"_105":-5,"_106":20,"_107":108,"_109":110,"_111":-5,"_12":112,"_113":-5,"_114":20,"_115":-5,"_116":32,"_14":117,"_118":119,"_120":119,"_121":122,"_123":122,"_124":122,"_125":119,"_126":119,"_23":127,"_130":131,"_133":134,"_146":20},"id","148cc97c-b0e9-11f0-9992-0224a6c84d84","createdAt",["D",1761317556708],"deletedAt","legacyEnvVars","privacy","public","description","write html/css/js like a local project","imageUrl","f129b0f0-09bd-41ac-a51c-c16933d81d65","pinnedFileId","pinPreview","screenshotVersion","likeCount","5cdb635f-04df-409e-bb23-93b87a60f6ca","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm",{"_93":94,"_128":129},"profileImageUrl","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJrYUVVM1VyRHRhckNnNGxidGEwUUdaSFRDYSJ9","org",{"_93":94,"_132":129},"avatar","branch",{"_135":136,"_95":43,"_101":137,"_138":102,"_139":-5,"_140":-5,"_141":-5,"_142":-5,"_143":-5,"_144":96,"_145":94},"version",67,"148d2ee4-b0e9-11f0-9992-0224a6c84d84","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","isOwned","file",{"_101":149,"_95":98,"_150":151,"_152":-5,"_153":137,"_154":155,"_156":157,"_103":158,"_135":159,"_160":161,"_162":163,"_164":20,"_165":-5,"_97":166},"363ebf3e-b0ef-11f0-be1f-0224a6c84d84","fileId","c1a51606-b0ed-11f0-b0dc-0224a6c84d84","parentId","branchId","branchVersion",49,"latest",true,["D",1761320190206],8,"fileType","script","content","import { readFile } from \"https://esm.town/v/std/utils/index.ts\";\n\nexport interface StaticServerOptions {\n /** Default HTML file to serve at root. Defaults to '/index.html' */\n indexFile?: string;\n /** Custom 404 handler. If not provided, returns default 404 message */\n notFoundHandler?: (pathname: string) => Response;\n /** Custom error handler. If not provided, returns default error message */\n errorHandler?: (error: Error, pathname: string) => Response;\n /** Additional MIME types mapping. Extends default types */\n mimeTypes?: Record;\n /** Custom headers to add to all responses */\n headers?: Record;\n}\n\nexport interface FileServerResult {\n /** The request handler function to use as your HTTP val export */\n handler: (req: Request) => Promise;\n /** Utility to serve files programmatically */\n serveFile: (pathname: string, options?: { mimeType?: string }) => Promise;\n}\n\n/**\n * Creates a static file server that can serve HTML, JS, CSS, and other text files\n * from your Val Town project directory.\n * \n * @param options Configuration options for the server\n * @returns Object containing the request handler and utility functions\n * \n * @example\n * ```ts\n * import { createStaticServer } from \"./index.ts\";\n * \n * const { handler } = createStaticServer({\n * indexFile: '/index.html',\n * headers: { 'Cache-Control': 'no-cache' },\n * importMetaUrl: import.meta.url\n * });\n * \n * export default handler;\n * ```\n */\nexport function createStaticServer(options: StaticServerOptions = {}): FileServerResult {\n const {\n indexFile = '/index.html',\n notFoundHandler,\n errorHandler,\n mimeTypes = {},\n headers = {}\n } = options;\n\n // Default MIME types\n const defaultMimeTypes: Record = {\n '.html': 'text/html; charset=utf-8',\n '.js': 'application/javascript; charset=utf-8',\n '.css': 'text/css; charset=utf-8',\n '.json': 'application/json; charset=utf-8',\n '.txt': 'text/plain; charset=utf-8',\n '.md': 'text/markdown; charset=utf-8',\n '.xml': 'application/xml; charset=utf-8',\n '.svg': 'image/svg+xml; charset=utf-8',\n ...mimeTypes\n };\n\n /**\n * Get MIME type for a file based on its extension\n */\n function getMimeType(pathname: string): string {\n const ext = pathname.toLowerCase().substring(pathname.lastIndexOf('.'));\n return defaultMimeTypes[ext] || 'text/plain; charset=utf-8';\n }\n\n /**\n * Create response headers\n */\n function createHeaders(mimeType: string): Record {\n return {\n 'Content-Type': mimeType,\n ...headers\n };\n }\n\n /**\n * Default 404 handler\n */\n function defaultNotFoundHandler(pathname: string): Response {\n const fileType = pathname.substring(pathname.lastIndexOf('.') + 1);\n const message = fileType ? \n `${fileType.toUpperCase()} file not found: ${pathname}` : \n `File not found: ${pathname}`;\n \n return new Response(message, {\n status: 404,\n headers: createHeaders('text/plain; charset=utf-8')\n });\n }\n\n /**\n * Default error handler\n */\n function defaultErrorHandler(error: Error, pathname: string): Response {\n console.error(`Error serving ${pathname}:`, error);\n return new Response(`Server error: ${error.message}`, {\n status: 500,\n headers: createHeaders('text/plain; charset=utf-8')\n });\n }\n\n /**\n * Serve a file from the project directory\n */\n async function serveFile(pathname: string, options: { mimeType?: string } = {}): Promise {\n try {\n const content = await readFile(pathname, import.meta.url);\n const mimeType = options.mimeType || getMimeType(pathname);\n \n return new Response(content, {\n headers: createHeaders(mimeType)\n });\n } catch (error) {\n if (error instanceof Error && error.message.includes('not found')) {\n return (notFoundHandler || defaultNotFoundHandler)(pathname);\n }\n return (errorHandler || defaultErrorHandler)(error as Error, pathname);\n }\n }\n\n /**\n * Main request handler\n */\n async function handler(req: Request): Promise {\n try {\n const url = new URL(req.url);\n let pathname = url.pathname;\n\n // Handle root path\n if (pathname === '/') {\n pathname = indexFile;\n }\n\n // Serve the requested file\n return await serveFile(pathname);\n \n } catch (error) {\n return (errorHandler || defaultErrorHandler)(error as Error, 'unknown');\n }\n }\n\n return {\n handler,\n serveFile\n };\n}\n\n/**\n * Quick setup function for basic static serving\n * \n * @example\n * ```ts\n * import { quickStaticServer } from \"./index.ts\";\n * export default quickStaticServer();\n * ```\n */\nexport function quickStaticServer(indexFile = '/index.html'): (req: Request) => Promise {\n const { handler } = createStaticServer({ indexFile });\n return handler;\n}\n\n/**\n * Advanced setup with custom routing and middleware support\n * \n * @example\n * ```ts\n * import { advancedStaticServer } from \"./index.ts\";\n * \n * export default advancedStaticServer({\n * routes: {\n * '/api/health': () => new Response('OK'),\n * '/api/time': () => new Response(new Date().toISOString())\n * },\n * middleware: [\n * (req, next) => {\n * console.log(`${req.method} ${req.url}`);\n * return next();\n * }\n * ]\n * });\n * ```\n */\nexport function advancedStaticServer(config: {\n routes?: Record Response | Promise>;\n middleware?: Array<(req: Request, next: () => Promise) => Promise>;\n staticOptions?: StaticServerOptions;\n} = {}): (req: Request) => Promise {\n const { routes = {}, middleware = [], staticOptions = {} } = config;\n const { handler: staticHandler } = createStaticServer(staticOptions);\n\n return async function(req: Request): Promise {\n const url = new URL(req.url);\n \n // Apply middleware\n let finalHandler = async (): Promise => {\n // Check custom routes first\n if (routes[url.pathname]) {\n return await routes[url.pathname](req);\n }\n \n // Fall back to static file serving\n return await staticHandler(req);\n };\n\n // Apply middleware in reverse order\n for (let i = middleware.length - 1; i >= 0; i--) {\n const currentHandler = finalHandler;\n const currentMiddleware = middleware[i];\n finalHandler = () => currentMiddleware(req, currentHandler);\n }\n\n return await finalHandler();\n };\n}","deleted","label",[98],"permalink","https://www.val.town/x/peterqliu/staticServer/code/index.ts","extension","actionData","errors"]