7直播

在线教育平台

1. 直播课程

游戏直播、YY直播、公开课、教育平台、电商直播。

我们使用七牛云的直播云服务( 帮我们搭建好了直播服务器 )，一般一个直播项目就需要在直播云上面创建一个直播空间。

 

1.1 创建直播空间

设置直播空间名称和直播域名( 直播域名必须是通过ICP备案 和 国家公安局的备案8.24的规定 )

 

 

设置存储空间设置是否自动删除过期流

 

 

直播云服务的对象存储空间只设置是华北地区的，所以如果没有对象存储空间，则直接创建一个即可。

 

 

设置直播封面、直播超时和直播鉴权。

 

 

直播封面一般是我们平台自己定义的，而不是随机截图。

直播中断超时，可以根据自己的业务而定。

直播鉴权，其实就是一个token令牌字段，这个字段可以有效的防止外来用户私自使用我们的直播接口。

1.2 创建完成以后的直播空间

 

 

需要给生成的直播域名和播放直播的域名进行CNAME解析。

 

 

有了直播空间以后，我们就可以创建对应的直播流。直播需要使用对应的直播流。

 

 

 

 

创建完成以后，我们的直播方就可以使用obs直播软件把直播信息推送到我们的直播云服务器了。我们这里使用OBS-Studio 直播推流软件来完成。

 

 

上面就可以看到推流软件正在监控我们的屏幕和摄像头信息。

接下来，我们需要把直播信息推送到直播云服务器，则需要对软件进行配置。

 

 

URL指代的就是我们的直播空间的地址。

流名称就是直播云服务器的直播流名称。

对于上面两个信息的获取，我们可以通过直播云空间的直播流管理->流属性来查看。

 

 

 

上面蓝色背景的文字中，直播空间的URL地址：

rtmp://pili-publish.www.sinsea.cn/php-25

流名称：

edu-1?e=1506311121&token=UhYWJIgbXnIzPHiZdVCenSnWVksXLlOY4WBAYc91:mQjqsSPByZnysvZJQFzQBBYkKis=

 

e=过期时间戳&token=直播鉴权

 

把对应的直播URL地址和流名称复制进来，直接点击窗口下方的“确定”即可。

 

 

如果成功推流，则显示效果如下：

 

 

 

 

 

接下来，我们要把直播流的管理功能实现在我们自己的项目中。

1.3 创建直播流的数据表

使用数据迁移创建

 

 

代码：

 

 

执行数据迁移

 

 

效果：

 

 

1.4 创建数据模型

命令行：

 

 

代码：

直接把点播课程的模型代码复制过来。

 

 

1.5 创建对应的直播流的资源控制器和路由

1.5.1 创建资源控制器

 

 

代码：

直接把点播课程的控制器代码复制过来。调整如下：

1. use App\Models\Course;  改成 use App\Models\LiveStream;
2. CourseController 改成 LiveStreamController
3. “点播课程” 改成 “直播流”
4. “admin.course”改成 “admin.livestream”
5. “Course $course”改成“LiveStream $livestream”
6. “$course”改成 “$livestream”
7. “unique:course”改成“unique:live_stream”
8. “course_name”改成“stream_name”
9. 直播流是不能被删除的，所以destroy方法中的代码移除掉。

   

 

1. 去掉 “with('profession')”

1.5.2 创建直播流的路由地址

 

 

在AuthTableSeeder.php中创建和分配对应的权限。

 

 

执行数据迁移

 

 

注意，我们需要给当前管理员对应的角色分配当前直播流管理的权限

 

1.6 直播流的管理

1.6.1 直播流列表

1.6.1.1 引入视图

我们直接把点播课程的列表页视图复制过来。

 

 

调整视图代码，如下：

1. “点播课程”改为“直播流”
2. “course_”改为“livestream_”
3. “admin/course”改为“admin/stream”
4. 修改dataTables

   表头：

   

 

   js：

   

  

 

 

 

 

1.6.2 添加直播流

1.6.2.1 显示添加页面

因为直播流的添加只需要设置三个字段，而且没有图片，所以我们可以直接使用权限的添加页面。

 

 

调整代码如下：

1. “权限”改为 “直播流”
2. “admin/auth”改为 “admin/stream”
3. “auth-add”改为“stream-add”

代码：

 

 

js：

 

 

1.6.2.2 控制器接收数据

控制器，代码：

 

 

生成鉴权信息

 

 

接下来，我们使用cURL的封装工具类guzzlehttp发送Http请求给七牛云直播服务器。

1.6.2.3 安装guzzlehttp

 

 

guzzlehttp的使用：

 

 

发送http请求，把新建的直播流同步到七牛云直播服务器上。

 

 

 

1.7 直播课程的管理

1.7.1 使用数据迁移创建直播课程的数据表

 

 

代码：

 

 

执行数据迁移

 

 

1.7.2 创建直播课程的数据模型

 

 

