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贞

如上代码,仅供参考,如有问题,相互沟通,谢谢!

本文标签:

版权声明:若无特殊注明,本文皆为《Leek》原创,转载请保留文章出处。

本文链接:php+H5 将视频上传到七牛云 - https://pjax.cc/54.html

发表评论

电子邮件地址不会被公开。 必填项已用*标注

未显示?请点击刷新

允许邮件通知