@swimmingliu/autovpn 1.4.2 → 1.5.0

package/README.md

@@ -24,6 +24,33 @@ autovpn run --project-root . --skip-deploy --skip-verify --output jsonl
 autovpn artifacts latest --project-root .
 ```
 
+## Server Web UI
+
+`autovpn serve` starts a single-user HTTP service that serves the AutoVPN Web UI
+from the same renderer used by the desktop app.
+
+```bash
+autovpn serve --project-root .
+```
+
+Defaults:
+
+- host: `127.0.0.1`
+- port: `8765`
+- auth: token-protected
+
+For server deployment, bind explicitly and provide a token:
+
+```bash
+export AUTOVPN_SERVER_TOKEN="$(openssl rand -base64 24)"
+autovpn serve --project-root /opt/autovpn --host 0.0.0.0 --port 8765 \
+  --token "$AUTOVPN_SERVER_TOKEN"
+```
+
+The server refuses non-loopback binds unless `--token` or `--no-auth` is
+provided. Prefer SSH forwarding, a private reverse proxy, or your own HTTPS
+terminator for internet-facing deployments.
+
 ## Runtime Shape
 
 The CLI is currently Node-first with explicit Python rollback:
@@ -47,6 +74,8 @@ Current Node backend notes:
 - Deploy and verify can be rolled back with `AUTOVPN_STAGE_BACKEND_DEPLOY=python` and `AUTOVPN_STAGE_BACKEND_VERIFY=python`.
 - `AUTOVPN_NO_PYTHON=1` disables implicit Python backend resolution and default Python runtime stage fallback. Use it as a v3 readiness gate. Empty offline runs now complete in Node, and Node has direct HTTP speedtest and availability runtimes. Node also has opt-in Mihomo-backed paths: set `AUTOVPN_SPEEDTEST_RUNTIME=mihomo` for controller delay probing and candidate downloads through the local Mihomo proxy, and set `AUTOVPN_AVAILABILITY_RUNTIME=mihomo` to check provider availability through the same per-node proxy runtime.
 - Project `.env` is loaded before resolving profile and artifact paths. Explicit process environment values still win over `.env`.
+- `autovpn serve` is Node-native and exposes the browser UI plus `/api/health`,
+  `/api/state`, `/api/runs`, `/api/runs/current/stop`, and `/api/events`.
 
 Fallback flags for migrated commands:
 
@@ -96,6 +125,9 @@ For Python-backed commands, the wrapper forwards argv, stdin, stdout, stderr, an
 - `AUTOVPN_DOCTOR_BACKEND`
 - `AUTOVPN_PROFILE_BACKEND`
 - `AUTOVPN_ARTIFACTS_BACKEND`
+- `AUTOVPN_SERVER_HOST`
+- `AUTOVPN_SERVER_PORT`
+- `AUTOVPN_SERVER_TOKEN`
 - `VPN_AUTOMATION_RUNTIME_ROOT`
 - `VPN_AUTOMATION_PROFILE_PATH`
 - `VPN_AUTOMATION_ARTIFACTS_ROOT`

package/dist/cli/commands/index.js

@@ -10,7 +10,8 @@ const TOP_LEVEL_COMMANDS = new Set([
     'jobs',
     'status',
     'logs',
-    'stop'
+    'stop',
+    'serve'
 ]);
 const JOBS_SUBCOMMANDS = new Set(['list', 'status', 'logs', 'stop', 'resume', 'retry']);
 const RESUME_SUBCOMMANDS = new Set(['pipeline', 'speedtest']);
@@ -82,6 +83,9 @@ export function validateCommand(argv) {
         validateChoice('doctor', '--output', readOptionValue(argv, '--output'), ['human', 'json']);
         return;
     }
+    if (command === 'serve') {
+        return;
+    }
     if (command === 'profile') {
         const subcommand = argv[1] ?? '';
         if (!PROFILE_SUBCOMMANDS.has(subcommand)) {

package/dist/cli/main.js

@@ -9,6 +9,9 @@ import { selectBackend } from '../backend/select-backend.js';
 import { loadJob } from '../jobs/read.js';
 import { readOptionValue, resolveProjectRoot } from '../runtime/paths.js';
 import { redactText } from '../runtime/redaction.js';
+import { createAutoVpnServer } from '../server/http.js';
+import { parseServeOptions } from '../server/options.js';
+import { createServerRuntime } from '../server/runtime.js';
 async function defaultReadPackageVersion() {
     // @ts-expect-error The Phase 1 runner is plain ESM JavaScript.
     const runner = await import('../../lib/runner.mjs');
@@ -190,6 +193,33 @@ export async function runCliShell(argv, options = {}) {
         validateCommand(normalizedArgv);
         const createBackend = options.createBackend ?? defaultCreateBackend;
         const backend = createBackend({ env, cwd, runForwarder });
+        if (normalizedArgv[0] === 'serve') {
+            const serveOptions = parseServeOptions(normalizedArgv, { cwd, env });
+            const serverFactory = options.createServer ?? createAutoVpnServer;
+            const runtime = createServerRuntime({
+                projectRoot: serveOptions.projectRoot,
+                env
+            });
+            const server = await serverFactory({
+                ...serveOptions,
+                runtime,
+                version: await resolvePackageVersion(options),
+                backendKind: String(backend.kind ?? '')
+            });
+            io.writeStdout(`AutoVPN server listening on ${server.origin}\n`);
+            if (serveOptions.auth.enabled) {
+                io.writeStdout(`Open ${server.origin}/?token=${encodeURIComponent(serveOptions.auth.token)}\n`);
+            }
+            else {
+                io.writeStderr('autovpn: warning: server authentication is disabled\n');
+            }
+            if (options.serveExitAfterStart) {
+                await server.close();
+                return 0;
+            }
+            await new Promise(() => { });
+            return 0;
+        }
         let pythonFallbackBackend;
         const runExplicitPythonFallback = (fallbackArgv) => {
             pythonFallbackBackend ??= createBackend({

package/dist/cli/output.js

@@ -27,5 +27,6 @@ Commands:
   status
   logs
   stop
+  serve
 `;
 }

