Showing
1 changed file
with
107 additions
and
0 deletions
README.md
0 → 100644
1 | +# master-cloud-music | ||
2 | +# 微信小程序-网易云音乐App | ||
3 | + | ||
4 | +> Vue+Nodejs 仿网易云音乐 Android 客户端实战 微信小程序版本 | ||
5 | + | ||
6 | + | ||
7 | +## 1. 特性 | ||
8 | + | ||
9 | +基础模组: | ||
10 | +- [x] 轮播图 | ||
11 | +- [x] 推荐歌单 | ||
12 | +- [x] 排行榜 | ||
13 | +- [x] 每日推荐歌曲 | ||
14 | + | ||
15 | +视频 & 歌曲模组: | ||
16 | + | ||
17 | +- [ ] 推荐MV | ||
18 | +- [x] 获取推荐视频 & 播放 | ||
19 | +- [ ] 视频&歌曲 评论 点赞 回复 | ||
20 | +- [x] 歌曲图片显示 | ||
21 | +- [x] 歌曲切换效果 | ||
22 | +- [ ] 歌单排序 | ||
23 | +- [ ] 随机播放 | ||
24 | +- [ ] 播放进度条个性化 | ||
25 | + | ||
26 | +个人信息: | ||
27 | + | ||
28 | +- [x] 手机登录 | ||
29 | +- [ ] 邮箱登录 | ||
30 | +- [x] 头像 账户信息 简介获取 | ||
31 | +- [x] 最近播放歌曲 | ||
32 | + | ||
33 | +搜索模组: | ||
34 | + | ||
35 | +- [x] 热搜列表 | ||
36 | +- [x] 搜索默认关键词 | ||
37 | +- [ ] 搜索多重匹配 | ||
38 | + | ||
39 | + | ||
40 | + | ||
41 | + | ||
42 | +- 安装 | ||
43 | + | ||
44 | + ``` | ||
45 | + $ git clone https://github.com/ACwin/master-cloud-music.git | ||
46 | +- 运行 `cd 至 netease_api` | ||
47 | + | ||
48 | + ``` | ||
49 | + $ node app.js | ||
50 | +- 使用说明 | ||
51 | + | ||
52 | + - 项目目录结构 | ||
53 | + | ||
54 | + ```html | ||
55 | + mo_music // 沫音乐 | ||
56 | + ├── components // 组件 | ||
57 | + ├── netease_api // Node版本网易云音乐接口 | ||
58 | + ├── pages // 小程序页面 | ||
59 | + │ └── index // 首页 | ||
60 | + │ └── login // 登录页 | ||
61 | + │ └── personal // 个人中心 | ||
62 | + │ └── recommendSong // 每日推荐 | ||
63 | + │ └── search // 搜索页 | ||
64 | + │ └── songDetail // 音乐详细页 | ||
65 | + │ └── video // 视频页 | ||
66 | + ├── utils // 工具 | ||
67 | + │ └── request.js // 请求封装体 | ||
68 | + ├── static // 静态资源/图片 | ||
69 | + ``` | ||
70 | + | ||
71 | + - 需要 NodeJS 8.12+ 环境 | ||
72 | + - 安装 微信小程序开发者工具 最新版 | ||
73 | + - 项目导入后 勾选微信开发工具相应配置 | ||
74 | + - ES6 转 ES5 | ||
75 | + - 增强编译 | ||
76 | + - 使用npm模块 | ||
77 | + - 不校验合法域名、web-view(业务域名)、TLS版本以及 HTTPS 证书 | ||
78 | + | ||
79 | + ### 2. 技术栈 | ||
80 | + - 微信原生小程序开发 | ||
81 | + - WX组件 & API: 使用原生架构建设 | ||
82 | + - ajax:发起http请求 | ||
83 | + - ES6:采用ES6语法。 | ||
84 | + - HTML5: 项目主体结构搭建 | ||
85 | + - JavaScript: 对网页行为进行编程 | ||
86 | + - CSS3:CSS3动画及样式。 | ||
87 | + | ||
88 | +## 3. 配置开发环境 | ||
89 | + | ||
90 | +本项目由 [NeteaseCloudMusicApi](https://github.com/Binaryify/NeteaseCloudMusicApi) 提供 API,已经包含在本项目的`netease_api`目录 | ||
91 | + | ||
92 | +### 4.部署至 Vercel | ||
93 | + | ||
94 | +1. 部署网易云 API,详情参见 [Binaryify/NeteaseCloudMusicApi](https://neteasecloudmusicapi.vercel.app/#/?id=安装) 。你也可以将 API 部署到 `Vercel` | ||
95 | +2. 点击本仓库右上角的 Fork,复制本仓库到你的 GitHub 账号 | ||
96 | +3. 打开 [Vercel.com](https://vercel.com/),使用 GitHub 登录 | ||
97 | +4. 点击 `Import Git Repository` 并选择你刚刚复制的仓库并点击 `Import` | ||
98 | +5. 点击 `PERSONAL ACCOUNT` 旁边的 `Select` | ||
99 | +6. 点击 `Environment Variables`,填写 Name 为 `VUE_APP_NETEASE_API_URL`,`Value` 为你刚刚部署的网易云 API 地址,点击 Add。最后点击底部的 Deploy 就可以部署到 Vercel 了 | ||
100 | + | ||
101 | +## 5. 开源许可 | ||
102 | +本项目仅供个人学习研究使用,禁止用于商业及非法用途。 | ||
103 | + | ||
104 | + | ||
105 | +## 6. 截图 | ||
106 | + | ||
107 | +![e50243f0a97ddd38ed3b600c2dac52f](https://user-images.githubusercontent.com/42907149/144467981-1fac130b-317e-424a-81b5-84cc2829dc5b.png) |
-
Please register or login to post a comment