React hooks + Mobx + typescript + EggJs从0到1打造一款仿网易云音乐APP（一）

时间 2020-05-09

标签 react hooks mobx typescript eggjs 打造一款网易音乐 app 栏目 React 繁體版

原文原文链接

引言

该项目会以 React 全家桶 (会使用 16.8 最新 API 及 hooks) 以及 mobx 数据流方案为基础打造的一款高质量的移动端音乐类 WebApp 。javascript

涉及的技术栈主要有：前端

react v16.8 全家桶 (react，react-router) : 用于构建用户界面的 MVVM 框架
mobx 前端数据流方案
immutable: Facebook 历时三年开发出的进行持久性数据结构处理的库
axios: 用来请求后端 api 的数据。

此篇为第一篇，主要是网易云 EggJs API 的实现。后面的数据都会源于网易云官方的数据。网易云音乐 EggJs 版 API，github 地址，接口正在持续更新中，目前已经支持网易云音乐中的大部分接口，包含登陆注册。java

工做原理

跨站请求伪造 (CSRF), 伪造请求头 , 调用官方 API。react

特别声明

本项目不提供线上 demo，请不要轻易信任使用他人提供的公开服务，以避免发生安全问题,泄露本身的帐号和密码 webpack

部分接口如登陆接口不能调用太频繁 , 不然可能会触发 503 错误或者 ip 高频错误 ,若需频繁调用 , 须要准备 IP 代理池. ios

本项目仅供学习使用,请尊重版权，请勿利用此项目从事商业行为 git

EggJS 中间件实现

这里简要提一下 EggJs 的中间件。Egg 是基于 Koa 实现的，因此 Egg 的中间件形式和 Koa 的中间件形式是同样的，都是基于洋葱圈模型。github

处理 cookie 中间件

/** * 处理cookie */
module.exports = () => {
  return async function (ctx, next) {
    const { response } = ctx;
    await next();
    response.append('Set-Cookie', response.body && response.body.cookie);
  };
};
复制代码

错误处理中间件

module.exports = () => {
  return async function (ctx, next) {
    try {
      await next();
    } catch (error) {
      ctx.body = error.body;
      ctx.status = error.status;
    }
  };
};
复制代码

包含接口

特别声明，接口示范使用如下格式 web

Method /xxx/:xxxx/xxx

@body:
{
	"***": "**********",
	"**"?: "*********" // ?表明可选
}

@param:
{
    "***": "********"
}

@query:
{
    "***": "***********",
    "***"?: "**********"
}

复制代码

参数统一声明 limit : 返回数量 , 默认为 30 offset : 偏移数量，用于分页 , 如 :( 当前页码 -1)*30, 其中 30 为 limit 的值 , 默认为 0 axios

1.登陆模块

1.1 手机号登陆

必选参数 :

phone: 手机号码
password: 密码
复制代码

接口地址 :

/login/cellphone
复制代码

可选参数 :

rememberLogin: 30天免登陆，默认false
复制代码

调用例子 :

POST /login/cellphone

@body:
{
	phone: "**********",
	password: "*****",
	rememberLogin?: true

}
复制代码

1.2 邮箱登陆

必选参数 :

email: 手机号码
password: 密码
复制代码

接口地址 :

/login/email
复制代码

可选参数 :

rememberLogin: 30天免登陆，默认false
复制代码

调用例子 :

POST /login/email

@body:
{
	email: "**********",
	password: "*****",
	rememberLogin: true
}
复制代码

1.3 初始化昵称

必选参数 :

nickname: 昵称
复制代码

接口地址 :

/login/init/profile
复制代码

调用例子 :

POST /login/init/profile

@body
{
	nickname: "**********"
}
复制代码

1.4 发送手机验证码

必选参数 :

cellphone: 手机号码
复制代码

接口地址 :

/login/sms/captcha/send
复制代码

可选参数 :

ctcode: 国家区号,默认86即中国
复制代码

调用例子 :

POST /login/sms/captcha/send

// body
{
	ctcode?: "86",
	cellphone: "*******"
}
复制代码

1.5 校验手机验证码

必选参数 :

cellphone: 手机号码
captcha: 验证码
复制代码

接口地址 :

/login/sms/captcha/verify
复制代码

可选参数 :

ctcode: 国家区号,默认86即中国
复制代码

调用例子 :

POST /login/sms/captcha/verify

// body
{
	ctcode?: "86",
	cellphone: "*******",
	captcha: "****"
}
复制代码

1.6 检测手机号码是否已注册

必选参数 :

cellphone: 手机号码
复制代码

接口地址 :

/login/cellphone/check/exist
复制代码

可选参数 :

countrycode: 国家码，用于国外手机号登录，例如美国传入：1
复制代码

调用例子 :

POST /login/cellphone/check/exist

// body
{
	countrycode?: "86",
	cellphone: "*******"
}
复制代码

1.7 刷新登陆

接口地址 :

/login/refresh

调用例子 :

GET / login / refresh;
复制代码

1.8 获取登陆状态

接口地址 :

/login/status
复制代码

调用例子 :

GET / login / status;
复制代码

1.9 退出登陆

接口地址 :

/logout
复制代码

调用例子 :

GET / logout;
复制代码

2.用户模块

