cloudflarehackers/tg-webapp-proxy

Purpose and Entry Points

This is a browser-only Telegram MTProto client for bot-based file retrieval/messaging and authenticated user accounts. Vite serves and bundles the SPA from index.html, which loads src/main.js. Cloudflare Pages deployment is configured by wrangler.toml; an optional same-origin proxy endpoint is implemented at functions/api/[[path]].js.

Application Composition

src/main.js is the top-level mode router and bot-mode UI/controller. It initializes shared browser support, binds UI events, manages bot state, and delegates Telegram operations. User-mode rendering and interactions are separated into src/user-mode.js, while protocol-facing implementations are in src/telegram-client.js and src/user-client.js.

Bot Client Flow

src/telegram-client.js defines the bot-oriented Telegram client: bot-token authentication, message reception/replies, Telegram-link retrieval, and file download orchestration. Parsed links from src/link-parser.js identify target messages/media. Large files are partitioned into ranges, downloaded by multiple Telegram DC connections with retries/migration handling, then assembled; small files use the standard media path.

User Account Flow

src/user-client.js owns phone login, 2FA continuation, account/session isolation, dialogs, message history, real-time updates, sending, and user-media downloads. src/user-mode.js presents account switching, chat browsing/filtering, infinite message loading, reply state, media views, and the sequential download queue. The UI calls client operations rather than directly invoking MTProto.

Protocol and Browser Adaptation

Teleproto runs entirely in the browser but expects Node-style facilities. src/polyfills.js establishes global compatibility before client loading. src/shims/browser-session.js persists teleproto session/auth/DC/entity state through localStorage, and src/shims/promised-web-sockets.js replaces socket transport while mapping Telegram DCs to WebSocket hostnames. Crypto and compressed MTProto payload support are provided by src/shims/crypto.js and src/shims/zlib.js; Vite aliases/bundles these boundaries in vite.config.js.

Connectivity and Proxy Boundary

By default, MTProto WebSockets connect from the browser to Telegram DC WebSocket hosts. src/proxy-hook.js globally intercepts WebSocket construction and rewrites Telegram URLs when proxy settings are enabled, without coupling teleproto to proxy logic. The optional Cloudflare Pages fallback at functions/api/[[path]].js validates allowed Telegram targets and proxies HTTP/WebSocket traffic; external Cloudflare Worker/Durable Object infrastructure may alternatively relay encrypted frames.

Persistence and Settings

src/settings.js owns mode-specific preferences plus shared proxy configuration in localStorage. src/db.js is the IndexedDB boundary for bot conversation history and file metadata, allowing retained messages/files to be reconstructed after refresh. Sessions, credentials, account metadata, and UI settings remain local to the browser; IndexedDB is not the primary user-session store.

Material Runtimes and Services

The runtime is a Vite-built ES2020 browser SPA using teleproto/MTProto, Web Crypto plus custom AES support, native WebSocket, localStorage, and IndexedDB. It communicates directly with Telegram servers or optionally through Cloudflare Pages/Workers proxy infrastructure. package.json defines the browser dependency/build surface, and vite.config.js controls browser-targeted module replacement and chunking.