代码：

直接把点播课程的模型代码复制过来

 

 

1.7.3 创建资源控制器

命令行：

 

 

代码：

把点播课程的内容直接复制过来，修改如下

1.  use App\Models\Course;  改成 use App\Models\LiveCourse;

2.  CourseController 改成 LiveCourseController

3. “点播课程” 改成 “直播课程”

4. “admin.course”改成 “admin.livecourse”

5. “Course $course”改成“LiveStream $livestream”

6. “$course”改成 “$livecourse”

7. “unique:course”改成“unique:live_course”

修改完成上面的代码以后，接下来，我们创建和分配对应的权限给当前管理员对应的角色。

1.7.4 设置直播课程的路由

web.php路由：

 

 

在AuthTableSeeder.php文件中，声明直播课程的相关权限。

代码：

 

 

执行数据填充

 

 

配分完成当前管理员的对应角色权限以后，访问直播课程的列表页。

 

 

1.7.5 调整列表页的代码

接下来，我们把点播课程的列表页视图复制过来。调整如下：

1. “点播课程”改为“直播课程”

2. “course_”改为“livecourse_”

3. “admin/course”改为“admin/live”

4.  修改dataTables

    表头：

   

 

   js:

   

 

效果：

 

 

 

1.7.6 添加直播课程

我们直接把专业的添加页面复制过来。

 

 

代码：

调整如下：

1. “添加专业”改为“添加直播课程”
2. “admin/profession” 改为“admin/live”
3. “profession-add”改为“livecourse-add”
4. “专业名称”改为“课程名称”
5. “专业分类”改为“所属专业”
6. 去掉zyupload的相关HTML代码和js代码。

代码：

 

 

纠正：

  1. 把“直播开始时间”，第二个改为“直播结束时间”

  2. 前面误删了“webuploader.css”文件

  3. 把“cate_id”改成“pro_id”

  

 

  4.

  

 

效果：

 

 

接下来，完善选择老师，专业和直播流的多弹窗选择功能。

 

 

视图代码：

 

 

路由代码：

 

 

控制器代码：

 

 

对应的其他三个视图文件，则分别修改如下：

选择授课老师：

 

 

选择直播流：

 

 

选择专业：

 

 

接下来，我们修改下直播开始时间和直播结束时间的输入框类型。

 

 

效果：

 

 

接下来就成功提交数据到后台控制器接收，

控制器LiveCourseController@store，代码：

 

 

 

模型：

 

 

列表页视图代码：

 

 

 

效果：

 

 

1.7.7 生成推流和拉流地址

视图：

 

 

路由：

 

 

控制器：

 

 

效果：

 

 

 

我们后台生成了推流地址和拉流地址以后，那么管理员就可以通过点击对应的按钮，发送邮件/短信通知直播方，直播的时间、信息以及直播地址。

1.8 Laravel中发送短信和邮件

Laravel中，我们这里使用PHPSMS的短信发送类来发送短信。

安装phpsms短信发送安装包

 

 

在配置文件中，把安装注册到项目中。

 

 

 

生成配置文件

 

 

打开生成的配置文件config/app.php

这里，我使用的是阿里云的短信服务。

 

 

把阿里云的服务名添加到短信发送类的配置中。

 

 

 

 

 

1.8.1 在项目中使用phpsms发送短信

 

 

1.8.2 在项目中使用Mail门面发送短信

在Laravel内置了一个安装包，我们可以直接使用安装包提供的邮件发送类即可，发送邮件。

我们要使用邮件发送功能，只需要在.env或者config/mail.php文件中，配置好发送邮件的帐号即可。

对于邮件发送，一般大家都是在mail.php里面配置即可。我这里为了演示，我们直接在.env文件中配置。

.env文件的配置：

 

 

1.8.3 在项目中发送邮件

 

 

2. 前台显示直播信息

2.0.1 首页输出直播信息

判断直播的状态：

直播未开始  time() < $start_at 

直播中      time() > $start_at  && time() < $end_at

直播已结束  time() > $end_at

控制器：

 

 

视图：

 

 

路由：

 

 

效果：

 

 

点击进入直播详情，效果：

控制器：

 

 

2.0.2 显示视图

 

 

调整样式

把“href="/css” 改成“href="{{ asset('home') }}/css”

同上，css和js一样，找到对应标签进行批量修改。

同时，去掉 .videoBody-top中的所有关于web播放器和课时列表内容。

效果：

 

 

接下来，我们就在黑色区域显示我们直播的视频信息。可以通过ckplayer播放器来显示。

ckplayer播放器，依赖于http协议，所以要使用必须在www目录下面访问。

使用这个ckplayer首先引入静态资源。

<script src="ckplayer/ckplayer.js" charset="utf-8"></script>

接下来需要在页面中声明一个视频播放器的容器标签，然后实例化播放器。

 

 

效果：

 

 

 

xls数据表格的导入导出试题