2.1 获取用户录音

说明 : 登录后调用此接口，可获取用户建立的电台

必选参数 :

无
复制代码

接口地址 :

/user/audios
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / audios;
复制代码

2.2 删除用户云盘歌曲

说明 : 登录后调用此接口，可删除云盘歌曲

必选参数 :

ids: 歌曲id数组
复制代码

接口地址 :

/user/cloud/song/del
复制代码

可选参数 :

无
复制代码

调用例子 :

DELETE /user/cloud/song/del

@body
{
    ids: ["****","****"]
}
复制代码

2.3 获取用户云盘数据详情

说明: 登录后调用此接口，传入云盘歌曲 ids，可获取云盘数据详情

必选参数 :

ids: 多个歌曲id用","分隔
复制代码

接口地址 :

/user/cloud/songs/info
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /user/cloud/songs/info

@query
{
	ids: "***,***"
}
复制代码

2.4 获取云盘音乐列表

说明：登录后调用此接口 , 可获取云盘数据 , 获取的数据没有对应 url, 须要再调用一次 /song/url 获取 url。

必选参数 :

无
复制代码

接口地址 :

/user/cloud
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 , 如 :( 当前页码 -1)*30, 其中 30 为 limit 的值 , 默认为 0
复制代码

调用例子 :

GET /user/cloud

// query
{
	limit?: 100,
	offset?: 1
}
复制代码

2.5 获取用户信息

说明 : 登录后调用此接口，能够获取用户详情

必选参数 :

无
复制代码

接口地址 :

/user/info
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / info;
复制代码

2.6 获取用户电台

说明 : 登录后调用此接口，能够获取用户电台

必选参数 :

cellphone: 手机号码
复制代码

接口地址 :

无
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / djs;
复制代码

2.7 获取用户动态

说明 : 登录后调用此接口，能够获取用户动态

必选参数 :

无
复制代码

接口地址 :

/user/event
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
lasttime : 返回数据的 lasttime ,默认-1,传入上一次返回结果的 lasttime,将会返回下一页的数据
复制代码

调用例子 :

GET /user/event

@query
{
	limit?: 30,
	lasttime: -1
}
复制代码

2.8 获取用户粉丝

说明 : 登录后调用此接口，能够获取用户粉丝列表

必选参数 :

无
复制代码

接口地址 :

/user/followeds
复制代码

可选参数 :

可选参数 : limit : 返回数量 , 默认为 30
lasttime : 返回数据的 lasttime ,默认-1,传入上一次返回结果的 lasttime,将会返回下一页的数据
复制代码

调用例子 :

GET /user/followeds

@query
{
	limit?: 30,
	lasttime: -1
}
复制代码

2.9 获取用户关注者

说明 : 登录后调用此接口，能够获取用户关注列表

必选参数 :

无
复制代码

接口地址 :

/user/follows
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 , 如 :( 当前页码 -1)*30, 其中 30 为 limit 的值 , 默认为 0
复制代码

调用例子 :

GET /user/follows

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

2.10 获取用户播放列表

说明 : 登录后调用此接口，能够获取用户歌单

必选参数 :

无
复制代码

接口地址 :

/user/playlist
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 , 如 :( 当前页码 -1)*30, 其中 30 为 limit 的值 , 默认为 0
复制代码

调用例子 :

GET /user/playlist

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

2.11 获取用户播放记录

说明：登录后调用此接口，可获取用户播放记录

必选参数 :

无
复制代码

接口地址 :

/user/playrecord
复制代码

可选参数 :

type: type=1 时只返回周数据, type=0 时返回全部数据
复制代码

调用例子 :

GET /user/playrecord

@query
{
	type?: 0
}
复制代码

2.12 获取用户收藏计数

说明：登录后调用此接口，可获取用户收藏计数

必选参数 :

无
复制代码

接口地址 :

/user/subcount
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / subcount;
复制代码

2.13 更新用户信息

说明 : 登录后调用此接口，传入相关信息，能够更新用户信息

必选参数 :

gender: 性别 0:保密 1:男性 2:女性

birthday: 出生日期,时间戳 unix timestamp

nickname: 用户昵称

province: 省份id // 能够调用/custom/citylist接口获取

city: 城市id // 能够调用/custom/citylist接口获取

signature：用户签名
复制代码

接口地址 :

/user/info
复制代码

可选参数 :

无
复制代码

调用例子 :

PUT /user/info

// body
{
    gender: 0
    birthday: 134567788
    nickname: "***"
    province: 400022
    city: 2344554
    signature："****"
}
复制代码

2.14 获取用户操做记录

说明 : 登录后调用此接口，能够获取用户操做记录

必选参数 :

无
复制代码

接口地址 :

/user/logs
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / logs;
复制代码

2.15 获取用户 FM

说明 : 登录后调用此接口，能够获取用户 FM

必选参数 :

无
复制代码

接口地址 :

/user/fm
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / fm;
复制代码

2.16 获取用户推荐电台节目

说明 : 调用此接口 , 可获取推荐电台

必选参数 :

无
复制代码

接口地址 :

/user/rec/djprogram
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / rec / djprogram;
复制代码

2.17 获取用户推荐 MV

说明 : 调用此接口 , 可获取推荐 MV

