惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

V
Visual Studio Blog
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
N
Netflix TechBlog - Medium
博客园 - 叶小钗
大猫的无限游戏
大猫的无限游戏
S
SegmentFault 最新的问题
V
V2EX
IT之家
IT之家
J
Java Code Geeks
Hacker News - Newest:
Hacker News - Newest: "LLM"
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
GbyAI
GbyAI
D
Docker
S
Secure Thoughts
Recent Announcements
Recent Announcements
Webroot Blog
Webroot Blog
Application and Cybersecurity Blog
Application and Cybersecurity Blog
云风的 BLOG
云风的 BLOG
博客园_首页
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Security Archives - TechRepublic
Security Archives - TechRepublic
酷 壳 – CoolShell
酷 壳 – CoolShell
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
N
News | PayPal Newsroom
S
Security @ Cisco Blogs
I
InfoQ
Last Week in AI
Last Week in AI
SecWiki News
SecWiki News
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
W
WeLiveSecurity
T
Troy Hunt's Blog
Recent Commits to openclaw:main
Recent Commits to openclaw:main
H
Hackread – Cybersecurity News, Data Breaches, AI and More
Attack and Defense Labs
Attack and Defense Labs
美团技术团队
T
The Blog of Author Tim Ferriss
Google DeepMind News
Google DeepMind News
Martin Fowler
Martin Fowler
B
Blog
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
Scott Helme
Scott Helme
T
Tor Project blog
Know Your Adversary
Know Your Adversary
有赞技术团队
有赞技术团队
Hugging Face - Blog
Hugging Face - Blog
Recorded Future
Recorded Future
C
Cyber Attacks, Cyber Crime and Cyber Security
AI
AI
G
Google Developers Blog

Hyde Blog

Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog 关于我 关于我 Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog
Hyde Blog
Hyde · 2025-10-05 · via Hyde Blog

音乐模块(可选) ​

版权声明 📖 ​

警告

本教程参考了互联网Github [XiangZi7]作者的教程,并结合自身实际部署过程中积累的经验编写而成。原始教程链接为KM-Music-Player,感谢原作者提供的宝贵参考资料。

本教程仅供学习和交流使用,任何人不得将本教程的内容用于商业用途。如需引用或转载,请务必注明原作者及本文出处。如侵权之处,请联系博主进行删除,谢谢~

介绍 📖 ​

KM-Music-Player (Kuriyama Mirai Music Player) 是一款基于 Vue 3.4Vite 5PiniaElement-Plus 开发的开源 Web 音乐播放器。它采 用目前最新的技术栈,提供流畅且美观的音乐播放体验。

系统需求 ⚙️ ​

  • Node.js 版本需大于 18

在线预览 👀 ​

代码仓库 ⭐ ​

GitHub 代码仓库

项目功能 🔨 ​

  • 支持上、下、循环、顺序、随机、单曲播放
  • 支持 MV 显示
  • 正常动漫播放
  • 歌词滚动显示
  • 网易云二维码登录
  • 动态切换主题
  • 暗黑模式

安装使用步骤 📔 ​

  • Clone

Github ​

使用 Git 克隆项目到本地: ​

bash

  git clone https://github.com/XiangZi7/KM-Music-Player.git

安装依赖 ​

进入项目目录并安装所需的依赖:

bash

cd KM-Music-Player
pnpm install

启动开发服务器 ​

启动本地开发服务器,为你提供实时预览:

打包并上传您服务器 ​

配置前端文件 ​

路径在:blog-frontend/kuailemao-blog/.env.development或者 .env.production

bash

# 开发环境配置
NODE_ENV = development

# 博客代理地址
VITE_APP_BASE_API = '/api'
# 项目后端地址(来自blog-frontend/kuailemao-admin/.env.development配置文件中VITE_APP_BASE_URL)
#系统接口500异常也是这里配置的原因
    VITE_SERVE='http://192.168.80.128:8088/'
# 前台域名
VITE_FRONTEND_URL = 'http://localhost:99/'
# 音乐代理地址
VITE_MUSIC_BASE_API = '/wapi'
# 第三方开源集成的音乐前端地址,如果不配置上面菜单栏就不会出现音乐选项
VITE_MUSIC_FRONTEND_URL = 'http://localhost:5173/home'
# 左下角音乐后台
VITE_MUSIC_SERVE='http://192.168.80.128:3000/'
# 自己部署的一言接口,如果不填写会默认使用官网的接口,官网接口有每分钟qps限制,有时会得不到想要的结果
VITE_YIYAN_API = 'http://192.168.80.128:8000/'

效果展示 ​

文档说明

你可以查阅 网易云音乐 API 文档 以 获取更多信息和接口使用说明(可能需要魔法上网)。

项目截图 📷 ​

存在问题 ​

登录接口请求不到(待解决)