首页/新闻资讯/正文详情

Folia 全屏歌词动画 PWA 手机安装完整指南:3 步把播放器装进主屏

发布时间:2026/11/6 1:30:23 来源:云帆数科 栏目:资讯中心
Folia 全屏歌词动画 PWA 手机安装完整指南:3 步把播放器装进主屏
Folia 全屏歌词动画 PWA 手机安装完整指南3 步把播放器装进主屏【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器 A multi-platform music player for local files, Navidrome, and online streaming services, featuring stunning animated lyrics.项目地址: https://gitcode.com/GitHub_Trending/fo/folia-majorFolia 是一款以全屏歌词动画为核心的多平台音乐播放器在线曲库、Navidrome、本地曲库都吃。装完之后你会得到什么手机主屏上多出一个 Folia 图标点一下直接进全屏歌词动画界面——没有地址栏没有标签页观感跟原生 App 一样。全程要做三件事网页版上线、浏览器里出声、入口装进主屏顺序别乱。安装前先确认两件事功能边界和 HTTPS主屏安装之前先把两个前提钉死。任何一个不过关后面都是白忙。手机端能做什么、做不了什么手机端能用手机端没有在线搜索并播放导入手机本地音频文件夹全屏歌词动画—Navidrome 曲库—本地导入为什么手机上没有这功能依赖 File System Access API只有桌面端的 Chromium 系浏览器提供手机上压根不存在这个入口别花时间找。想在手机上听自己硬盘里的歌正路是 Navidrome第四节专门讲。浏览器也有讲究安卓机固定用 ChromeiPhone 固定用 Safari。其他浏览器要么没有「添加到主屏幕」这条路要么行为不一致装出来容易出问题。地址栏有没有锁HTTPS 判断 ⚠️看浏览器地址栏的锁形标志这是安装入口出现与否的开关走免费托管平台平台自带 HTTPS什么都不用管。NAS 自建给反向代理挂一张可信证书自签的不算数。锁没有PWA 安装入口根本不会出现主屏这一步就别指望了。Folia 最快上线方法一键托管还是 Docker 全栈 两条路按手头条件挑维度路线 A一键托管Vercel / Cloudflare路线 BDocker 全栈NAS / VPS适合谁没有服务器、只想最快上线的新手有 NAS 或一台 VPS想自己控制环境变量和版本大概多久几分钟半小时左右代价几乎为零HTTPS 和域名平台代管要自己拉 compose 栈、配环境变量路线 A直接用仓库首页的一键部署按钮创建项目构建完拿到访问地址就完事HTTPS 和域名都不用操心新手首选。路线 B拉完整 Web 堆栈细节都写在 deploy/docker/README.md如果只关心 QQ 音乐在 serverless 和常驻服务之间的登录方式差异单独翻 docs/qq-music-deployment.md。拿不准就走 A。跑通之后随时可以迁到 Docker两条路不冲突。Folia 手机主屏安装步骤先从网页出声再装进主屏幕最小闭环部署完怎么确认在出声按上一节选好的路线把服务拉起来。确认服务活着。Docker 路线在浏览器访问http://服务器地址:18080/healthz返回正常说明网关起来了一键托管没有这一步页面能打开、搜索有结果就算过。打开页面点顶部的「账户」登录网易云、QQ 音乐或酷狗挑一个就行。搜一首歌点播放进全屏歌词动画。听到声音、歌词在动主流程就跑通了。登录态存在手机浏览器本地登一次之后很长一段时间不用再登。安卓主屏安装步骤Chrome 添加到主屏幕用 Chrome 打开 Folia 地址。点右上角菜单⋮。选「安装应用」或「添加到主屏幕」。确认名称是 Folia点添加。验证点主屏图标直接弹出独立全屏窗口界面上找不到地址栏、标签页和浏览器按钮 ✅ 对上了就是装成了。iPhone 主屏安装步骤Safari 添加到主屏幕用 Safari 打开 Folia 地址。点底部分享按钮。上滑找到「添加到主屏幕」点它。确认名称点添加。验证标准跟安卓一致全屏独立模式看不到任何浏览器痕迹才算合格。Navidrome 接入步骤把 NAS 曲库流式推到手机 PWA 原理一句话歌始终留在 NAS 上Navidrome 扫描后对外流式服务手机 PWA 只负责拉曲库、封面和歌词音频本身不进手机。在 NAS 上用 Docker 部署 Navidrome把音乐目录挂进去。打开 Folia 设置页找到 Navidrome 连接设置填服务器地址、用户名、密码点测试通过后保存。回首页Navidrome 页签下就是你的歌单和专辑直接点着播。接好之后首页长这样接对没有看两点Navidrome 地址必须是每台设备都够得到的。Folia 页面走 HTTPS 时Navidrome 也得是 HTTPS否则浏览器直接拦截混合内容。个别歌缺歌词不用慌智能匹配会自动补在线歌词歌词动画照常驱动。Folia 手机安装卡住了三问自查加一张排查表 先问自己三句入口找得到吗连得上自己的曲库吗打开的是新版界面吗哪句答不上对下表现象多半原因怎么办菜单里翻不到「添加到主屏幕」访问的是 HTTP 地址或者用的不是 Chrome / Safari换 HTTPS 地址重载页面后再找找不到本地导入入口功能边界不是 bug只有桌面端才有手机这边走 Navidrome见第四节更新之后打开还是旧界面Service Worker 的缓存策略卡住了清一次站点数据或把图标删掉重新添加Navidrome 填了却连不上写了 Docker 内部主机名或页面 HTTPS 配了 HTTP 地址改成各设备都可达的地址必要时两边都统一到 HTTPS换到 HTTPS 之后登录态没了两个地址属于不同 origin数据本来就不迁移重新登录、把配置补一遍之后别来回切之后更进一步AI 自动配色与跨设备同步跑通最小链路、接上 Navidrome 之后还有两件锦上添花的事AI 配色部署时配了 AI 密钥主题配色就能按当前歌曲自动生成入口在首页设置里快速主题编辑器还能把每个参数逐条调到位。跨设备同步外观部署 sync-server 即可细节见 docs/technical.md。【免费下载链接】folia-major专注于绚丽的歌词动画效果的本地音乐/navidrome/第三方多平台在线音乐播放器 A multi-platform music player for local files, Navidrome, and online streaming services, featuring stunning animated lyrics.项目地址: https://gitcode.com/GitHub_Trending/fo/folia-major创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