必选参数 :

无
复制代码

接口地址 :

/user/rec/mv
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / rec / mv;
复制代码

2.18 获取用户推荐新歌

说明 : 调用此接口 , 可获取推荐新歌

必选参数 :

无
复制代码

接口地址 :

/user/rec/newsong
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / rec / newsong;
复制代码

2.19 获取独家放送

说明 : 调用此接口 , 可获取独家放送

必选参数 :

无
复制代码

接口地址 :

/user/privatecontent
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / user / privatecontent;
复制代码

2.20 获取用户推荐歌单

说明 : 调用此接口 , 可获取独独家推荐歌单

必选参数 :

无
复制代码

接口地址 :

/user/rec/playlist
复制代码

可选参数 :

limit：返回数量 , 默认为 30
复制代码

调用例子 :

GET /user/rec/playlist

@query
{
	limit?: 30
}
复制代码

3.专辑模块

3.1 获取专辑动态信息

说明 : 调用此接口 , 可获取专辑动态信息

必选参数 :

albumId: 专辑ID
复制代码

接口地址 :

/album/:albumId/detail/dynamic
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /album/:albumId/detail/dynamic

@param
{
	albumId: 12244
}
复制代码

3.2 获取最新专辑

说明 : 调用此接口 , 可获取最新专辑

必选参数 :

无
复制代码

接口地址 :

/album/latest
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / album / latest;
复制代码

3.3 收藏｜取消收藏专辑

说明 : 调用此接口 , 可收藏｜取消收藏专辑

必选参数 :

albumId：专辑ID
actionType: 操做类型，收藏："sub" ，取消收藏："unsub"
复制代码

接口地址 :

/album/:albumId/sub/:actionType
复制代码

可选参数 :

limit：返回数量 , 默认为 30
复制代码

调用例子 :

POST /album/:albumId/sub/:actionType

@param
{
	albumId: "****",
	actionType: "sub"
}
复制代码

3.4 获取收藏专辑列表

说明 : 调用此接口 , 可获取收藏专辑列表

必选参数 :

无
复制代码

接口地址 :

/album/sublist
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 , 如 :( 当前页码 -1)*30, 其中 30 为 limit 的值 ,
复制代码

调用例子 :

GET /album/sublist

@query
{
    offset?: 0,
	limit?: 30
}
复制代码

3.5 获取专辑信息

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

albumId: 专辑ID
复制代码

接口地址 :

/album/:albumId/info
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /album/:albumId/info

@param
{
	albumId: "****"
}
复制代码

4.歌手模块

4.1 获取歌手列表

说明 : 调用此接口 , 可获取歌手列表

必选参数 :

无
复制代码

接口地址 :

/artist/list
复制代码

可选参数 :

调用例子 :

GET /artist/list

@param
{
	limit?: 30,
	offset?: 1
	categoryCode: 1001,
	initial: 'a'
}
复制代码

4.2 获取歌手简介

说明 : 调用此接口 , 可获取歌手简介

必选参数 :

artistId: 歌手ID
复制代码

接口地址 :

/artist/:artistId/brief
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /artist/:artistId/brief

@param
{
	artistId: "****"
}
复制代码

4.3 获取歌手信息

说明 : 调用此接口 , 可获取歌手信息

必选参数 :

artistId: 歌手ID
复制代码

接口地址 :

/artist/:artistId/info
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /artist/:artistId/info

@param
{
	artistId: "****"
}
复制代码

4.4 获取歌手专辑

说明 : 调用此接口 , 可获取歌手专辑

必选参数 :

artistId: 歌手ID
复制代码

接口地址 :

/artist/:artistId/albums
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /artist/:artistId/albums

@param
{
	artistId: "****"
}
@query
{
    limit?: 30,
    offset: 1
}
复制代码

4.5 获取歌手 MV

说明 : 调用此接口 , 可获取歌手 MV

必选参数 :

artistId: 歌手ID
复制代码

接口地址 :

/artist/:artistId/mv
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /artist/:artistId/mv

@param
{
	artistId: "****"
}
@query
{
    limit?: 30,
    offset: 1
}
复制代码

4.6 获取歌手 50 首流行歌曲

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

artistId: 歌手ID
复制代码

接口地址 :

/artist/:artistId/top/song
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /artist/:artistId/top/song

@param
{
	artistId: "****"
}
复制代码

4.7 收藏｜取消收藏歌手

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

artistId: 歌手ID
actionType: 操做类型，收藏："sub"，取消收藏："unsub"
复制代码

接口地址 :

/artist/:artistId/sub/:actionType
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /artist/:artistId/sub/:actionType

@param
{
	artistId: "****",
	actionType: "sub"
}
复制代码

4.8 获取订阅歌手列表

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

无
复制代码

接口地址 :

/artist/sublist
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /artist/sublist

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

5.评论模块

5.1 获取资源评论

说明 : 调用此接口 , 可获取资源评论

必选参数 :

type: 资源类型，可选：
    专辑："album",
    电台："dj"
    歌曲："music",
    MV："mv",
    歌单："playlist",
    视频："video",
    动态："event"
resourceId: 资源ID
复制代码

接口地址 :

/comment/resource/:resourceId/comments
复制代码

