我们已经准备好了,你呢?

2024我们与您携手共赢,助您领跑移动端创新增长!

  前言

  现如今,大部分带内容的网站或应用都有视频区了,不说是大厂平台,就连个人开发者也相继在自己网站或小程序上迭代出视频板块。那既然有了视频模块,除个性化推荐,智能审核等这种费钱又耗时的功能外(个人开发者暂缓)。最基本的视频上传,视频播放自然必不可少吧。

  既然要强调省钱,我当前不会对接点播服务了。毕竟为了有一定的审核和推荐功能,我打算做人工审核。那剩下的关于播放有一定的体验度,还得要用一下OSS了(还是要花一点嘛)。因为上传有现成的分片上传,播放有HLS流,以下着重讲关于视频播放的优化,上传部分就说一下思路哦。

  视频上传

  因为网站关于上传只有一些图片,所以只用了OSS的常规文件上传。但是视频,不说长视频,现在一些稍微几十秒的短视频动则几十兆上百兆,更别说高清的。而且早期的上传是放在服务端完成,所以当客户端提交大型文件时,不光nginx(413 Request Entity Too Large)和fpm会报错,到了OSS客户端调用也会报错(Allowed memory size of 268435456 bytes exhausted (tried to allocate 67108896 bytes))。

  开始是尝试在服务端改成分片上传,但是测试时发现,每次提交文件过来时都要先将视频本地化,存在服务器上后再分片提交到OSS,回调成功删除服务器文件,并且要调整nginx等的提交的最大值限制。最后就决定把上传部分放到了前端,服务器只提供OSS的临时访问凭证和接收上传成功回调。

  视频播放

  关于视频播放,网站早期的做法是将OSS的视频地址直接丢到前端的video标签中,当在手机播放时会出现卡顿或播放缓慢等问题。最后决定使用OSS的HLS的构建,就是在后台将视频推流一份在OSS的LiveChannel中,前端通过读取m3u8播放视频。

  思路:

  1. 前端上传视频,后台审核成功调用OSS的LiveChannel创建。

  2. 根据通道创建返回的推流地址和播放地址,存入数据库。

  3. 在服务端起一个进程用FFMPEG进行视频推流。

  4. 前端播放视频时选择m3u8的方式。

  示例代码:

  1. 前端

  2. 后端API层

  getRamPolicy(); return $result; } // 简单上传接口 public function uploadFile() { $files = request()->file(); $input['title'] = input('post.title'); $uploadFiled = $files['mf']; // 获取文件信息 $fileInfo = $uploadFiled->getInfo(); $oss = \oss\OssFactory::factory("AliOss"); $result = $oss->upload($uploadFiled, ""); //$width = getimagesize($imgUrl)[0]; //$height = getimagesize($imgUrl)[1]; return $result; } // 分片上传接口 public function multipartUpload() { $files = request()->file(); $input['title'] = input('post.title'); $uploadFiled = $files['mf']; $oss = \oss\OssFactory::factory("AliOss"); $result = $oss->multipartUpload(); return $result; } // 分段Push public function multionPush() { global $_W; global $_GPC; $fileArr = $_FILES['mf']; $title = $_GPC['title']; // 设置预览目录,上传成功的路径 $previewPath = "../shiping/"; $ext = pathinfo($fileArr['name'], PATHINFO_EXTENSION);//获取当前上传文件扩展名 $arrExt = array('3gp','rmvb','flv','wmv','avi','mkv','mp4','mp3','wav',); if(!in_array($ext,$arrExt)) { exit(json_encode(-1,JSON_UNESCAPED_UNICODE)); //视/音频或采用了不合适的扩展名! } else { //文件上传到预览目录 $previewName = 'pre_'.md5(mt_rand(1000,9999)).time().'.'.$ext; //文件重命名 $previewSrc = $previewPath.$previewName; if(move_uploaded_file($fileArr['tmp_name'],$previewSrc)){ // 上传文件操作,上传失败的操作 exit($previewName); } else { //上传成功的失败的操作 exit(json_encode(0,JSON_UNESCAPED_UNICODE)); } } } // 创建推流通道 public function putLiveChannel() { $oss = \oss\OssFactory::factory("AliOss"); $result = $oss->putLiveChannel('iphone8'); return $this->jsonData(200, 'ok', $result); } // 获取推流加签地址 public function getSignRtmpUrl() { $oss = \oss\OssFactory::factory("AliOss"); $params = array('params' => array('playlistName' => 'newest.m3u8')); $result = $oss->getSignRtmpUrl($params); return $this->jsonData(200, 'ok', $result); } // 获取推流上传通道历史记录 public function getLiveChannelHistory() { $oss = \oss\OssFactory::factory("AliOss"); //$params = array('params' => array('playlistName' => 'newest.m3u8')); $result = $oss->getLiveChannelHistory(); return $this->jsonData(200, 'ok', $result); } // 查询推流上传信息 public function getLiveChannelInfo() { $oss = \oss\OssFactory::factory("AliOss"); $result = $oss->getLiveChannelInfo(); return $this->jsonData(200, 'ok', $result); } // 查询m3u8的推流上传状态 public function getLiveChannelStatus() { $oss = \oss\OssFactory::factory("AliOss"); $result = $oss->getLiveChannelStatus(); return $this->jsonData(200, 'ok', $result); }}

  3. OSS操作层

个人开发的app上传视频(如何开发视频上传和播放功能时,既省钱又体验好?)

  4. 推流指令

  FFmpeg参数说明

  frame= 9753 fps= 30 q=-1.0 Lsize= 129340kB time=00:05:25.09 bitrate=3259.2kbits/s speed= 1x

  frame= 9753:表示拍摄的帧数为9753fps=246:表示每秒拍摄246张照片q=-1.0:表示视频的质量为-1.0,即质量较差Lsize= 129340kB:表示视频的大小为129340KBtime=00:05:25.09:表示视频的时长为5分25秒9毫秒bitrate=3259.2kbits/s:表示视频的码率为3259.2KB/sspeed=8.21x:表示视频的播放速度为8.21倍

  video:116301kB audio:12596kB subtitle:0kB other streams:0kB global headers:0kB muxing overhead: 0.344442%

  video:116301kB 视频数据量:116301kB;audio:12596kB 音频数据量:12596kB;subtitle:0kB 字幕数据量:0kB;other streams:0kB 其他数据量:0kB;global headers:0kB 全局数据头:0kB;muxing overhead: 0.344442% 多路复用开销:0.344442%

我们凭借多年的APP小程序开发经验,坚持以“个性定制 源码交付 独立部署 满意为止”为宗旨,累计为5000多家客户提供品质服务,得到了客户的一致好评。即刻开启你的小程序/APP,帮您轻松抢占千亿流量红利,助您轻松获客!
立即咨询: 13716188458 / 18588225959,助您抢占市场先机。项目经理在线

我们已经准备好了,你呢?

北京麦蒙科技有限公司与您携手共赢,助您领跑移动端创新增长

售前咨询
咨询电话

13716188458

18588225959

在线留言
扫码加微信
微信
在线留言
* 请输入姓名
* 请输入有效联系方式
请输入您的需求:
* 请输入需求
提交成功