package/dist/server/http.js

@@ -0,0 +1,195 @@
+import http from 'node:http';
+import fs from 'node:fs/promises';
+import path from 'node:path';
+import { fileURLToPath, URL } from 'node:url';
+import { renderWebAdapterScript } from './web-adapter.js';
+import { redactText } from '../runtime/redaction.js';
+const SENSITIVE_KEYS = new Set([
+    'key',
+    'token',
+    'api_token',
+    'cloudflare_api_token',
+    'cloudflare_global_key',
+    'subscription_url',
+    'verify_subscription_url',
+    'secret_query',
+    'pages_secret_admin',
+    'share_project_sub_value'
+]);
+function redactPayload(value, parentKey = '') {
+    if (typeof value === 'string') {
+        if (SENSITIVE_KEYS.has(parentKey.toLowerCase())) {
+            return value ? '<redacted>' : '';
+        }
+        return redactText(value);
+    }
+    if (value === null || ['number', 'boolean'].includes(typeof value)) {
+        return value;
+    }
+    if (Array.isArray(value)) {
+        return value.map((item) => redactPayload(item, parentKey));
+    }
+    if (typeof value === 'object') {
+        return Object.fromEntries(Object.entries(value).map(([key, item]) => [key, redactPayload(item, key)]));
+    }
+    return null;
+}
+function writeJson(response, statusCode, payload) {
+    response.writeHead(statusCode, { 'Content-Type': 'application/json; charset=utf-8' });
+    response.end(JSON.stringify(redactPayload(payload)));
+}
+function contentType(filePath) {
+    if (filePath.endsWith('.html'))
+        return 'text/html; charset=utf-8';
+    if (filePath.endsWith('.js'))
+        return 'text/javascript; charset=utf-8';
+    if (filePath.endsWith('.css'))
+        return 'text/css; charset=utf-8';
+    if (filePath.endsWith('.svg'))
+        return 'image/svg+xml';
+    if (filePath.endsWith('.png'))
+        return 'image/png';
+    return 'application/octet-stream';
+}
+function rendererRoot() {
+    return path.resolve(fileURLToPath(new URL('../web/renderer', import.meta.url)));
+}
+async function writeStaticFile(response, statusCode, filePath, body) {
+    response.writeHead(statusCode, { 'Content-Type': contentType(filePath) });
+    response.end(body ?? await fs.readFile(filePath));
+}
+async function serveRendererIndex(response) {
+    const indexPath = path.join(rendererRoot(), 'index.html');
+    const html = await fs.readFile(indexPath, 'utf8');
+    const injected = html.replace('<script type="module" src="./app.js"></script>', '<script src="/web-adapter.js"></script>\n    <script type="module" src="./app.js"></script>');
+    await writeStaticFile(response, 200, indexPath, injected);
+}
+async function serveRendererAsset(url, response) {
+    if (url.pathname === '/') {
+        await serveRendererIndex(response);
+        return true;
+    }
+    if (url.pathname === '/web-adapter.js') {
+        await writeStaticFile(response, 200, 'web-adapter.js', renderWebAdapterScript());
+        return true;
+    }
+    const decodedPath = decodeURIComponent(url.pathname.replace(/^\/+/, ''));
+    if (!decodedPath || decodedPath.includes('..') || path.isAbsolute(decodedPath)) {
+        return false;
+    }
+    const filePath = path.join(rendererRoot(), decodedPath);
+    const relative = path.relative(rendererRoot(), filePath);
+    if (relative.startsWith('..') || path.isAbsolute(relative)) {
+        return false;
+    }
+    try {
+        await writeStaticFile(response, 200, filePath);
+        return true;
+    }
+    catch {
+        return false;
+    }
+}
+function isAuthorized(request, url, auth) {
+    if (!auth.enabled) {
+        return true;
+    }
+    const authorization = request.headers.authorization ?? '';
+    if (authorization === `Bearer ${auth.token}`) {
+        return true;
+    }
+    return url.searchParams.get('token') === auth.token;
+}
+async function readJsonBody(request) {
+    const chunks = [];
+    let size = 0;
+    for await (const chunk of request) {
+        const buffer = Buffer.isBuffer(chunk) ? chunk : Buffer.from(String(chunk));
+        size += buffer.length;
+        if (size > 1024 * 1024) {
+            throw new Error('request_body_too_large');
+        }
+        chunks.push(buffer);
+    }
+    const text = Buffer.concat(chunks).toString('utf8').trim();
+    if (!text) {
+        return {};
+    }
+    const parsed = JSON.parse(text);
+    return typeof parsed === 'object' && parsed !== null && !Array.isArray(parsed) ? parsed : {};
+}
+export async function createAutoVpnServer(options) {
+    const server = http.createServer(async (request, response) => {
+        const url = new URL(request.url ?? '/', `http://${request.headers.host ?? `${options.host}:${options.port}`}`);
+        if (url.pathname.startsWith('/api/') && !isAuthorized(request, url, options.auth)) {
+            writeJson(response, 401, { ok: false, error: 'unauthorized' });
+            return;
+        }
+        try {
+            if (request.method === 'GET' && url.pathname === '/api/health') {
+                writeJson(response, 200, {
+                    status: 'ok',
+                    version: options.version ?? '',
+                    backend: options.backendKind ?? '',
+                    projectRoot: options.projectRoot
+                });
+                return;
+            }
+            if (request.method === 'GET' && url.pathname === '/api/state') {
+                writeJson(response, 200, await options.runtime.loadState());
+                return;
+            }
+            if (request.method === 'GET' && url.pathname === '/api/events') {
+                response.writeHead(200, {
+                    'Content-Type': 'text/event-stream; charset=utf-8',
+                    'Cache-Control': 'no-cache, no-transform',
+                    Connection: 'keep-alive'
+                });
+                response.flushHeaders();
+                const unsubscribe = options.runtime.subscribe?.((event) => {
+                    response.write(`data: ${JSON.stringify(redactPayload(event))}\n\n`);
+                }) ?? (() => { });
+                request.on('close', unsubscribe);
+                return;
+            }
+            if (request.method === 'POST' && url.pathname === '/api/runs') {
+                const body = await readJsonBody(request);
+                writeJson(response, 202, await options.runtime.startRun?.({
+                    skipDeploy: Boolean(body.skipDeploy),
+                    skipVerify: Boolean(body.skipVerify),
+                    resumeLatest: Boolean(body.resumeLatest)
+                }) ?? { ok: false, error: 'run_unavailable' });
+                return;
+            }
+            if (request.method === 'POST' && url.pathname === '/api/runs/current/stop') {
+                writeJson(response, 200, await options.runtime.stopRun?.() ?? { ok: true, requested: false });
+                return;
+            }
+            if (request.method === 'GET' && !url.pathname.startsWith('/api/')) {
+                if (await serveRendererAsset(url, response)) {
+                    return;
+                }
+            }
+            writeJson(response, 404, { ok: false, error: 'not_found' });
+        }
+        catch (error) {
+            writeJson(response, 500, { ok: false, error: error instanceof Error ? error.message : String(error) });
+        }
+    });
+    await new Promise((resolve) => server.listen(options.port, options.host, resolve));
+    const address = server.address();
+    const port = typeof address === 'object' && address ? address.port : options.port;
+    const originHost = options.host === '0.0.0.0' ? '127.0.0.1' : options.host;
+    return {
+        origin: `http://${originHost}:${port}`,
+        close: () => new Promise((resolve, reject) => {
+            server.close((error) => {
+                if (error) {
+                    reject(error);
+                    return;
+                }
+                resolve();
+            });
+        })
+    };
+}