相关推荐

3 条命令跑通输入法词库转换
3 条命令跑通输入法词库转换

3 条命令跑通输入法词库转换 【免费下载链接】imewlconverter ”深蓝词库转换“ 一款开源免费的输入法词库转换程序 项目地址: https://gitcode.com/gh_mirrors/im/imewlconverter 深蓝词库转换(imewlconverter)是一款开源免费的输入法词库转换工… · 2026/11/6 1:30:23

KeymouseGo:录一遍操作,自动回放 100 遍
KeymouseGo:录一遍操作,自动回放 100 遍

KeymouseGo:录一遍操作,自动回放 100 遍 【免费下载链接】KeymouseGo 类似按键精灵的鼠标键盘录制和自动化操作 模拟点击和键入 | automate mouse clicks and keyboard input 项目地址: https://gitcode.com/gh_mirrors/ke/KeymouseGo 上午十点&a… · 2026/11/6 1:30:23

还在手写 XPath?AI 爬虫 Agent 已经 Prompt 一把梭了
还在手写 XPath?AI 爬虫 Agent 已经 Prompt 一把梭了

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/6 1:30:23

工业 Qt 上位机全套开源库分类清单,随手而来的便利
工业 Qt 上位机全套开源库分类清单,随手而来的便利

今天来盘一下工业 Qt 上位机常用开源库分类。列个大概的清单(工控场景全覆盖,分通讯、数据解析、界面、日志、存储、协议、工具、嵌入式适配) 结合我这些年做 Qt 工控、Modbus 设备、RK 嵌入式、Windows 上位机的开发场景,以下是工… · 2026/11/6 1:34:24

