把 Folia 装进手机主屏幕3 分钟完成 PWA 全屏歌词播放器【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器项目地址: https://gitcode.com/GitHub_Trending/fo/folia-major你正坐在地铁里想接着听电脑上那首带歌词动画的歌可手机浏览器打开 Folia 只是一个网页地址栏、标签页一应俱全。好消息是Folia 的 Web 版本身内置了 PWA渐进式 Web 应用能力几下点击就能变成手机主屏幕上的独立图标点开就是全屏窗口听歌全程不需要应用商店的安装包。这篇文章覆盖从部署到安装的完整路径——已经有现成地址的话3 分钟装完连带部署多留点时间。动手前自检HTTPS、浏览器、部署环境部署方式想好一键托管、NAS Docker、自部署三选一目标只是拿到一个可访问的地址。地址能上 HTTPSPWA 的安装入口和离线缓存只在 HTTPS 安全上下文里可靠生效裸 HTTP 装不上。浏览器对齐安卓用 ChromeiOS 用 Safari其他浏览器的安装入口可能不显示。手机能连到部署地址音乐流还是要走网络NAS 部署的话手机和 NAS 得在同一网络里。⚠️ NAS 自部署如果没配反向代理并装上浏览器信任的证书安装应用选项可能压根不会出现自签名证书不算数。完整的反向代理配置包括必须透传的头部清单都在 deploy/docker/README.md 里。部署 Folia 并装进手机主屏幕拿到地址。走 A 路没有服务器一键托管——点项目里的 Vercel / Cloudflare 一键部署拿到带域名的地址平台自带 HTTPS想用 QQ 音乐的话照 docs/qq-music-deployment.md 填环境变量即可。走 B 路有 NAS全栈部署——把 compose.yaml 和环境变量模板放进同一目录用openssl rand -hex 32生成随机串填入SYNC_TOKEN然后执行docker compose up -d默认访问地址是http://NAS-IP:18080。deploy/docker/compose.yaml 里能看到全部六个服务网关、backend、网易云/酷狗/QQ 音乐接口和 Sync Server以及各自的默认端口。确认地址是 https。托管平台原生就是 httpsNAS 必须过一遍反向代理。⚠️ HTTP 和 HTTPS 在浏览器眼里是两个 origin切换之后旧地址下的登录态、曲库索引和设置不会自动迁移要在新地址重新登录配置。安装。手机浏览器打开地址后安卓点右上角菜单⋮→添加到主屏幕或安装应用→ 确认名称为 FoliaiOS点底部分享按钮 →添加到主屏幕。index.html 已带好 iOS 全屏元标签两端拿到的是同一套独立窗口体验。装进主屏幕之后全屏歌词与主题切换点图标以 standalone 独立窗口启动——没有地址栏、没有标签页观感接近原生应用。vite.config.ts 里的 PWA manifest 声明了display: standalone和 512×512 图标这就是独立窗口外观的来源。核心界面资源被 Service Worker 预缓存冷启动明显快于普通网页服务端更新后下次打开自动切到新版不用你手动清缓存。在线曲库是手机端的主力用法接入网易云、QQ 音乐、酷狗后登录态留在手机浏览器里搜索、播放、歌词动画全部照旧部署好先在手机浏览器登录一次即可。Folia 的拿手好戏是一整套全屏歌词动画主题每个主题都有独立的排版氛围。手机竖屏下版式跟随窗口尺寸自动重排歌词重新组织动画不打折。拿群唱主题举例每句歌词排成聊天气泡竖屏上观感更紧凑。想换风格不用翻设置在播放界面直接进主题速编就行。色板还有 AI 加持主题配色会根据歌曲情绪和歌词内容自动推导部署时配了 AI 密钥的话手机端同样能用。进阶Navidrome 私有曲库接入手机没有本地文件导入那是桌面端 Chromium 浏览器的独占能力想听自己的歌官方路径是接 NavidromeNAS 上用 Docker 跑一个 Navidrome 实例挂载音乐目录在 Folia 的账户页填入 Navidrome 服务地址——或者在部署环境变量里填NAVIDROME_URL、NAVIDROME_USERNAME、NAVIDROME_PASSWORD三项新浏览器会自动登录Folia 把曲库、封面、歌词一次拉齐缺失的歌词还能走智能匹配自动补上。歌安静地待在 NAS 上手机不吃存储也不怎么吃流量。排障安装翻车现象与解法速查现象最可能原因一句话解法找不到添加到主屏幕 / 安装应用地址不是 HTTPS或浏览器不是 Chrome/Safari确认 https 前缀换对浏览器再刷新切到 HTTPS 后旧登录态、曲库没了HTTP 与 HTTPS 是不同 origin数据不自动迁移新地址下重新登录并重建曲库索引服务端更新后手机还停在旧版Service Worker 缓存没换清一次站点数据或移除图标重新添加地铁、弱网里播放卡顿音乐流仍依赖网络属预期表现信号好点再听启动本身已经走缓存表里没覆盖的情况先检查地址与 HTTPS再检查浏览器与系统版本。你刚刚完成了从网页到主屏幕图标的迁移Folia PWA 已装好全屏歌词随时能听。想继续深挖的话主题清单、模块系统和在线音乐部署的细节都在 docs/technical.md 里。【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器项目地址: https://gitcode.com/GitHub_Trending/fo/folia-major创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