可选参数 :

limit: 取出评论数量 , 默认为 20
offset: 偏移数量 , 用于分页 , 如 :( 评论页数 -1)*20, 其中 20 为 limit 的值
beforeTime: 分页参数,取上一页最后一项的time，获取下一页数据(获取超过5000条评论的时候须要用到)
复制代码

调用例子 :

GET /comment/resource/:resourceId/hot/comments

@param {
    resourceId: "***"
}
@query
{
    limit?: 30,
    offset?: 1,
    type: "music",
    beforeTime: 0
}
复制代码

5.2 获取资源热门评论

说明 : 调用此接口 , 可获取资源热门评论

必选参数 :

type: 资源类型，可选：
    专辑："album",
    电台："dj"
    歌曲："music",
    MV："mv",
    歌单："playlist",
    视频："video",
    动态："event"
resourceId: 资源ID
复制代码

接口地址 :

/comment/resource/:resourceId/hot/comments
复制代码

可选参数 :

limit: 取出评论数量 , 默认为 20
offset: 偏移数量 , 用于分页 , 如 :( 评论页数 -1)*20, 其中 20 为 limit 的值
beforeTime: 分页参数,取上一页最后一项的time，获取下一页数据(获取超过5000条评论的时候须要用到)
复制代码

调用例子 :

GET /comment/resource/:resourceId/hot/comments

@param {
    resourceId: "***"
}
@query
{
    limit?: 30,
    offset?: 1,
    type: "music",
    beforeTime: 0
}
复制代码

5.3 获取资源云村热评

说明 : 调用此接口 , 可获取资源云村热评

必选参数 :

无
复制代码

接口地址 :

/comment/hotwall/list
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / comment / hotwall / list;
复制代码

5.4 点赞｜取消点赞评论

说明 : 调用此接口 , 可点赞｜取消点赞评论

必选参数 :

resourceId: 资源ID
actionType: 操做类型，点赞："like"，取消点赞："unlike"
commentId: 评论ID
type: 资源类型，可选：
    专辑："album",
    电台："dj"
    歌曲："music",
    MV："mv",
    歌单："playlist",
    视频："video",
    动态："event"
复制代码

接口地址 :

/comment/resource/:resourceId/like/:actionType
复制代码

可选参数 :

无
复制代码

调用例子 :

POST /comment/resource/:resourceId/like/:actionType

@param
{
    resourceId: "***",
    actionType: "like"
}
@body
{
   commentId: "***",
   type: "music"
}
复制代码

5.5 发表资源评论

说明 : 调用此接口 , 可发表资源评论

必选参数 :

resourceId: 资源ID
content: 评论内容
type: 资源类型，可选：
    专辑："album",
    电台："dj"
    歌曲："music",
    MV："mv",
    歌单："playlist",
    视频："video",
    动态："event"
复制代码

接口地址 :

/comment/resource/:resourceId/comment/send
复制代码

可选参数 :

无
复制代码

调用例子 :

POST /comment/resource/:resourceId/comment/send

@body
{
    resourceId: "***",
    content: "***",
    type: "music"
}
复制代码

5.5 删除资源评论

说明 : 调用此接口 , 可删除资源评论

必选参数 :

resourceId: 资源ID
commentId: 评论ID
type: 资源类型，可选：
    专辑："album",
    电台："dj"
    歌曲："music",
    MV："mv",
    歌单："playlist",
    视频："video",
    动态："event"
复制代码

接口地址 :

/comment/resource/:resourceId/comment
复制代码

可选参数 :

无
复制代码

调用例子 :

DELETE /comment/resource/:resourceId/comment

@param
{
    resourceId: "***"
}
@body {
    commentId: "***",
    type: "music"
}
复制代码

5.6 回复资源评论

说明 : 调用此接口 , 可回复资源评论

必选参数 :

resourceId: 资源ID
commentId: 评论ID
content: 评论内容
type: 资源类型，可选：
    专辑："album",
    电台："dj"
    歌曲："music",
    MV："mv",
    歌单："playlist",
    视频："video",
    动态："event"
复制代码

接口地址 :

/comment/resource/:resourceId/comment/:commentId/reply
复制代码

可选参数 :

无
复制代码

调用例子 :

POST /comment/resource/:resourceId/comment/:commentId/reply

@param
{
    resourceId: "***",
    commentId: "***"
}
@body {
    content: "****",
    type: "music"
}
复制代码

6.MV 模块

6.1 获取 MV 列表

说明 : 调用此接口 , 可获取 MV 列表

必选参数 :

无
复制代码

接口地址 :

/mv/list
复制代码

可选参数 :

调用例子 :

GET /mv/list

@query
{
    area?: 0,
    type?: 0,
    order?: 0,
    offset?: 1,
    limit?: 30,
}
复制代码

6.2 获取 MV 详情

说明 : 调用此接口 , 可获取 MV 详

必选参数 :

mvId: MV ID
复制代码

接口地址 :

/mv/:mvId/detail
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /mv/:mvId/detail

@param
{
    mvId: "***"
}
复制代码

6.3 获取网易出品 MV

说明 : 调用此接口 , 可获取网易出品 MV

必选参数 :

无
复制代码

接口地址 :

