php+H5 将视频上传到七牛云
首先在头部加载七牛的js
<script src="https://unpkg.com/qiniu-js@2.2.1/dist/qiniu.min.js"></script>
然后在html页面中相应的位置添加一下视频上传控件
<input id="video" class="audio-input" type="file" accept="video/*" >
这里需要在后端加载七牛的sdk获取下token
use Qiniu\Auth;
use Qiniu\Storage\UploadManager;
public function pushOp(){
//header("Access-Control-Allow-Origin: *");
$accessKey = '参数key';
$secretKey = '参数key';
// 加载七牛的sdk
require_once BASE_ROOT_PATH.'/application/control/qiniu/autoload.php';
// 构建鉴权对象
$auth = new Auth($accessKey, $secretKey);
// 要上传的空间
$bucket = '七牛空间名称';
// 生成上传 Token
$token['token'] = $auth->uploadToken($bucket);
$token['domain'] = 'cdn域名';
$token['url'] = 'http://up.qiniup.com/';
// return $token;
echo json_encode(array('msgCode'=>1,'msg'=>'成功','data'=>$token));
}
最后js上传到七牛云的服务
<script type="text/javascript">
$("#video").on("change", function (ev) {
if (!this.files[0]) return;
file = this.files[0];
sendVideo(file);
});
function sendVideo(file) {
var suffix = file.name.split(".");
suffix = "." + suffix[suffix.length - 1];
var observable = qiniu.upload(file, new Date().getTime() + suffix, '{$token}'); //这里需要获取七牛的token 在后端获取传到前台
var subscription = observable.subscribe(function (ret) {
loadingToast("上传中"+parseInt(ret.total.percent)+"%...");
}, function (err) {
mui.alert("视频上传异常!");
$(".mask").hide();
}, function (ret) {
//上传完成后继续业务逻辑
hidemod("loadingToast");
$(".showvideo").html("<video width='90%' src='http://rrdd.chuangya001.com/"+ret.key+"' controls='controls' style='background-color:#000;margin:5%;' poster='http://rrdd.chuangya001.com/"+ret.key+"?vframe/jpg/offset/2'></video>");
$("#vediosrc").val("http://rrdd.chuangya001.com/"+ret.key);
$('.showvideo').show();
});
}
</script>
到这里 已经可以把视频上传到七牛空间了,完成后他会返回外链,剩下的就是继续你的业务流程;
七牛支持自动切片功能,在返回的外链后拼接参数可当视频封面使用 如下:
URL: http://aaaa.mp4?vframe/jpg/offset/2 后门的2 代表第2贞
如上代码,仅供参考,如有问题,相互沟通,谢谢!