Aliplayer通过HLS流式播放Aliyun Mps(媒体处理)转码的加密视频

前言

 公司需求,上传的视频需要加上公司Logo,同时播放需要采用流式播放禁止下载。 现有的环境在阿里云上,所以自然想到了阿里云的产品【媒体处理】的转码功能。

 

转码配置

配置比较简单,采用阿里云HLS标准加密方式 参考阿里云官方文档即可【文档地址】,采用工作流方式,自动触发。 

流程图如下。

 

 

工作流的配置需要额外注意的是KeyUri,该Url为业务站点应用对应的视频解密api, 此Url会在MPS加密后自动写入m3u8文件中,播放器播放时在解析m3u8文件后,也会自动请求该Url,将读取到的ts文件进行解密播放。

 

播放与解密

流程图

 

解密服务

这里可以按照自己的开发语言,我这边使用的是.net core。 官方文档提供了python和java 两个版本,调用Kms密钥服务将密文进行解密。

 一个简单的m3u8文件如下

#EXTM3U
     #EXT-X-VERSION:3
     #EXT-X-TARGETDURATION:5
     #EXT-X-MEDIA-SEQUENCE:0
     #EXT-X-KEY:METHOD=AES-128,URI="https://example.aliyundoc.com?Ciphertext=aabbccddeeff&MediaId=fbbf98691ea44b7c82dd75c5bc8b****"
     #EXTINF:4.127544,
     15029611683170-00001.ts
     #EXT-X-ENDLIST

其中Ciphertext为密文,MediaId 为媒体服务对应的mediaId,播放时使用。

解密api的请求代码如下(C#)

        private Client CreateClient()
        {
            Config config = new Config
            {
                // 您的AccessKey ID
                AccessKeyId = _config.AccessKeyId,
                // 您的AccessKey Secret
                AccessKeySecret = _config.AccessKeySecret,
                Endpoint = _config.Endpoint,
            };
            return new Client(config);
        }
   private async Task<string> DecryptRequest(string mediaId, string ciphertext)
        {
            var client = CreateClient();
            DecryptRequest request = new DecryptRequest();
            request.CiphertextBlob = ciphertext;
            try
            {
                DecryptResponse response = await client.DecryptAsync(request);
                string plaintext = response.Body.Plaintext;

                Console.WriteLine($"plaintext:{plaintext}");
                Console.WriteLine($"KeyId:{response.Body.KeyId}");
                Console.WriteLine($"KeyVersionId:{response.Body.KeyVersionId}");
                Console.WriteLine($"RequestId:{response.Body.RequestId}");
                return plaintext;
            }
            catch (Exception ex)
            {
                throw ex;
            }
        }

不过按理来讲需要在这里要额外校验当前用户的身份,如果没有对应的身份标识,则应该返回httpCode 403. 验证标识的方式可采用 cookie token或其他方式,但这块儿的http请求是由 Aliplayer发出的,在前后端分离的项目中暂时还不清楚如何在请求头上加上自己的临时票据 也就是上面播放流程图中的MtsHlsUriToken参数,需要请教大佬解答了。

 

视频播放

 视频播放可以采用两种方式即 播放地址播放mps用户方式播放, 参考地址

 

 

播放地址播放

这里需要保证Bucket 【防盗链】和【跨域】设置都需要对web站点所在域名放入白名单中

 

 

因为视频时采用HLS标准加密方式的,如果想要使用播放地址进行播放的话,可以采用Aliplayer播放器播放,当然你也可以采用其他开源的播放器进行播放。不过如果使用其他h5 流式播放器播放的话 需要注意读取.ts视频段的时候需要确保Bucket公共读,否则就需要改写对应的播放器源码实现通过临时签名方式读取.ts文件。

 以下是初始化web h5播放器的部分代码段

 

  <div id="player-con"></div>
    <script>
        var player = new Aliplayer({
            id: "player-con",
            source: "https://*****.oss-cn-shanghai.aliyuncs.com/m3u8_1280/test.m3u8",
            width: "100%",
            height: "500px",
            autoplay: true,
            isLive: false
        }, function (player) {
            console.log("The player is created");
        });

    </script>

 

 

MPS用户播放

 

 mps用户播放暂时支持支通过aliplayer播放器播放的,采用mediaId进行播放。  MediaId指的是【媒体处理】服务进行视频转码后端统一的mediaId,好处是可以跨多清晰度。

  1. 为加密视频文件单独放在一个Bucket上,配置为私有读,或者公共读都可以,因为视频文件已经做过内容加密。是否公共读都可以的。
  2. 添加CDN加速域名,参考文档进行基本配置,注意这里如果视频所在的Bucket是私有读的话,需要在CDN中开启【私有Bucket回源】,剩下的CDN的域名证书配置之类的就不说了。

 

  var config = {
                "id": "player-con",
                "vid": {{mediaId}},
                "accId": {{accessKeyId}},
                "accSecret": {{accessKeySecret}},
                "stsToken": {{securityToken}},
                "authInfo": {{authInfo}},
                "domainRegion":{{domainRegion}},
                "format": {{format}},
                "mediaType": "video",
                "width": "100%",
                "height": "500px",
                "autoplay": true,
                "isLive": false,
                "rePlay": false,
                "playsinline": true,
                "preload": true,
                "controlBarVisibility": "hover",
                "useH5Prism": true,
            };
            var player = new Aliplayer(config, function (player) {
                console.log("The player is created");
            });

参考

posted @ 2022-01-20 22:20  Dyhuang  阅读(913)  评论(0编辑  收藏  举报