package/dist/server/options.js

@@ -0,0 +1,34 @@
+import crypto from 'node:crypto';
+import path from 'node:path';
+import { CliUsageError } from '../cli/errors.js';
+import { readOptionValue, resolveProjectRoot } from '../runtime/paths.js';
+function hasFlag(argv, flag) {
+    return argv.includes(flag);
+}
+function isLoopbackHost(host) {
+    return host === '127.0.0.1' || host === 'localhost' || host === '::1';
+}
+function defaultRandomToken() {
+    return crypto.randomBytes(18).toString('base64url');
+}
+export function parseServeOptions(argv, context) {
+    const host = readOptionValue(argv, '--host') ?? context.env.AUTOVPN_SERVER_HOST ?? '127.0.0.1';
+    const portText = readOptionValue(argv, '--port') ?? context.env.AUTOVPN_SERVER_PORT ?? '8765';
+    const port = Number(portText);
+    if (!Number.isInteger(port) || port < 1 || port > 65535) {
+        throw new CliUsageError('serve --port must be an integer from 1 to 65535');
+    }
+    const token = readOptionValue(argv, '--token') ?? context.env.AUTOVPN_SERVER_TOKEN ?? '';
+    const noAuth = hasFlag(argv, '--no-auth');
+    if (!isLoopbackHost(host) && !token && !noAuth) {
+        throw new CliUsageError('serve requires --token or --no-auth when binding to non-loopback host');
+    }
+    return {
+        host,
+        port,
+        projectRoot: path.resolve(resolveProjectRoot(argv, context.cwd)),
+        auth: noAuth
+            ? { enabled: false, token: '' }
+            : { enabled: true, token: token || (context.randomToken ?? defaultRandomToken)() }
+    };
+}

