【免费下载链接】galaxy-downloaderBilibili、抖音、小红书等平台下载视频和音频。项目地址https://gitcode.com/gh_mirrors/ga/galaxy-downloader点击查看免费下载galaxy-downloader 是一款支持 Bilibili、抖音、小红书、TikTok 等平台视频与音频下载的通用媒体下载工具。本文带你完整解析它的技术架构基于 Next.js 16 App Router 与 React 19 构建前端用 Vite 8 生态的 vinext 完成构建最终一键部署到 Cloudflare Workers——没有传统 Node 服务器纯边缘运行的现代全栈方案。一、技术栈总览一张表看懂选型项目所有版本信息集中在 package.json 中核心依赖如下层次技术选型作用前端框架Next.js 16App Router 兼容层页面路由、SSR、Metadata SEOUI 库React 19 shadcn/ui Radix UI组件化界面构建工具Vite 8 vinext cloudflare/vite-plugin开发/构建/部署一体化边缘运行时Cloudflare WorkersWrangler 4静态资源 边缘函数托管国际化next-intl6 种语言切换与路由媒体处理FFmpeg.wasm、hls.js、JSZip浏览器端音频提取、HLS 下载、打包样式Tailwind CSS 4原子化样式测试Vitest单元测试值得注意的亮点next.config.ts 中开启了cacheComponents与reactCompiler并针对lucide-react、Radix UI 等组件库启用了optimizePackageImports自动按需导入进一步压缩产物体积。二、目录结构代码是怎么组织的仓库采用清晰的 App Router 分层结构src/app/Next.js 路由层[locale]动态段承载全部多语言页面api/proxy-image提供图片代理src/components/UI 组件按downloader/、audio-tool/、layout/、ui/分组src/lib/核心逻辑含平台识别、统一解析请求、HLS 下载、FFmpeg 封装src/i18n/next-intl 路由与字典配置worker/index.tsCloudflare Worker 入口scripts/部署重试、图标与 OG 图生成脚本tests/Vitest 单元测试三、前端层Next.js 16 React 19 的页面架构首页入口 src/app/[locale]/page.tsx 是一个典型的 RSC 页面服务端读取对应语言的字典再组合UnifiedDownloaderClient核心下载器与统计卡片、平台指南等侧栏组件。国际化路由是架构中的一环。src/proxy.ts 作为 Next.js 中间件对没有语言前缀的请求解析Accept-Language与 Cookie用 308 永久重定向到对应语言路径并写入 Cookie 记住偏好对爬虫不写入配合 src/i18n/routing.ts 与 src/lib/i18n/config.ts 定义的 6 种语言zh、zh-tw、en、ja、es、ru。SEO 细节做得相当扎实布局文件 src/app/[locale]/layout.tsx 中generateMetadata按语言生成 title、Open Graph 与 hreflang 备选链接generateStaticParams让各语言页面全部静态化并输出 src/app/sitemap.ts 与 src/app/robots.ts。四、构建层Vite 8 vinext 如何替代 Webpack这是本项目最有意思的部分。它没有用 Next.js 自带的 webpack 构建而是通过vinextCloudflare 官方 Next.js on Vite 方案cloudflare/vite-plugin完成构建配置全部在 vite.config.tsvinext()插件接管 App Router 的编译流程viteEnvironment将rsc环境设为主环境、ssr作为子环境cloudflare()插件让构建产物直接适配 Workers 运行时nodejs_compat兼容模式生产构建时额外挂载SerwistWorkbox 生态插件自动从 src/sw.ts 生成 Service Worker预缓存 JS/CSS 与图标并把 FFmpeg WASM 文件按CacheFirst 一年过期策略缓存实现 PWA 离线可用。开发体验同样受益于 Vitepnpm dev一条命令先同步 FFmpeg core 资源再启动开发服务器端口 3010无需额外配置。五、部署层Cloudflare Workers 边缘托管wrangler.jsonc 定义了部署形态main指向 worker/index.ts静态产物来自dist/client通过ASSETS绑定由 Worker 直接返回IMAGES绑定接入 Cloudflare ImagesWorker 入口中拦截/_vinext/image路径用边缘图像管线完成 Next.js 图片优化——图片压缩发生在边缘节点而非自建服务器开启 observability 日志与 traces便于排查边缘请求。部署流程由 scripts/deploy-with-retry.mjs 包装调用vinext deploy并只对 Cloudflare API 的971 限流错误做指数退避重试60/120/180 秒其他错误立即失败避免掩盖真实配置问题。pnpm deploy一条命令即可完成同步 FFmpeg 资源 → 构建 → 重试部署全流程。六、浏览器端媒体处理下载工具的核心能力解析请求在 src/lib/config.ts 中统一配置——前端直接请求公开 API/api/parse、/api/download、/api/play注释中说明了原因让 Cloudflare 按最终用户 IP 限流而不是被同一出口 IP 聚合。src/lib/unified-parse.ts 封装了解析流程并带错误分类。更关键的是重活几乎都在浏览器本地完成音频提取src/lib/ffmpeg.ts 封装 FFmpeg.wasm优先加载本仓库内置的/ffmpeg-core分片资源失败时回退到 CDN提取 MP3 无需服务器算力HLS 下载src/lib/hls-browser-download.ts 用hls-parser解析 m3u8 播放列表逐段下载并合并还处理了 byterange 与加密流边界情况图文打包JSZip 在前端把多图压缩成 ZIP 供下载。这意味着 Worker 端几乎没有计算压力媒体文件的重量级工作全部卸载给了浏览器与 CDN。七、本地运行与部署指南克隆仓库后仓库地址https://gitcode.com/gh_mirrors/ga/galaxy-downloaderpnpm install # 安装依赖 pnpm dev # 启动开发服务器localhost:3010 pnpm build # 生产构建 pnpm deploy # 构建并发布到 Cloudflare Workers常用环境变量NEXT_PUBLIC_API_BASE_URL解析 API 地址、NEXT_PUBLIC_SITE_URL站点基址、SEO_INDEXABLE是否允许搜索引擎索引。八、总结galaxy-downloader 的架构可以概括为一句话Next.js 16 写页面Vite 8 做构建Workers 跑运行时浏览器干重活。它展示了 2026 年前后无服务器全栈应用的成熟形态——边缘部署、静态优先、WASM 本地计算对于想学习现代前端工程化与边缘计算的开发者来说这是一个非常值得参考的完整样本。赞分享【免费下载链接】galaxy-downloaderBilibili、抖音、小红书等平台下载视频和音频。项目地址https://gitcode.com/gh_mirrors/ga/galaxy-downloader点击查看免费下载相关推荐拆解FreeDomains技术栈Next.js 16 React 19 Tailwind CSS 4前端架构深度解析拆解FreeDomains技术栈Next.js 16 React 19 Tailwind CSS 4前端架构深度解析 FreeDomainsisroGitHub Profile Analyzer全栈架构揭秘Next.js 16Neon PostgreSQLUpstash RedisCloudflare WorkersGitHub Profile Analyzer全栈架构揭秘Next.js 16Neon PostgreSQLUpstash RedisCloudflar拆解nodepad技术栈Next.js 16 React 19 D3 Framer Motion如何构建空间思考工具拆解nodepad技术栈Next.js 16 React 19 D3 Framer Motion如何构建空间思考工具 nodepad 是一款AI创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考