腾讯云视频点播视频上传接口

Posted 2020-10-17 niuniuJAVA

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了腾讯云视频点播视频上传接口相关的知识，希望对你有一定的参考价值。

申请腾讯云获取id 及 key

【腾讯云视频】Web上传地址

https://cloud.tencent.com/document/product/266/9239

Java 签名示例

https://cloud.tencent.com/document/product/266/10638

demo

http://video.qcloud.com/sdk/ugcuploader.html?_ga=1.215462160.645636177.1512724448

根据Java 签名示例获取相关的签名根据上面签名案例

var getSignature = function (callback) {
    $.ajax({
        type: "get",
        url: "getMyKey",
        dataType: "text",
        success: function (result) {
            callback(result);
        },
        error: function (result) {
            alert("失败");
        }
    });
}

页面引入相关js

<script src="//imgcache.qq.com/open/qcloud/js/vod/sdk/ugcUploader.js" type="text/javascript"></script>

<label>
                      上传视频 :
               </label>
                   <input type="file" id="videoFile" name="videoFile" required="required" accept=".avi,.3gp,.mpg,.flv,.mp4,.mkv,.wmv,.rmvb" >
               </div>
               <div id="Blenght" class="progress progress-striped" style="display:none;width: 300px;height: 15px;margin-left:45px;margin-bottom: 1px;">
                    <div id="my-bar-success" class="progress-bar progress-bar-success my-bar-success" role="progressbar"
                         aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                         style="width: 0%;">
                    </div>
                    <div id="countNum" class="len-countNum">
                    <em id="style-em-1" class="em-style"></em><em id="style-em-2" class="em-style"></em></div>
               </div>

function saveVideo() {
    //判断是否为空
    //开始上传视频文件
    var videoObj = document.getElementById("videoFile");
    /*console.log();*/
    if (videoObj.files.length) {
        var resultMsg = qcVideo.ugcUploader.start({
            videoFile: videoObj.files[0],
            getSignature: getSignature,
            success: function (result) {
            },
            error: function (result) {
                alert(‘上传失败的原因：‘ + result.msg);
                $(".div-grop").show();
                $("#Blenght").css("display", "none");
                $("#qued").show();
            },
            progress: function (result) {
                var progressNum = result.shacurr;
                progressNum = progressNum * 100;
                $("#my-bar-success").css("width", parseInt(progressNum) + "%");
                $("#style-em-1").html(parseInt(progressNum) + "%");
            },
            finish: function (result) {
                if (!result) {
                    layer.msg(‘操作异常，请稍后重试！‘, {time: 2000});
                    return false;
                }
                var id = result.fileId;
                var path = result.videoUrl;
                var name = result.videoName;
                if (id == "" || id == null) {
                    layer.msg(‘请先上传文件！‘, {time: 2000});
                    return false;
                }
                if (path == "" || path == null) {
                    layer.msg(‘请先上传文件！‘, {time: 2000});
                    return false;
                }
                if (name == "" || name == null) {
                    layer.msg(‘请先上传文件！‘, {time: 2000});
                    return false;
                }
                $("#videoId").val(id);
                $("#videoPath").val(path);
                $("#videoName").val(name);//
                $.ajax({
                    type: "POST",
                    url: "saveVideo",
                    data: $(‘#videoform‘).serialize(),
                    dataType: "text",
                    success: function (result) {

                    },
                    error: function (result) {

                    }
                });
            }
        });
    } else {
        layer.msg(‘请选择上传文件！‘, {time: 2000});
    }
}

以上是关于腾讯云视频点播视频上传接口的主要内容，如果未能解决你的问题，请参考以下文章

vue + antd-vue + 腾讯云点播完成视频上传功能

JavaWeb-SpringBoot_（上）腾讯点播服务之视频的上传

vue 腾讯云点播播放视频（单视频）

阿里云腾讯云七牛网易云简单对比如下

android 怎么接入腾讯云直播

vue 腾讯云点播播放视频（循环）