php腾讯云+视频上传失败,腾讯云视频上传和播放尝试总结

项目中需要用到腾讯云视频，做了一个完整的流程尝试，总结一下。

基本需求是通过后台管理页面上传视频，然后通过网页，Android和iOS播放视频。

腾讯视频分三大部分：视频上传，视频处理，视频播放，相应都有很多SDK和备选功能，特别是视频处理功能非常多。

1. 准备工作

腾讯云账号首先必须认证，然后申请AppId和相应的密钥

image.png

最后要说腾讯云视频点播是需要付费的，免费的笔者测试了一个视频，有时候刷新播放的时候会超时。

2. 上传视频

上传视频可以直接在腾讯云的视频中心上传，但是很多情况是需要通过程序来上传的。提供了后台各种语言上传的SDK，也包括了Android和iOS的，基本就是腾讯COS(对象存储)上传文件的进一步封装。

我们这里主要是尝试通过Web来上传。上传分2部分，一部分是需要我们写一个服务端WebAPI来返回一个signature。这个完全可以拷贝腾讯提供的签名例子，主要是把密钥id和密钥key放在服务端计算POST返回签名值。我这里用的是NetCore的例子

[HttpPost]

public string Post()

{

Signature sign = new Signature();

sign.m_strSecId = "用自己的secid";

sign.m_strSecKey = "用自己的seckey";

sign.m_qwNowTime = Signature.GetIntTimeStamp();

sign.m_iRandom = new Random().Next(0, 1000000);

sign.m_iSignValidDuration = 3600 * 24 * 2;

return sign.GetUploadSignature();

}

另外一部分是基于H5写的上传视频，腾讯提供了web的sdk，以下是一个包含上传视频，截图加进度的完整的例子

var uploadvideo = function () {

var videoFile = document.getElementById("vname").files[0];

var coverFile = document.getElementById("cname").files[0];

qcVideo.ugcUploader.start({

videoFile: videoFile,

coverFile: coverFile,//封面，类型为 File

getSignature: getSignature,

error: function (result) {

alert('上传失败的文件类型：' + result.type+"\n"+'上传失败的原因：' + result.msg);

},

progress: function (result) {

document.getElementById("progress").value=result.shacurr*100;

},

finish: function (result) {

var info ={

"上传结果的 fileId":result.fileId,

"上传结果的视频名称": result.videoName,

"上传结果的视频地址":result.videoUrl,

"上传结果的封面名称":result.coverName,

"上传结果的封面地址":result.coverUrl

}

alert(JSON.stringify(info,null,2));

console.log(JSON.stringify(result,null,2));

}

});

}

上传成功后截图如下：

image.png

注意这里要播放一个视频，只需要传递一个fileid，如果要下载视频文件才需要视频url。

上传成功后我们在视频中心可以看到上传的列表。

3. PC端播放视频

在PC端通过浏览器播放非常简单，直接基于腾讯的例子简单改一下AppId和fileid，在PC端各种浏览器兼容很好。

var player = TCPlayer('player-container-id', { // player-container-id 为播放器容器ID，必须与html中一致

fileID: '7447398156669699331', // 请传入需要播放的视频filID 必须

appID: '1256923424' // 请传入点播账号的appID 必须

//其他参数请在开发文档中查看

});

注意要在公众账号上使用，需要单独为一个视频申请，腾讯会审核：

image.png

4. 手机端播放视频

手机端播放有2种方式，一是也是基于webview播放以上例子，但是兼容不好，对于某些格式还不支持，如下图：

image.png

我们这里目前只使用点播mp4格式，手机端浏览器应该支持，在AppWorker的IDE下使用do_Webview组件加载这个html文件

ui("do_WebView_1").url="http://192.168.31.176:5555/videoplayer.html";

这个html是运行在局域网的一个web服务。

在Android手机上我们推荐使用do_TencentWebview组件效果会更好，这个组件就是集成腾讯的X5webview，可以规避Android不同系统下浏览器的差异。

播放的效果如下：

image.png

还有一种方式就是使用腾讯提供的Android和iOS SDK，这需要AppWorker官方封装一个do_TencentVideoPlayer的组件，效果肯定比基于webview的好很多，官方很快会封装这个组件。

最后所有示例都可以从Github上下载,包括生成证书的服务，上传视频和播放视频的html。需要运行在NetCore下。