程序介绍
```
```
【JS部分】
```
服务器或本地可以访问 ``http://你的IP地址/admin/start`` 查看该页面
## 四、根据业务逻辑完善前端功能
### 1. 注册
> 注册功能我们需要用到WxPusher的**关注回调**功能，当用户关注主题后，会把该用户的基本信息发送到指定链接。
**1.1** 注册 WxPusher
打开[WxPusher后台](https://wxpusher.zjiecode.com/admin/login)扫码登录，如没有注册账号，扫码自动注册。
**1.2** 创建新的应用
**1.3** 妥善保存你的APPToken
在WxPusher后台->应用管理->appToken 拿到你的授权码，调用WxPusher的API时候，需要用到这个appToken。
**1.4** 保存关注应用的链接
在WxPusher后台->应用管理->关注应用 得到你的关注链接。点击[这里](https://wxpusher.zjiecode.com/docs/#/?id=%e7%94%a8%e6%88%b7%e5%85%b3%e6%b3%a8%e5%9b%9e%e8%b0%83)查看用户关注回调的详细介绍。
> 你也可以通过发送这个链接给用户，用户通过这个链接，可以看到应用的相关介绍并直接关注应用。
>
> 用户关注应用后，WxPuhsher会回调UID给开发者，开发者可通过UID发送消息给用户。
**1.5** 编写注册API
在`Live.php`新建reg方法
> 这里的``Db::table('users')``可以直接用模型`User`代替：``User::where($userinfo)->find();``
```php
// 注册 通过WxPusher的关注回调来注册
public function reg()
{
$data = Request::instance()->param('data'); // 获取回调数据
$userinfo = [
'uid' => $data['uid'],
'username' => $data['userName'],
'user_head_img' => $data['userHeadImg']
];
$hasreg = Db::table('users')->where($userinfo)->find(); // 是否注册过
if(!isset($hasreg)){ // 没注册过的话就保存用户数据
$res = Db::name('users')->save($userinfo);
}
return json([
'code' => 1,
'msg' => 'success',
'data' => $data
]);
}
```
**这样用户先关注【新消息服务】服务号，点击你的关注链接就可以关注你的主题，并且个人信息也会保存到你的数据库中。**
### 2. 用户和关注房间展示
> 已经成功关注应用的用户可以在新消息服务->我的->我的订阅->微信推送斗鱼直播提醒->设置 打开我们配置的前端index页面
**2.1** 前端调用接口获取用户信息和房间数据
layui表格渲染的时候，会调用`/live/getuserinfo`，返回数据渲染到表格中。
我们需要获取的内容包括
- 用户基本信息
- 用户关注的房间基本信息
- 用户对于该房间开播或者更换标题是否接受通知
在`Live.php`新建`getuserinfo`方法
> 注意：可以直接返回`$user_info`，因为我们已经配置了模型，`Users`模型里包含用户基本信息和他在`UserRoom`的内容，而`UserRoom`里又包含`Rooms`的内容。然后在前端解析`$user_info`。
```php
// 获取用户信息和关注列表
public function getuserinfo()
{
$uid = Request::instance()->param('uid');
$user_info = Users::where('uid', $uid)->find(); // 找到用户
$userroom = $user_info->rooms; // 获取UserRoom的数据
$temp_list = [];
foreach ($userroom as $um) {
//$um->detial获取房间详细数据，拼接$um的两个字段
$detial = $um->detial;
$detial['live_msg'] = $um['live_msg'];
$detial['change_name_msg'] = $um['change_name_msg'];
array_push($temp_list, $detial);
}
$data = [
'user_info' => $user_info,
'user_guanzhu' => $temp_list
];
return json([
'code' => 1,
'msg' => 'success',
'data' => $data
]);
}
```
回调结果：
> 以下数据为我以前本地测试的数据，如下所示，user_info中就已经包含我们需要的所有数据，所以我们可以直接让后端返回`User`再到前端进行解析需要的数据到表格中。、
> 但是在没有添加房间之前我们还无法获取这些房间数据所以可以添加一些假数据在数据库里。
```json
{
"user_info":{
"id":13,
"uid":"UID_xxxxxxxxxxxx",
"username":"shmily",
"user_head_img":"http://thirdwx.qlogo.cn/mmopen/xxx/132",
"max_room":5,
"current_room":3,
"create_time":"2021-02-21 16:04:52",
"update_time":"2021-03-10 20:24:19",
"rooms":[
{
"id":17,
"uid":"UID_8nnpkmRZVfTtXcM6ZN59EndFvAfF",
"room_id":"71415",
"live_msg":1,
"change_name_msg":1,
"create_time":"2021-03-23 19:03:22",
"detial":{
"room_id":"71415",
"room_name":"3月13日上午10点直播",
"room_status":1,
"start_time":"2021-03-13 09:53:27",
"owner_name":"寅子",
"create_time":"2021-03-13 09:55:42",
"live_msg":1,
"change_name_msg":1
}
},
{
"id":18,
"uid":"UID_8nnpkmRZVfTtXcM6ZN59EndFvAfF",
"room_id":"99999",
"live_msg":1,
"change_name_msg":1,
"create_time":"2021-03-23 19:13:33",
"detial":{
"room_id":"99999",
"room_name":"毕业的好日子，康姆了康姆了！",
"room_status":2,
"start_time":"2021-03-12 20:22:11",
"owner_name":"旭旭宝宝",
"create_time":"2021-03-13 02:57:01",
"live_msg":1,
"change_name_msg":1
}
},
{
"id":25,
"uid":"UID_8nnpkmRZVfTtXcM6ZN59EndFvAfF",
"room_id":"4615502",
"live_msg":1,
"change_name_msg":1,
"create_time":"2021-03-23 19:03:23",
"detial":{
"room_id":"4615502",
"room_name":"~啾咪~哈哈哈哈~",
"room_status":2,
"start_time":"2021-03-12 18:13:25",
"owner_name":"一条小团团OvO",
"create_time":"2021-03-13 00:40:01",
"live_msg":1,
"change_name_msg":1
}
}
]
},
"user_guanzhu":[
{
"room_id":"71415",
"room_name":"3月13日上午10点直播",
"room_status":1,
"start_time":"2021-03-13 09:53:27",
"owner_name":"寅子",
"create_time":"2021-03-13 09:55:42",
"live_msg":1,
"change_name_msg":1
},
{
"room_id":"99999",
"room_name":"毕业的好日子，康姆了康姆了！",
"room_status":2,
"start_time":"2021-03-12 20:22:11",
"owner_name":"旭旭宝宝",
"create_time":"2021-03-13 02:57:01",
"live_msg":1,
"change_name_msg":1
},
{
"room_id":"4615502",
"room_name":"~啾咪~哈哈哈哈~",
"room_status":2,
"start_time":"2021-03-12 18:13:25",
"owner_name":"一条小团团OvO",
"create_time":"2021-03-13 00:40:01",
"live_msg":1,
"change_name_msg":1
}
]
}
```
> 获取到用户数据后我们首先把用户的可添加房间数和最大可添加房间数存到了session中
> ```
> sessionStorage.setItem('current_room', user_info['current_room']);
sessionStorage.setItem('max_room', user_info['max_room']);
> ```
> 然后给表格赋初始数据（代码在上面js部分）
> 最后把用户头像和用户名展示在页面上
> ```
> $("#nickname").html(user_info['username']);
$("#headimg").attr("src", user_info['user_head_img']);
$("#addroom").html("添加 " + user_info['current_room'] + "/" + user_info['max_room']);
> ```
### 3. 添加房间
> 添加房间之前我们需要通过斗鱼的API判断房间是否存在获取房间的基本信息，然后把基本信息存入数据库中，判断是否超过添加上限，不超过的话用户房间关联表添加一行，用户的已添加房间数加一。
> 我们在前端调用斗鱼api接口的话首先需要解决跨域问题，不然调用接口就会报错。
> 我们可以通过[配置代理的方式解决跨域问题](https://blog.csdn.net/example440982/article/details/81319106) 修改vhost文件``ProxyPass /room http://斗鱼第三方API自行百度/room``，这样我们就可以通过 ``/room/房间号``来获取房间信息。
>
> 因为斗鱼第三方API好像是没公布，所以需要的小伙伴可以自行百度，有些结果里面有这个api。
> 可以在这里先判断用户是否还可以添加房间，因为上一步返回的User信息里面已经有当前用户最大房间数和已添加的房间数了。
> ``
`` 因为头部工具栏的按钮中`lay-event`属性为`add`，所以我们可以通过以下方法设置点击事件。（顺便给删除按钮的点击事件占个坑）
```
//头工具栏事件
table.on('toolbar(test)', function (obj) {
if (obj.event == 'add') {
let max_room = sessionStorage.getItem('max_room');
let current_room = sessionStorage.getItem('current_room');
// 在前端先判断是否可以继续添加房间（为了防止用户修改数据，后端也会进行一次判断）
if (current_room >= max_room) {
layer.msg('可添加房间已达上限', { time: 1500 });
return
}
layer.prompt({ title: '添加房间' }, function (val, index) {
// 调用斗鱼接口获取房间信息
$.ajax({
url: '/room/' + val,
success: function (data) {
if (data.error == 0) {
let live_name = data.data.owner_name;
// 插入数据
$.ajax({
url: '/live/addroom',
method: 'POST',
data: {
'uid': uid,
'roomid': data.data.room_id,
'roominfo': data.data
},
success: function (data) {
layer.close(index);
render_table();
layer.msg(data.msg, { time: 1500 });
},
error: function (e) {
console.log(e);
}
});
} else {
layer.msg('未找到该房间', { time: 1000 });
}
},
error: function (e) {
console.log(e);
layer.msg('未找到该房间', { time: 1000 });
}
});
});
}
if (obj.event == 'feedback') {}
});
```
后端添加房间的方法：在`Live.php`中新建`addroom`方法：（逻辑有点混乱 - 。-）
```
// 添加房间
public function addroom()
{
$uid = Request::instance()->param('uid');
$roomid = Request::instance()->param('roomid');
$roominfo = Request::instance()->param('roominfo');
// 判断用户
$user_info = Users::where('uid', $uid)->find();
$maxroom = $user_info->max_room; // 该用户的最大可添加房间数
$currentroom = $user_info->current_room;// 当前已添加的房间数
if ($currentroom >= $maxroom) {
return json([
'code' => 0,
'msg' => '您的房间添加上限为'.$maxroom,
'data' => '您的房间添加上限为'.$maxroom
]);
} else {
// 是否在数据库中存在房间信息
$hasroom = Rooms::where('room_id',$roomid)->find();
if(!isset($hasroom)){
// 以前没添加过该房间，就添加
$res = Rooms::strict(false)->insert($roominfo);
}
$data = [
'uid' => $uid,
'room_id'=> $roomid
];
// 是否以前添加过该房间添加user_room
$has_user_room = UserRoom::where($data)->find();
if (isset($has_user_room)){
return json([
'code' => 0,
'msg' => '已经加过该房间',
'data' => '已经加过该房间'
]);
} else {
$res = UserRoom::insert($data);
// 用户已添加的房间数加一
$user_info->inc('current_room')->update();
return json([
'code' => 1,
'msg' => '添加成功，下次开播就可以收到提醒啦',
'data' => $currentroom
]);
}
}
}
```
### 4. 删除房间
> 删除房间比添加房间更简单。
> 如果我们在返回房间数据的时候，顺便把user_room表的id也返回的话，我们可以直接删除该id记录就可以。
> ```
> foreach ($userroom as $um) {
> //$um->detial获取房间数据，拼接$um的两个字段
> $detial = $um->detial;
> // 把用户房间关联表对应的主键也加到房间详情里。
> $detial['user_room_id'] = $um['id'];
> $detial['live_msg'] = $um['live_msg'];
> $detial['change_name_msg'] = $um['change_name_msg'];
> array_push($temp_list, $detial);
> }
> ```
删除按钮的点击事件：
```
//监听行工具事件【删除】
table.on('tool(test)', function (obj) {
var data = obj.data; // data 保存点击的行数据
if (obj.event === 'del') {
layer.confirm('真的删除该行数据么', function (index) {
$.ajax({
url: '/live/deletetroom',
data: {
'uid': uid,
'roomid': data.room_id // 这里可以直接返回 'id': data.id 即关联表的主键
},
success: function (data) {
layer.closeAll();
render_table();
layer.msg('删除成功', { time: 1000 })
},
error: function (e) {
console.log(e);
}
});
});
}
});
```
控制器添加`deletetroom`方法
```
// 删除房间
public function deletetroom()
{
$uid = Request::instance()->param('uid');
$roomid = Request::instance()->param('roomid');
$res = UserRoom::where(['uid'=>$uid, 'room_id'=>$roomid])->delete(); // 删除房间
if($res){
$user_info = Users::where('uid', $uid)->find();
$user_info->dec('current_room')->update(); // 已添加房间数减一
}
// 判断是否还有人关注这个房间 是否需要同时删除房间信息
$hasroom = UserRoom::where('room_id',$roomid)->find();
if(!isset($hasroom)){
Rooms::where('room_id', $roomid)->delete();
}
return json([
'code' => 1,
'msg' => 'success',
'data' => $res
]);
}
```
### 5. 用户反馈
> 这个和添加房间的内容差不多，但是更精简就只是向数据库存数据
前端点击事件（还记得我们前面给这个方法留的位置吗）
```
if (obj.event == 'feedback') {
//默认prompt
layer.prompt({ formType: 2, title: '意见反馈' }, function (val, index) {
$.ajax({
url: '/live/userfeedback',
data: {
'uid': uid,
'user_feedback': val
},
success: function (data) {
layer.close(index);
layer.msg('感谢反馈', { time: 1000 });
},
error: function (e) {
console.log(e);
}
});
});
}
```
控制器新建`userfeedback`方法
```
// 用户反馈
public function userfeedback()
{
$data = Request::param(false);
$res = Db::name('user_feedback')->save($data);
return json([
'code' => 1,
'msg' => 'success',
'data' => $res
]);
}
```
### 6. 是否接受消息
> 云函数获取数据库中需要推送消息的用户时候，会同时判断用户设置的接受消息的状态是否为“是”。
> 在用户前端，用户通过点击switch开关，发送ajax请求来改变字段的值。
前端：
```html
【表格渲染】
, { field: 'live_msg', title: '提醒开播', width: 90, templet: '#switchLive', unresize: true }
, { field: 'change_name_msg', title: '提醒标题', width: 90, templet: '#switchChangeName', unresize: true }
【body里面添加】
```
> ``obj.elem.checked ? 1 : 0``：判断当前switch按钮是开还是关，如果是开就返回 1
> `this.name`：点了哪个switch按钮，他返回的是`input`标签的`name`属性值。
```js
form.on('switch(switchFunc)', function (obj) {
$.ajax({
url: '/live/switchmsg',
data: {
'uid': uid,
'roomid': this.value,
'action': this.name,
'value': obj.elem.checked ? 1 : 0
},
success: function (data) {
layer.msg('切换成功', { time: 1000 })
},
error: function (e) {
console.log(e);
}
});
});
```
后端部分：新建`switchmsg`方法
```php
// 转换
public function switchmsg()
{
$uid = Request::instance()->param('uid');
$roomid = Request::instance()->param('roomid');
$action = Request::instance()->param('action');
$value = Request::instance()->param('value');
$res = UserRoom::where([
'uid' => $uid,
'room_id'=> $roomid
])->update([$action => $value]);
return json([
'code' => 1,
'msg' => 'success',
'data' => $res
]);
}
```
## 五、云函数的开发
> 云函数我们使用腾讯云函数作为示例，阿里云也同理。（阿里云似乎是不允许触发器的触发周期低于1分钟）
### 1. 注册腾讯云
[官方的注册方法](https://cloud.tencent.com/register?s_url=https%3A%2F%2Fcloud.tencent.com%2F)
### 2. 创建云函数
- 登录腾讯云，在云产品里找到云函数，在【函数服务】里新建云函数
- 选择【自定义创建】
- 修改【函数名称】、【地域】、【运行环境（Python3.6）】、【提交方法（在线编辑）】、【执行方法（`index.main_handler`）】暂时不用修改默认代码。
- 点击完成
### 3. 完善功能
首先引入需要的包
- `requests` 用于发送请求
- `json` 格式化请求的参数或获取的相应内容
- `logging` 有时候需要打印日志查看（腾讯云的默认日志级别是`info`，我们需要把它的级别调整为`error`来屏蔽掉我们不需要的输出）
```
# -*- coding: utf8 -*-
import requests
import json
import logging
import time
# 调整日志级别
logger = logging.getLogger()
logger.setLevel(logging.ERROR)
```
#### 3.1 根据房间号获取直播状态
> 首先我们就需要获取数据库中全部的房间并且通过斗鱼的api来获取此时的直播间状态。
>
> 当未找到该房间的时候会返回404，因为我们在前端已经做了一次判断，这里其实就不需要再加上404判断了。
> 之后我们需要判断它返回的是不是我们需要获取的内容，最后返回这个房间的信息。
获取到房间后我们就需要通过斗鱼的第三方API获取到此时当前房间信息：
````python
# 根据房间号获取直播状态
def getRoomInfoById(room_id):
url = 'http://斗鱼第三方Api/room/' + room_id
try:
r = requests.get(url, timeout=5)
except requests.exceptions.RequestException as e:
print(str(e))
return 'timeout'
else:
if r.status_code == 404:
return '404'
json_str = json.loads(r.text)
if isinstance(json_str, dict):
if 'error' in json_str.keys() and json_str['error'] == 0:
room_info = json_str['data']
return room_info
````
#### 3.2 获取数据库中的全部房间
获取房间：返回当前数据库中所有的房间信息
```python
def getAllRooms():
time.sleep(0.1)
url = 'http://你的服务器IP/live/getallrooms'
try:
r = requests.get(url, timeout=1)
if r.status_code == 200:
json_str = json.loads(r.text)
rooms = json_str['data']
return rooms
except requests.exceptions.ConnectionError as e:
logger.error(e)
```
后端部分：
```PHP
// 获取全部房间 不需要创建时间和修改时间字段
public function getallrooms()
{
$rooms = Rooms::select()->hidden(['create_time', 'update_time']);
return json([
'code' => 1,
'msg' => 'success',
'data' => $rooms
]);
}
```
#### 3.3 使用WxPusher给指定用户发送消息
我们在第四章第一节中简单介绍了`WxPusher`的注册和关注方法，这里说一下如何给用户发送消息
用户在关注应用后，我们可以在数据库中获取到用户的`UID`。通过UID我们就可以给用户发送消息。
以下是官方api介绍：
> POST接口 POST接口是功能完整的接口，推荐使用。
>
> Content-Type:application/json
>
> 地址：http://wxpusher.zjiecode.com/api/send/message
>
> 请求数据放在body里面，具体参数如下：
```
{
"appToken":"AT_xxx",
"content":"Wxpusher祝你中秋节快乐!",
"summary":"消息摘要",//消息摘要，显示在微信聊天页面或者模版消息卡片上，限制长度100，可以不传，不传默认截取content前面的内容。
"contentType":1,//内容类型 1表示文字 2表示html(只发送body标签内部的数据即可，不包括body标签) 3表示markdown
"topicIds":[ //发送目标的topicId，是一个数组！！！，也就是群发，使用uids单发的时候， 可以不传。
123
],
"uids":[//发送目标的UID，是一个数组。注意uids和topicIds可以同时填写，也可以只填写一个。
"UID_xxxx"
],
"url":"http://wxpusher.zjiecode.com" //原文链接，可选参数
}
```
根据这个接口，我们就可以编写函数：
> `content`：我们要发送的内容。
>
> `uids`：要发送的用户列表
```python
def send_WxPusher_msg(content, uids):
headers = {
'Content-Type': 'application/json'
}
url = 'http://wxpusher.zjiecode.com/api/send/message'
parameter = {
"appToken": "你的appToken",
"content": content,
"contentType": 1,
"uids": uids,
}
r = requests.post(url=url, headers=headers,
data=json.dumps(parameter, ensure_ascii=False).encode('utf-8'))
json_str = json.loads(r.text)
# 获取异常用户，包括关闭通知、取消服务号订阅的
datas = json_str['data']
for data in datas:
if data['code'] == 1001:
logger.error(data['status'])
```
#### 3.4 根据房间号获取接受某项提醒的用户
如果该直播间开播了，或者直播间更换了房间标题（如果和以前保存的房间数据不一样），我们就需要发送消息通知需要通知用户：
> `room_id`：需要提醒的房间号
>
> `action`：提醒的行为（开播或者更换标题）
>
> 返回符合条件的用户列表
```
def getUsersByRoomId(room_id, action):
url = 'http://你的服务器IP/live/getusersbyroomid'
data = {
'room_id': room_id,
'action': action
}
try:
r = requests.post(url, data=data, timeout=1)
if r.status_code == 200:
json_str = json.loads(r.text)
users = json_str['data']
return users
except requests.exceptions.ConnectionError as e:
logger.error(e)
```
后端：
> `action`：保存的就是数据库中是否提醒开播、是否提醒更换标题两个字段。所以我们只返回这两个字段为**1**，也就是设置提醒的用户UID。
```php
// 根据房间号获取关注用户
public function getusersbyroomid()
{
$room_id = Request::instance()->param('room_id');
$action = Request::instance()->param('action');
$users = UserRoom::where(['room_id'=>$room_id, $action => 1])->column('uid');
return json([
'code' => 1,
'msg' => 'success',
'data' => $users
]);
}
```
#### 3.5 改变房间状态
> 如果从斗鱼获取的当前房间的信息和数据库中的信息不一致，我们就需要修改数据库中的房间信息。
```
def changeStatus(roominfo):
time.sleep(0.01)
url = 'http://你的服务器IP/live/changestatus'
headers = {'Content-Type': 'application/json'}
data = {
'room_id': roominfo['room_id'],
'room_name': roominfo['room_name'],
'room_status': roominfo['room_status'],
'start_time': roominfo['start_time'],
'owner_name': roominfo['owner_name'],
}
try:
r = requests.post(url, headers=headers, data=json.dumps(data, ensure_ascii=False).encode('utf-8'), timeout=1)
if r.status_code != 200:
logger.error(r.text)
except requests.exceptions.ConnectionError as e:
logger.error(e)
```
后端方法：
```php
// 更改房间状态
public function changestatus()
{
// $roominfo = Request::post();
$room_id = Request::instance()->param('room_id');
$room_name = Request::instance()->param('room_name');
$room_status = Request::instance()->param('room_status');
$start_time = Request::instance()->param('start_time');
$owner_name = Request::instance()->param('owner_name');
$room = Rooms::where('room_id', $room_id)->find();
$room->room_name = $room_name;
$room->room_status = $room_status;
$room->start_time = $start_time;
$room->owner_name = $owner_name;
$room->save();
return json([
'code' => 1,
'msg' => 'success',
'data' => $room_id
]);
}
```
#### 3.6 整合以上功能开发主方法
**终于最后一步啦**
> 整合方法，我们此时就可以写小程序的主方法`main_handler`
```
def main_handler(event, context):
rooms = getAllRooms()
for room in rooms:
curr_info = getRoomInfoById(room['room_id'])
if curr_info == 'timeout':
logger.error('Error Timeout:' + str(room['room_id']))
continue
# 1. 是否开播的判断
if curr_info['room_status'] == '1': # 正在直播
if room['room_status'] == 2: # 之前状态为 未开播
content = '您关注的主播：' + curr_info['owner_name'] + '开始直播啦' + \
'\n房间标题：' + curr_info['room_name'] + \
'\n正在直播：' + curr_info['cate_name']
uids = getUsersByRoomId(room['room_id'], 'live_msg') # 获取UIDs
if uids: # 排除空列表
send_WxPusher_msg(content, uids)
changeStatus(roominfo=curr_info)
else: # 没有直播
if room['room_status'] == 1: # 之前状态为 正在直播
changeStatus(curr_info)
# 2. 对房间标题判断
if curr_info['room_name'] != room['room_name']:
content1 = '您关注的主播：' + curr_info['owner_name'] + '改变了房间标题' + \
'\n当前房间标题：' + curr_info['room_name'] + \
'\n上次房间标题：' + room['room_name']
uids = getUsersByRoomId(room['room_id'], 'change_name_msg') # 获取UIDs
if uids: # 排除空列表
send_WxPusher_msg(content1, uids)
changeStatus(roominfo=curr_info)
```
**到这就基本全部完成啦~**