/mv/exclusive/rcmd
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /mv/exclusive/rcmd

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

6.4 获取最新 MV

说明 : 调用此接口 , 可获取最新 MV

必选参数 :

无
复制代码

接口地址 :

/mv/latest
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /mv/latest

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

6.5 收藏｜取消收藏 MV

说明 : 调用此接口 , 可收藏｜取消收藏 MV

必选参数 :

mvId: MV ID
actionType: 操做类型，收藏："sub"，取消收藏："unsub"
复制代码

接口地址 :

/mv/:mvId/sub/:actionType
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /mv/:mvId/sub/:actionType

@param
{
    mvId: "***",
    actionType: "sub"
}
复制代码

6.6 获取 MV 收藏列表

说明 : 调用此接口 , 获取 MV 收藏列表

必选参数 :

无
复制代码

接口地址 :

/mv/sublist
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /mv/sublist

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

6.7 获取 MV URL

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

mvId: MV ID
resolution: 分辨率，默认1080
复制代码

接口地址 :

/mv/url
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /mv/url

@query
{
    mvId: "***",
    resolution?: 1080
}
复制代码

7.电台模块

7.1 获取电台 banner

说明 : 调用此接口 , 可获取电台 banner

必选参数 :

无
复制代码

接口地址 :

/dj/banner
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / dj / banner;
复制代码

7.2 获取电台非热门分类

说明 : 调用此接口 , 可获取电台非热门分类

必选参数 :

无
复制代码

接口地址 :

/dj/category/excludehot
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / dj / category / excludehot;
复制代码

7.3 获取电台推荐分类

说明 : 调用此接口 , 可获取电台推荐分类

必选参数 :

无
复制代码

接口地址 :

/dj/category/rec
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / dj / category / rec;
复制代码

7.4 获取电台分类列表

说明 : 调用此接口 , 可获取电台分类列表

必选参数 :

无
复制代码

接口地址 :

/dj/category/list
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / dj / category / list;
复制代码

7.5 获取热门电台

说明 : 调用此接口 , 可获取热门电台

必选参数 :

无
复制代码

接口地址 :

/dj/hot
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/hot

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

7.6 获取付费电台

说明 : 调用此接口 , 可获取付费电台

必选参数 :

无
复制代码

接口地址 :

/dj/paygift
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/paygift

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

7.7 获取电台 24 小时节目榜

说明 : 调用此接口 , 可获取电台 24 小时节目榜

必选参数 :

无
复制代码

接口地址 :

/dj/program/toplist/hours
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
复制代码

调用例子 :

GET /dj/program/toplist/hours

@query
{
    limit?: 30
}
复制代码

7.8 获取电台节目榜单

说明 : 调用此接口 , 可获取电台节目榜单

必选参数 :

无
复制代码

接口地址 :

/dj/program/toplist
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/program/toplist

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

7.9 获取电台节目列表

说明 : 调用此接口 , 可获取电台节目列表

必选参数 :

djId: 电台ID
复制代码

接口地址 :

/dj/:djId/program/list
复制代码

可选参数 :

asc: 排序方式,默认为 false (新 => 老 ) 设置 true 可改成 老 => 新
limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/:djId/program/list

@param
{
    djId: "***"
}
@query
{
    asc?: false,
    limit?: 30,
    offset?: 1
}
复制代码

7.10 获取分类热门电台

说明 : 调用此接口 , 可获取分类热门电台

必选参数 :

categoryId: 分类ID
复制代码

接口地址 :

/dj/category/:categoryId/djs
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/category/:categoryId/djs

@param
{
    categoryId: "***"
}
@query
{
    limit?: 30,
    offset?: 1
}
复制代码

7.11 精选分类电台列表

说明 : 调用此接口 , 可获取精选分类电台列表

必选参数 :

typeId: 类型ID，数字
  有声书: 10001,
  知识技能: 453050,
  商业财经: 453051,
  人文历史: 11,
  外语世界: 13,
  亲子宝贝: 14,
  创做|翻唱: 2001,
  音乐故事: 2,
  3D|电子: 10002,
  相声曲艺: 8,
  情感调频: 3,
  美文读物: 6,
  脱口秀: 5,
  广播剧: 7,
  二次元: 3001,
  明星作主播: 1,
  娱乐|影视: 4,
  科技科学: 453052,
  校园|教育: 4001,
  旅途|城市: 12,
复制代码

接口地址 :

/dj/type/:typeId/rec/djs
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /dj/type/:typeId/rec/djs

@param
{
    typeId: 1
}
复制代码

7.12 获取推荐电台

说明 : 调用此接口 , 可获取推荐电台

必选参数 :

无
复制代码

接口地址 :

/dj/rec/djs
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET / dj / rec / djs;
复制代码

7.13 订阅｜取消订阅电台

说明 : 调用此接口 , 订阅｜取消订阅电台

必选参数 :

djId: 电台ID
actionType: 操做类型，订阅："sub" 取消订阅："unsub"
复制代码

接口地址 :

/dj/:djId/sub/:actionType
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

POST /dj/:djId/sub/:actionType

@param
{
    djId: "***",
    actionType: "sub"
}
复制代码

7.14 获取订阅电台列表

说明 : 调用此接口 , 可获取订阅电台列表