OpenSCAD 源码编译速查:几条命令编出你的 3D 编译器
OpenSCAD 源码编译速查:几条命令编出你的 3D 编译器

OpenSCAD 源码编译速查:几条命令编出你的 3D 编译器 【免费下载链接】openscad OpenSCAD - The Programmers Solid 3D CAD Modeller 项目地址: https://gitcode.com/gh_mirrors/op/openscad OpenSCAD 是个"写代码画形状"的 3D CAD 建模工具&#… · 2026/11/6 1:34:24

谁最先意识到电脑需要操作系统的和汇编编译器用汇编语言编写的自举编译,计算机简史,机械,电子硬件,编程语言,编译,打孔式,操作系统
谁最先意识到电脑需要操作系统的和汇编编译器用汇编语言编写的自举编译,计算机简史,机械,电子硬件,编程语言,编译,打孔式,操作系统

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/6 1:34:24

trackerslist 完整配置指南:5 份 Tracker 列表的选择与 BT 客户端配置实操
trackerslist 完整配置指南:5 份 Tracker 列表的选择与 BT 客户端配置实操

trackerslist 完整配置指南:5 份 Tracker 列表的选择与 BT 客户端配置实操 【免费下载链接】trackerslist Updated list of public BitTorrent trackers 项目地址: https://gitcode.com/GitHub_Trending/tr/trackerslist 某个冷门资源排了两天队,… · 2026/11/6 1:34:24

PPT Master 完整安装指南:免费开源 AI PPT 工具,把 PDF 变成逐元素可编辑的演示文稿
PPT Master 完整安装指南:免费开源 AI PPT 工具,把 PDF 变成逐元素可编辑的演示文稿

PPT Master 完整安装指南:免费开源 AI PPT 工具,把 PDF 变成逐元素可编辑的演示文稿 【免费下载链接】ppt-master AI turns documents or topics into real, native PowerPoint decks—with native shapes, transitions and animations, data-backed cha… · 2026/11/6 1:34:24

Akaunting:免费自托管会计软件,三步开张
Akaunting:免费自托管会计软件,三步开张

Akaunting:免费自托管会计软件,三步开张 【免费下载链接】akaunting Online Accounting Software 项目地址: https://gitcode.com/gh_mirrors/ak/akaunting Akaunting 是一款可以免费自托管的在线会计软件,面向不想买 SaaS 订阅、也不… · 2026/11/6 1:33:23

双极步进电机控制实战:DRV8818PWPR与PIC18F86K22驱动调试
双极步进电机控制实战:DRV8818PWPR与PIC18F86K22驱动调试

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/5 10:27:59

STM32F207ZG + DRV8818PWPR 步进电机驱动实战解析
STM32F207ZG + DRV8818PWPR 步进电机驱动实战解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/5 10:28:03

DRV8818PWPR+dsPIC30F4013工业级双极步进电机控制方案
DRV8818PWPR+dsPIC30F4013工业级双极步进电机控制方案

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/5 10:28:07

三菱PLC数据采集到数据库的时序设计:Python+MC协议实战
三菱PLC数据采集到数据库的时序设计:Python+MC协议实战

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/6 1:02:11

ASIC主模式RTL设计:状态机与三态驱动的流片级实现
ASIC主模式RTL设计:状态机与三态驱动的流片级实现

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/6 1:02:11

STM32嵌入式C++开发:GDB调试与Renode仿真实战指南
STM32嵌入式C++开发:GDB调试与Renode仿真实战指南

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/6 1:02:11

双极步进电机控制实战:DRV8818PWPR与PIC18F86K22驱动调试
双极步进电机控制实战:DRV8818PWPR与PIC18F86K22驱动调试

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/5 10:27:59

STM32F207ZG + DRV8818PWPR 步进电机驱动实战解析
STM32F207ZG + DRV8818PWPR 步进电机驱动实战解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/5 10:28:03

DRV8818PWPR+dsPIC30F4013工业级双极步进电机控制方案
DRV8818PWPR+dsPIC30F4013工业级双极步进电机控制方案

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/11/5 10:28:07

了解更多?预约专属演示

我们的顾问将为您一对一讲解产品与方案

企业微信二维码