Remove secret, improve docs

Author: Meldiron

.env.example

@@ -13,7 +13,7 @@ FROM base AS build
 COPY . .
 
 FROM base
-RUN pnpm playwright install --with-deps chromium
 COPY --from=prod-deps /app/node_modules /app/node_modules
+RUN pnpm playwright install --with-deps chromium
 COPY --from=build /app/src/index.js /app/src/index.js
 CMD ["pnpm", "start"]

Dockerfile

@@ -1,36 +1,31 @@
-# Browser 🖥️
+# Docker Browser 🖥️
 
 [![Discord](https://img.shields.io/discord/564160730845151244?label=discord&style=flat-square)](https://appwrite.io/discord)
 [![Twitter Account](https://img.shields.io/twitter/follow/appwrite?color=00acee&label=twitter&style=flat-square)](https://twitter.com/appwrite)
 [![appwrite.io](https://img.shields.io/badge/appwrite-.io-f02e65?style=flat-square)](https://appwrite.io)
 
-Appwrite Browser is simple to use and extend REST API meant to simplify screenshot preview, reports, and analysis.
+Docker Browser is simple to use and extend REST API meant to simplify screenshot preview, reports, and analysis.
 
 ## Usage
 
-Add Appwrite Browser to your `docker-compose.yml`.
+Add Docker Browser to your `docker-compose.yml`.
 
 ```
 services:
   appwrite-browser:
-    container_name: appwrite-browser
     image: appwrite/browser:0.1.0
-    networks:
-      - appwrite
-    environment:
-      - APPWRITE_BROWSER_SECRET=secret
 ```
 
-Start browser alongside rest of your services.
+Start Docker Browser alongside rest of your services.
 
 ```
 docker compose up -d
 ```
 
-Communicate with Appwrite Browser endpoints.
+Communicate with Docker Browser endpoints.
 
 ```bash
-curl -X GET -H "Authorization: Bearer secret" http://appwrite-browser:3000/screenshot?url=http://google.com/ping
+curl -X POST -H 'content-type: application/json' -d '{"url":"http://google.com/ping"}'  http://appwrite-browser:3000/v1/screenshots
 ```
 
 ## Development
@@ -43,13 +38,7 @@ To install dependencies, run the following command.
 pnpm i
 ```
 
-Next, duplicate `.env.example` into `.env`, and update the values.
-
-```bash
-cp .env.example .env
-```
-
-Finally, start the server by running `npm start`, and visit use endpoint `http://localhost:3000` as REST API endpoint. To authorize, provide header `Authorization: Bearer <secret>`.
+Next, start the server by running `npm start`, and visit use endpoint `http://localhost:3000` as REST API endpoint.
 
 ## Contributing
 

README.md

@@ -1,48 +1,20 @@
 import { createServer } from "node:http";
-import { createError } from "h3";
 import {
 	createApp,
 	createRouter,
 	defineEventHandler,
-	getValidatedQuery,
 	toNodeListener,
 } from "h3";
+import { readValidatedBody } from "h3";
 import lighthouseDesktopConfig from "lighthouse/core/config/lr-desktop-config.js";
 import lighthouseMobileConfig from "lighthouse/core/config/lr-mobile-config.js";
 import { chromium } from "playwright";
 import { playAudit } from "playwright-lighthouse";
 import { z } from "zod";
 
 const port = process.env.PORT || 3000;
-const signature = process.env.APPWRITE_BROWSER_SECRET;
-if (!signature) {
-	throw new Error("APPWRITE_BROWSER_SECRET environment variable is required");
-}
 
-const app = createApp({
-	onRequest: (event) => {
-		const auth = event.headerssss.get("Authorization");
-		if (auth === null)
-			throw createError({
-				status: 400,
-				statusMessage: "Unauthorized",
-				message: "Missing signature",
-			});
-		const [type, token] = auth.split(" ");
-		if (token === null)
-			throw createError({
-				status: 400,
-				statusMessage: "Unauthorized",
-				message: "Missing signature",
-			});
-		if (type !== "Bearer" || token !== signature)
-			throw createError({
-				status: 401,
-				statusMessage: "Unauthorized",
-				message: "Invalid signature",
-			});
-	},
-});
+const app = createApp();
 const router = createRouter();
 
 console.log("Chromium starting...");
@@ -61,55 +33,55 @@ const defaultContext = {
 	},
 };
 
-const screenshotParams = z.object({
-	url: z.string().startsWith("/"),
+const screenshotSchema = z.object({
+	url: z.string().url(),
 	color: z.enum(["light", "dark"]).default("light"),
-	headers: z.string().optional(), // JSON object
+	headers: z.record(z.string(), z.any()),
 });
-router.get(
-	"/screenshot",
+router.post(
+	"/v1/screenshots",
 	defineEventHandler(async (event) => {
-		const query = await getValidatedQuery(event, screenshotParams.parse);
+		const body = await readValidatedBody(event, screenshotSchema.parse);
 		const context = await browser.newContext({
 			...defaultContext,
-			colorScheme: query.color,
-			extraHTTPHeaders: JSON.parse(query.headers ?? "{}"),
+			colorScheme: body.color,
+			extraHTTPHeaders: body.headers,
 		});
 		const page = await context.newPage();
-		await page.goto(query.url);
+		await page.goto(body.url);
 		const screen = await page.screenshot();
 		await context.close();
 		return screen;
 	}),
 );
 
-const lighthouseParams = z.object({
+const lighthouseSchema = z.object({
 	url: z.string().url(),
 	viewport: z.enum(["mobile", "desktop"]).default("mobile"),
-	html: z.string().default("false"),
-	json: z.string().default("false"),
-	csv: z.string().default("false"),
+	json: z.boolean().default(true),
+	html: z.boolean().default(false),
+	csv: z.boolean().default(false),
 });
 const configs = {
 	mobile: lighthouseMobileConfig,
 	desktop: lighthouseDesktopConfig,
 };
-router.get(
-	"/lighthouse",
+router.post(
+	"/v1/reports",
 	defineEventHandler(async (event) => {
-		const query = await getValidatedQuery(event, lighthouseParams.parse);
+		const body = await readValidatedBody(event, lighthouseSchema.parse);
 		const context = await browser.newContext(defaultContext);
 		const page = await context.newPage();
-		await page.goto(query.url);
+		await page.goto(body.url);
 		const results = await playAudit({
 			reports: {
 				formats: {
-					html: query.html === "true",
-					json: query.json === "true",
-					csv: query.csv === "true",
+					html: body.html,
+					json: body.json,
+					csv: body.csv,
 				},
 			},
-			config: configs[query.viewport],
+			config: configs[body.viewport],
 			page: page,
 			port: 9222,
 			thresholds: {
@@ -125,8 +97,8 @@ router.get(
 	}),
 );
 
-router.use(
-	"/health",
+router.get(
+	"/v1/health",
 	defineEventHandler(async () => {
 		return {
 			status: browser.isConnected() ? "ok" : "error",