package/dist/server/runtime.js

@@ -0,0 +1,151 @@
+import { artifactLatest, artifactList } from '../artifacts/list.js';
+import { previewArtifact } from '../artifacts/preview.js';
+import { profilePayload } from '../config/profile.js';
+import { startDetachedRun as defaultStartDetachedRun, stopManagedJob as defaultStopManagedJob } from '../jobs/commands.js';
+import { followLog as defaultFollowLog } from '../jobs/logs.js';
+const DEPLOY_SECRET_KEYS = new Set([
+    'cloudflare_api_token',
+    'cloudflare_global_key',
+    'pages_secret_admin',
+    'subscription_url',
+    'verify_subscription_url',
+    'secret_query',
+    'share_project_sub_value'
+]);
+function redactIfSet(value) {
+    return String(value ?? '').trim() ? '<redacted>' : '';
+}
+export function sanitizeProfileForServer(profile) {
+    const safe = structuredClone(profile ?? {});
+    for (const source of Object.values((safe.sources ?? {}))) {
+        if (source && typeof source === 'object') {
+            source.url = redactIfSet(source.url);
+            source.key = redactIfSet(source.key);
+        }
+    }
+    for (const [key, value] of Object.entries((safe.deploy ?? {}))) {
+        if (DEPLOY_SECRET_KEYS.has(key)) {
+            safe.deploy[key] = redactIfSet(value);
+        }
+    }
+    return safe;
+}
+function normalizeLatestArtifact(projectRoot, env) {
+    const latest = artifactLatest(projectRoot, env);
+    if (!latest.ok || !latest.artifact_dir) {
+        return undefined;
+    }
+    const preview = previewArtifact(String(latest.artifact_dir));
+    return {
+        ...latest,
+        ...preview,
+        outputFiles: (preview.files ?? []),
+        nodeRows: []
+    };
+}
+function parseJsonLine(line) {
+    const trimmed = line.trim();
+    if (!trimmed) {
+        return undefined;
+    }
+    try {
+        return JSON.parse(trimmed);
+    }
+    catch {
+        return { type: 'log', message: trimmed };
+    }
+}
+export function createServerRuntime(options) {
+    let runState = 'idle';
+    let activeJobId = '';
+    let unsubscribeLogs;
+    const subscribers = new Set();
+    const startDetachedRun = options.startDetachedRun ?? defaultStartDetachedRun;
+    const stopManagedJob = options.stopManagedJob ?? defaultStopManagedJob;
+    const followLog = options.followLog ?? defaultFollowLog;
+    function publish(event) {
+        for (const subscriber of subscribers) {
+            subscriber(event);
+        }
+    }
+    function followJob(jobId) {
+        let cancelled = false;
+        unsubscribeLogs?.();
+        unsubscribeLogs = () => {
+            cancelled = true;
+        };
+        queueMicrotask(async () => {
+            try {
+                for await (const chunk of followLog(options.projectRoot, jobId, ['logs', '--format', 'jsonl', '--follow'], { env: options.env })) {
+                    if (cancelled) {
+                        return;
+                    }
+                    for (const line of String(chunk).split(/\r?\n/)) {
+                        const event = parseJsonLine(line);
+                        if (event) {
+                            publish(event);
+                        }
+                    }
+                }
+                if (!cancelled && runState !== 'stopping') {
+                    runState = 'success';
+                    publish({ type: 'server_state', run_state: runState });
+                }
+            }
+            catch (error) {
+                if (!cancelled) {
+                    runState = 'failed';
+                    publish({ type: 'error', message: error instanceof Error ? error.message : String(error) });
+                }
+            }
+        });
+    }
+    return {
+        async loadState() {
+            const artifact = normalizeLatestArtifact(options.projectRoot, options.env ?? process.env);
+            const retries = artifactList(options.projectRoot, options.env ?? process.env);
+            return {
+                profile: sanitizeProfileForServer(profilePayload(options.projectRoot, options.env)),
+                runState,
+                artifact,
+                retryArtifacts: Array.isArray(retries.items) ? retries.items : [],
+                deployment: (artifact?.deployment ?? {})
+            };
+        },
+        async startRun(runOptions = {}) {
+            if (runState === 'running' || runState === 'stopping') {
+                return { ok: false, error: 'run_already_active' };
+            }
+            runState = 'running';
+            const job = await startDetachedRun({
+                projectRoot: options.projectRoot,
+                skipDeploy: Boolean(runOptions.skipDeploy),
+                skipVerify: Boolean(runOptions.skipVerify),
+                resumeLatest: Boolean(runOptions.resumeLatest),
+                outputFormat: 'jsonl'
+            }, {
+                env: options.env,
+                cwd: options.projectRoot
+            });
+            activeJobId = String(job.job_id ?? '');
+            followJob(activeJobId);
+            return { ok: true, runId: activeJobId, job_id: activeJobId, status: job.status ?? 'running' };
+        },
+        async stopRun() {
+            if (runState !== 'running' || !activeJobId) {
+                return { ok: true, requested: false };
+            }
+            runState = 'stopping';
+            publish({ type: 'server_state', run_state: runState });
+            const stopped = await stopManagedJob(options.projectRoot, activeJobId, { env: options.env });
+            unsubscribeLogs?.();
+            runState = 'idle';
+            publish({ type: 'server_state', run_state: 'idle' });
+            return { ok: true, requested: true, job_id: stopped.job_id ?? activeJobId, status: stopped.status ?? 'stopped' };
+        },
+        subscribe(handler) {
+            subscribers.add(handler);
+            return () => subscribers.delete(handler);
+        }
+    };
+}