必选参数 :

无
复制代码

接口地址 :

/dj/sublist
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/sublist

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

7.15 获取今日优选电台

说明 : 调用此接口 , 可获取今日优选电台

必选参数 :

无
复制代码

接口地址 :

/dj/totay/perfered
复制代码

可选参数 :

offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/totay/perfered

@query
{
    offset?: 1
}
复制代码

7.16 获取 24 小时榜电台

说明 : 调用此接口 , 可获取 24 小时榜电台

必选参数 :

无
复制代码

接口地址 :

/dj/toplist/hours
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
复制代码

调用例子 :

GET /dj/toplist/hours

@query
{
    limit?: 30
复制代码

7.17 电台新人榜

说明 : 调用此接口 , 可获取电台新人榜

必选参数 :

无
复制代码

接口地址 :

/dj/toplist/newcomer
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/toplist/newcomer

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

7.18 付费精品

说明 : 调用此接口 , 可付费精品

必选参数 :

无
复制代码

接口地址 :

/dj/toplist/pay
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
复制代码

调用例子 :

GET /dj/toplist/pay

@query
{
    limit?: 30
}
复制代码

7.19 流行热榜

说明 : 调用此接口 , 可获取流行热榜

必选参数 :

无
复制代码

接口地址 :

/dj/toplist/popular
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
复制代码

调用例子 :

GET /dj/toplist/popular

@query
{
    limit?: 30
}
复制代码

7.20 电台热榜

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

无
复制代码

接口地址 :

/dj/toplist
复制代码

可选参数 :

type:  榜单类型, 0 为新晋电台榜,1 为热门电台榜,默认为0
limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /dj/toplist

@query
{
    type: 0,
    limit?: 30,
    offset?: 1
}
复制代码

7.21 获取电台节目详情

说明 : 调用此接口 , 可获取电台节目详情

必选参数 :

djId: 电台ID
复制代码

接口地址 :

/dj/:djId/program/detail
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /dj/:djId/program/detail

@param
{
    djId: "***"
}
复制代码

7.22 获取电台详情

说明 : 调用此接口 , 可获取电台详情

必选参数 :

djId: 电台ID
复制代码

接口地址 :

/dj/:djId/detail
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /dj/:djId/detail

@param
{
    djId: "***"
}
复制代码

8.排行榜模块

8.1 专辑排行榜

说明 : 调用此接口 , 可获取专辑排行榜

必选参数 :

无
复制代码

接口地址 :

/top/album
复制代码

可选参数 :

area: 'ALL' | 'ZH' | 'EA' | 'KR' | 'JP'
limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /top/album

@query
{
    area?: 'ZH',
    limit?: 30,
    offset?: 1
}
复制代码

8.2 获取热门歌手

说明 : 调用此接口 , 获取热门歌手

必选参数 :

无
复制代码

接口地址 :

/top/artist
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /top/artist

@query
{
    limit?: 30,
    offset?: 1
}
复制代码

8.3 获取新歌列表

说明 : 调用此接口 , 获取新歌列表

必选参数 :

接口地址 :

/top/list
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /top/list

@query
{
    type: 0
}
复制代码

8.4 获取 MV 排行榜

说明 : 调用此接口 , 获取 MV 排行榜

必选参数 :

无
复制代码

接口地址 :

/top/mv
复制代码

可选参数 :

调用例子 :

GET /top/mv

@query
{
    area: '华语',
    limit?: 30,
    offset?: 1
}
复制代码

8.5 获取高质量歌单排行榜

说明 : 调用此接口 , 获取高质量歌单排行榜

必选参数 :

无
复制代码

接口地址 :

/top/quality/playlist
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
lasttime: 分页参数,取上一页最后一个歌单的 updateTime 获取下一页数据,默认为0
category: 分类
  可选类型： 所有,华语,欧美,韩语,日语,粤语,小语种,运动,ACG,影视原声,流行,摇滚,后摇,古风,民谣,轻音乐,电子,器乐,说唱,古典,爵士
复制代码

调用例子 :

GET /top/quality/playlist

@query
{
    category: '华语'
    limit?: 30,
    lasttime: 0,
}
复制代码

8.6 获取歌单排行榜

说明 : 调用此接口 , 获取歌单排行榜

必选参数 :

无
复制代码

接口地址 :

/top/playlist
复制代码

可选参数 :

order: 可选值为 'new' 和 'hot', 分别对应最新和最热 , 默认为 'hot'

category: ,分类，" 华语 "、" 古风 " 、" 欧美 "、" 流行 ", 默认为 "所有",可从歌单分类接口获取(/playlist/category/list)

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /top/playlist

@query
{
    order?: 'new',
    category?: '古风'
    limit?: 30,
    offset?: 1
}
复制代码

8.7 新歌榜单

说明 : 调用此接口 , 可获取新歌榜单

必选参数 :

无
复制代码

接口地址 :

top/songs
复制代码

可选参数 :

area:'所有' | '华语' | '欧美' | '日本' | '韩国 复制代码

调用例子 :

GET /top/songs

@query
{
    area: '华语'
}
复制代码

8.8 获取歌手榜

说明 : 调用此接口 , 获取歌手榜

必选参数 :

无
复制代码

接口地址 :

/toplist/artist
复制代码

可选参数 :

type: 数字，可选1-4
  1: '华语',
  2: '欧美',
  3: '日本',
  4: '韩国',
复制代码

调用例子 :

GET /toplist/artist

@query
{
   type: 2
}
复制代码

8.9 全部榜单内容摘要

说明 : 调用此接口 , 获取全部榜单内容摘要

必选参数 :

无
复制代码

接口地址 :

/toplist/detail
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / toplist / detail;
复制代码

8.10 榜单介绍

说明 : 调用此接口 , 可获取榜单介绍

必选参数 :

无
复制代码

接口地址 :

/toplist/introduction
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / toplist / introduction;
复制代码

9.视频模块

9.1 获取视频信息

说明 : 调用此接口 , 获取视频信息

必选参数 :

videoId：视频ID
复制代码

接口地址 :

/video/:videoId/detail
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /video/:videoId/detail

@query
{
    videoId: "***"
}
复制代码

9.2 获取视频分组列表

说明 : 调用此接口 , 获取视频分组列表

必选参数 :

无
复制代码

接口地址 :

/video/group/list
复制代码

可选参数 :

无
复制代码

调用例子 :

GET /video/group/list;
复制代码

9.3 获取视频分组下的视频

说明 : 调用此接口 , 获取视频分组下的视频

必选参数 :

groupId: 分组ID
复制代码

接口地址 :

/video/group/videos
复制代码

可选参数 :

resolution：分辨率，默认1080
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /video/group/videos

@query
{
    groupId: "***",
    resolution?: 1080,
    offset?: 1
}
复制代码

9.4 收藏｜取消收藏视频

说明 : 调用此接口 , 收藏｜取消收藏视频

必选参数 :

videoId：视频ID
actionType：操做类型，收藏："sub"，取消收藏: "unsub"
复制代码

接口地址 :

/video/:videoId/sub/:actionType
复制代码

可选参数 :

无
复制代码

调用例子 :

POST /video/:videoId/sub/:actionType

@query
{
    videoId: "***",
    actionType: "sub"
}
复制代码

9.5 获取视频 URL

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

videoIds: 视频ID，多个以逗号分隔
复制代码

接口地址 :

/video/urls
复制代码

可选参数 :

resolution：分辨率，默认1080
复制代码

调用例子 :

GET /video/urls

@query
{
    videoIds: "***,***",
    resolution?: 1080
}
复制代码

10.歌单模块

10.1 获取歌单分类列表

说明 : 调用此接口 , 获取歌单分类列表

必选参数 :

无
复制代码

接口地址 :

/playlist/category/list
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / playlist / category / list;
复制代码

10.2 建立歌单

说明 : 调用此接口 , 建立歌单

必选参数 :

name: 歌单名字，
privacy：0 为普通歌单，10 为隐私歌单
复制代码

接口地址 :

/playlist/create
复制代码

可选参数 :

无
复制代码

调用例子 :

POST /playlist/create

@query
{
    name: "***",
    privacy: 0
}
复制代码

10.3 删除歌单

说明 : 调用此接口 , 删除歌单

必选参数 :

pid：歌单ID
复制代码

接口地址 :

/playlist/delete
复制代码

可选参数 :

无
复制代码

调用例子 :

DELETE /playlist/delete

@body
{
    pid: "***"
}
复制代码

10.4 更新歌单描述

说明 : 调用此接口 , 更新歌单描述

必选参数 :

pid: 歌单ID
description: 描述
复制代码

接口地址 :

/playlist/des/update
复制代码

可选参数 :

无
复制代码

调用例子 :

PUT /playlist/des/update

@query
{
    pid: "***",
    description: "***"
}
复制代码

10.5 获取歌单详情

说明 : 调用此接口 , 获取歌单详情

必选参数 :

pid: 歌单ID
复制代码

接口地址 :

/playlist/detail
复制代码

可选参数 :

subNum:  歌单最近的 subNum 个收藏者
复制代码

调用例子 :

GET /playlist/detail

@query
{
    pid: "****",
    subNum?: 10
}
复制代码

10.6 获取热门歌单

说明 : 调用此接口 , 获取热门歌单

必选参数 :

无
复制代码

接口地址 :

/playlist/hot
复制代码

可选参数 :

无
复制代码

调用例子 :

GET / playlist / hot;
复制代码

10.7 更新歌单名

说明 : 调用此接口 , 更新歌单名

必选参数 :

pid: 歌单ID
name: 歌单名
复制代码

接口地址 :

/playlist/name/update
复制代码

可选参数 :

无
复制代码

调用例子 :

PUT /playlist/name/update

@query
{
    pid: "***",
    name: "***"
}
复制代码

10.8 订阅｜取消订阅歌单

说明 : 调用此接口 , 订阅｜取消订阅歌单

必选参数 :

pid: 歌单ID
actionType: 订阅：'subscribe' 取消订阅： 'unsubscribe'
复制代码

接口地址 :

/playlist/:pid/sub/:actionType
复制代码

可选参数 :

无
复制代码

调用例子 :

POST /playlist/:pid/sub/:actionType

@param
{
  pid: "***",
  actionType: "subscribe"
}
复制代码

10.9 获取歌单订阅者

说明 : 调用此接口 , 获取歌单订阅者

必选参数 :

pid: 歌单ID
复制代码

接口地址 :

/playlist/:pid/subscribers
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

GET /playlist/:pid/subscribers

@param
{
    pid: "***"
}
@query
{
    limit?: 30,
    offset?: 1
}
复制代码

10.10 更新歌单标签

说明 : 调用此接口 , 更新歌单标签

必选参数 :

pid: 歌单ID
tags: 歌单标签
复制代码

接口地址 :

/playlist/:pid/tags/update
复制代码

可选参数 :

limit : 返回数量 , 默认为 30
offset : 偏移数量，用于分页 ,  如 :( 页数 -1)*30, 其中 30 为 limit 的值,默认为 0
复制代码

调用例子 :

PUT /playlist/:pid/tags/update

@query
{
   pid: "***"
}
@body
{
    tags: "***"
}
复制代码

10.11 添加歌单歌曲

说明 : 调用此接口 , 添加歌单歌曲

必选参数 :

pid: 歌单ID
songIds：歌曲ID数组
复制代码

接口地址 :

/playlist/:pid/songs/add
复制代码

可选参数 :

无
复制代码

调用例子 :

POST /playlist/:pid/songs/add

{
   pid: "***"
}
@body
{
    songIds: ["***", "****"]
}
复制代码

10.12 删除歌单歌曲

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

pid: 歌单ID
songIds：歌曲ID数组
复制代码

接口地址 :

/playlist/:pid/songs/del
复制代码

可选参数 :

无
复制代码

调用例子 :

DELETE /playlist/:pid/songs/del

@param
{
   pid: "***"
}
@body
{
    songIds: ["***", "****"]
}
复制代码

10.13 更新歌单

说明 : 调用此接口 , 可获取专辑信息

必选参数 :

pid: 歌单ID
description：描述
tags：标签
复制代码

接口地址 :

/playlist/:pid/update
复制代码

可选参数 :

无
复制代码

调用例子 :

PUT /playlist/:pid/update

{
   pid: "***"
}
@body
{
    description: "***",
    tags: "***"
}
复制代码

结语

目前的实现的接口主要是这些，接口暂时未通过严格的测试，若有问题，请给我提 issue。贡献出来，是方便你们一块儿学习，禁止商用。下期预告，webpack 环境配置。关注个人微信公众号，共同成长。

@author: WaterMan

React hooks + Mobx + typescript + EggJs从0到1打造一款仿网易云音乐APP（一）

引言

工做原理

特别声明

EggJS 中间件实现

处理 cookie 中间件

错误处理中间件

包含接口

1.登陆模块

1.1 手机号登陆

1.2 邮箱登陆

1.3 初始化昵称

1.4 发送手机验证码

1.5 校验手机验证码

1.6 检测手机号码是否已注册

1.7 刷新登陆

1.8 获取登陆状态

1.9 退出登陆

2.用户模块

2.1 获取用户录音

2.2 删除用户云盘歌曲

2.3 获取用户云盘数据详情

2.4 获取云盘音乐列表

2.5 获取用户信息

2.6 获取用户电台

2.7 获取用户动态

2.8 获取用户粉丝

2.9 获取用户关注者

2.10 获取用户播放列表

2.11 获取用户播放记录

2.12 获取用户收藏计数

2.13 更新用户信息

2.14 获取用户操做记录

2.15 获取用户 FM

2.16 获取用户推荐电台节目

2.17 获取用户推荐 MV

2.18 获取用户推荐新歌

2.19 获取独家放送

2.20 获取用户推荐歌单

3.专辑模块

3.1 获取专辑动态信息

3.2 获取最新专辑

3.3 收藏｜取消收藏 专辑

3.4 获取收藏专辑列表

3.5 获取专辑信息

4.歌手模块

4.1 获取歌手列表

4.2 获取歌手简介

4.3 获取歌手信息

4.4 获取歌手专辑

4.5 获取歌手 MV

4.6 获取歌手 50 首流行歌曲

4.7 收藏｜取消收藏歌手

4.8 获取订阅歌手列表

5.评论模块

5.1 获取资源评论

5.2 获取资源热门评论

5.3 获取资源云村热评

5.4 点赞 ｜ 取消点赞 评论

5.5 发表资源评论

5.5 删除资源评论

5.6 回复资源评论

6.MV 模块

6.1 获取 MV 列表

6.2 获取 MV 详情

6.3 获取网易出品 MV

6.4 获取最新 MV

6.5 收藏 ｜ 取消收藏 MV

6.6 获取 MV 收藏列表

6.7 获取 MV URL

7.电台模块

7.1 获取电台 banner

7.2 获取电台非热门分类

7.3 获取电台推荐分类

7.4 获取电台分类列表

7.5 获取热门电台

7.6 获取付费电台

7.7 获取电台 24 小时节目榜

7.8 获取电台节目榜单

7.9 获取电台节目列表

3.3 收藏｜取消收藏专辑

5.4 点赞｜取消点赞评论

6.5 收藏｜取消收藏 MV

7.13 订阅｜取消订阅电台

9.4 收藏｜取消收藏视频

10.8 订阅｜取消订阅歌单