开源音乐播放器SPlayer私有化部署教程 Vue3+Electron桌面客户端帕斯内网穿透远程访问配置指南

SPlayer 是一个基于 Vue 3 + TypeScript + Naïve UI + Electron 开发的简洁音乐播放器。它不仅支持网页端访问，还提供了功能丰富的桌面客户端，为用户带来优雅的音乐播放体验。

该项目具有丰富的功能特性，包括扫码登录、手机号登录、自动每日签到、桌面歌词显示、本地音乐管理、封面主题色自适应、Light/Dark 模式切换、逐字歌词支持、MV 播放、音乐频谱显示等。特别值得一提的是，它支持播放部分无版权歌曲，提供了本地播放器模式，并且具备云盘音乐上传和管理功能。

界面设计美观现代，采用了封面主题色自适应技术，能够根据专辑封面自动调整整体配色，提供沉浸式的视觉体验。项目还支持 PWA 技术，可以像原生应用一样安装到设备上使用。

项目地址：点我跳转

如需在外也打开项目需要配置内网穿透使用，点击前往帕斯内网穿透，先注册好账号备用。

重要提醒： 本项目依赖 NeteaseCloudMusicApi 运行，请确保您已成功部署该项目，并成功取得在线访问地址。

打开飞牛 NAS 或其他的 NAS 设备点击本地镜像-添加镜像-从 URL 添加。这一步先添加 docker 镜像

镜像填 imsyy/splayer:latest 等待下载完成后点击启动按钮启动容器

勾选开机自动启动后下一步，端口设置这里。请设置容器内端口为 25884，主机端口可以设置为 25884（如果端口冲突可以修改主机端口，比如改为 25885，但容器内端口必须保持 25884）

存储位置这里，本项目为纯前端项目，无需设置持久化存储目录。

环境变量设置：可选设置 VITE_API_URL：网易云音乐 API 地址（如果不设置将使用默认配置）

其他的都不用填写，直接下一步启动就好了。

创建成功后可以访问 ip:25884 到这里就可以正常显示项目了

打开帕斯内网穿透控制台，点击隧道管理-隧道列表

点击创建新隧道

隧道节点可以随便选，一般选个负载低的就可以

接下来填写信息，隧道名称可以随便填写

本地 IP 默认就可以

传输协议可以选择 TCP 也可以选择 HTTP/HTTPS

HTTP 就是域名的形式，教程以使用 TCP 为演示

本项目中如果没有修改端口的话默认是 25884 端口，这里本地端口就填 25884

远程端口可以留空也可以自定义。下图仅做参考，请按照实际项目端口添加。

填写完毕点击确定

点击刚才创建好的隧道，点击获取配置文件

回到飞牛 NAS，点击应用中心下载 frpc 客户端

打开后粘贴刚才复制的配置文件，点击确定即可

复制帕斯内网穿透控制台的访问 IP 和端口

可以看到已经正常穿透成功了

本篇教程结束

开源音乐播放器SPlayer私有化部署教程 Vue3+Electron桌面客户端 帕斯内网穿透远程访问配置指南