企业官网建设流程全解析

Folia 手机使用指南：3 分钟把歌词动画播放器装进主屏幕

【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器项目地址: https://gitcode.com/GitHub_Trending/fo/folia-major

不用下载任何安装包，部署加安装全程不超过 5 分钟，你的手机就能获得一台全屏运行的 Folia 歌词动画播放器。原理一句话：Folia 的 Web 版内置了 PWA（渐进式 Web 应用，一种可以"装"进手机主屏幕、以独立窗口全屏运行的网页）支持，把页面装好之后，它就是你的 App。下面带你走完整条路线：把 Web 版部署上线 → 在安卓或 iPhone 上装出图标 → 看歌词动画在竖屏上的表现 → 顺手接上自己的 Navidrome 曲库。

🧭 先把边界看清：Folia 手机上能做和不能做

装之前先问一句：哪些功能值得装、哪些不用指望？下面是实测边界，看完再动手不浪费流量。

一句话定位：把手机上的 Folia 当"歌词动画播放器 + 在线 / Navidrome 曲库"用，这是它最顺手的姿势。

🚀 从拿到地址到主屏幕出图标

PWA 本质是一个"可安装的网页"，所以第一件事是把 Web 版部署到一个手机能打开的地址。三种方式里，最省心的一条是仓库 README 里的一键部署：点 Vercel 或 Cloudflare 的部署按钮，几分钟就拿到一个自带 HTTPS 的公网地址，不用买服务器、不用配域名；QQ 音乐也不用另挂 API 实例，把VITE_QQ_API_BASE填成/api/qq再配上服务端密钥即可，说明见 README.md。NAS 用户走 Docker 全栈部署，docker compose up -d拉起后默认监听 18080 端口，步骤在 deploy/docker/README.md；想完全自定义，就克隆仓库后按 docs/technical.md 的环境变量说明发到任意支持 Node.js 的平台。⚠️ 一个关键前提内嵌在这里：PWA 的可靠安装和离线缓存都依赖 HTTPS，免费平台自带证书，自部署则必须配好反向代理和可信证书，否则你会在下一步找不到安装入口。

🤖 安卓：用 Chrome 把应用装进主屏幕

1. 用 Chrome 打开你的 Folia 地址，确认地址栏是https开头
2. 点右上角菜单（⋮）
3. 选"添加到主屏幕"或"安装应用"
4. 核对名称是 Folia，点"添加"

🍎 iPhone / iPad：用 Safari 把应用装进主屏幕

1. 用 Safari 打开你的 Folia 地址
2. 点底部分享按钮（方框加向上箭头）
3. 上滑找到"添加到主屏幕"
4. 确认名称，点"添加"

装好后点一下图标：Folia 以独立窗口启动，没有地址栏和标签页，#09090b深色状态栏与应用背景融为一体，视觉上与原生 App 没有差别——这来自构建配置里的standalone窗口模式和apple-mobile-web-app-capable全屏元标签。

🎬 点开图标之后：竖屏里的歌词动画长什么样

窄窄一屏放得下吗？放得下，而且不需要你动任何参数。每个主题都按窗口尺寸做响应式排版，竖着拿手机时歌词自动重排，横竖屏切换也不闪断。看两种风格的实际观感：

Lumi 流光风格：近黑底色，歌词带发光描边逐字亮起，一行字横跨屏幕，在 OLED 手机上黑得彻底、亮得干净。群唱（Cappella）风格则把整段歌词拆成多条气泡，从屏幕两侧依次落进画面，像群聊逐句亮起来，副歌密集时满屏都是字，节奏感很强。想换风格随时进"主题速编"切换；部署时填过 AI 密钥的话，配色还能跟着歌曲情绪自动变，手机上同样生效。

🗄️ 想听自己收藏的歌：Folia 配 Navidrome 三步接上

手机读不了本地文件，不代表只能听平台的歌——把曲库搬上 NAS 就通了：

1. NAS 上用 Docker 部署 Navidrome，挂载你的音乐目录
2. 在 Folia 账户页填 Navidrome 地址、用户名、密码完成接入
3. 点开任意一首歌，Folia 拉取曲库、封面与歌词，歌词动画照常驱动

音乐文件留在 NAS，手机只走流式播放，省空间也省流量；用 Docker 全栈部署的用户，把.env里三项 Navidrome 凭据填好，手机新打开 Folia 时会自动登录，连第二步都能省掉。

🔍 出问题了？对着这份清单排查

• 找不到"添加到主屏幕 / 安装应用"选项→ 多半是地址还在走 HTTP，PWA 安装依赖 HTTPS 安全上下文 → 换用 HTTPS 地址（免费平台自带，自部署按 deploy/docker/README.md 配反向代理），没有就重开一次页面再试。
• 安卓 / iOS 菜单里压根没有这个选项→ 浏览器不对，安装入口只在 Chrome for Android 和 iOS Safari 提供 → 换成对应浏览器打开同一地址。
• 更新了还是旧版本→ Service Worker 用autoUpdate策略，正常下次打开就换新资源 → 仍卡旧版就清一次站点数据，再重新添加到主屏幕。
• 看不到本地音乐导入入口→ 功能边界问题，手机浏览器不支持目录选择 → 放弃本地导入，按上一节走 Navidrome。
• 弱网里打不开→ 预缓存只在完整加载过一次之后生效 → 先在信号好的地方完整打开一遍，之后弱网可快速启动界面，音乐流本身仍需联网。

到此收束：手机里没有多出一个安装包，只是多了一个点开会进入全屏 Folia 的网页图标。动作清单：

1. 部署 Folia Web 版，拿到 HTTPS 地址
2. 安卓用 Chrome、苹果用 Safari 打开该地址
3. 菜单 / 分享 → 添加到主屏幕
4. 点开图标，竖屏全屏听歌，歌词动画开始跑

【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器项目地址: https://gitcode.com/GitHub_Trending/fo/folia-major