package/dist/server/web-adapter.js

@@ -0,0 +1,87 @@
+export function renderWebAdapterScript() {
+    return `
+(() => {
+  const params = new URLSearchParams(window.location.search);
+  const token = params.get('token') || window.localStorage.getItem('autovpn.server.token') || '';
+  if (token) {
+    window.localStorage.setItem('autovpn.server.token', token);
+  }
+
+  function withToken(path) {
+    if (!token) return path;
+    const url = new URL(path, window.location.origin);
+    url.searchParams.set('token', token);
+    return url.pathname + url.search;
+  }
+
+  async function request(path, options = {}) {
+    const headers = { ...(options.headers || {}) };
+    if (token) headers.Authorization = 'Bearer ' + token;
+    if (options.body && !headers['Content-Type']) headers['Content-Type'] = 'application/json';
+    const response = await fetch(path, { ...options, headers });
+    const payload = await response.json().catch(() => ({}));
+    if (!response.ok) {
+      throw new Error(payload.error || 'request_failed');
+    }
+    return payload;
+  }
+
+  async function state() {
+    return request('/api/state');
+  }
+
+  window.vpnAutomation = {
+    loadProfile: async () => {
+      const payload = await state();
+      return payload.profile || {};
+    },
+    saveProfile: async () => ({ ok: false, error: 'profile_save_unavailable_in_server_mode' }),
+    runPipeline: async (options = {}) => request('/api/runs', {
+      method: 'POST',
+      body: JSON.stringify({
+        skipDeploy: Boolean(options.skipDeploy),
+        skipVerify: Boolean(options.skipVerify),
+        resumeLatest: Boolean(options.resumeLatest)
+      })
+    }),
+    stopPipeline: async () => request('/api/runs/current/stop', { method: 'POST' }),
+    openUrl: async (url) => {
+      if (url) window.open(url, '_blank', 'noopener,noreferrer');
+      return { ok: true };
+    },
+    openPath: async () => ({ ok: false, error: 'open_path_unavailable_in_browser' }),
+    generateQr: async () => ({ ok: false, dataUrl: '' }),
+    previewArtifact: async () => {
+      const payload = await state();
+      return payload.artifact ? { ok: true, ...payload.artifact } : { ok: false };
+    },
+    latestArtifact: async () => {
+      const payload = await state();
+      return payload.artifact ? { ok: true, ...payload.artifact } : { ok: false };
+    },
+    artifactList: async () => {
+      const payload = await state();
+      return { ok: true, items: payload.retryArtifacts || [] };
+    },
+    retryStage: async () => ({ ok: false, error: 'retry_stage_unavailable_in_server_mode' }),
+    copyText: async (text) => {
+      await navigator.clipboard.writeText(String(text || ''));
+      return { ok: true };
+    },
+    exportLogs: async () => ({ ok: false, error: 'export_logs_unavailable_in_browser' }),
+    onPipelineEvent: (callback) => {
+      const events = new EventSource(withToken('/api/events'));
+      events.onmessage = (event) => {
+        try {
+          callback(JSON.parse(event.data));
+        } catch {
+          callback({ type: 'log', message: event.data });
+        }
+      };
+      events.onerror = () => {};
+      return () => events.close();
+    }
+  };
+})();
+`;
+}