<audio ref="audio"></audio>
import CryptoJS from "crypto-js";
import Hls from 'hls.js';
methods:{
getHls (url) {
if (Hls.isSupported()) {
var hls = new Hls();
var _gthis = this;
hls.attachMedia(this.$refs.audio);
hls.on(Hls.Events.MEDIA_ATTACHED, function () {
// console.log('audio and hls.js are now bound together !');
hls.loadSource(url);
hls.on(Hls.Events.KEY_LOADED, function (event, data) {
const { frag } = data
// console.log(frag);
// debugger
var _ts = ["ts列表数据1",
"ts列表数据2",
"ts列表数据3",
"ts列表数据4",
"ts列表数据5"];
var query = frag._decryptdata._uri;
var ts = _gthis.getQueryVariable(query, 'ts');
// console.log(ts, frag._decryptdata.key)
// debugger
if (ts) {
var _ = _gthis.getQueryVariable(query, '_');
// console.log(_gthis.decrypt(_, _ts[ts]))
frag._decryptdata.key = _gthis.stringToUint8Array(_gthis.decrypt(_, _ts[ts]))
// console.log(frag._decryptdata.key)
_gthis.$refs.audio.play();
}
})
});
} else if (this.$refs.audio.canPlayType('application/vnd.apple.mpegurl')) {
this.$refs.audio.src = url
let that = this
this.$refs.audio.addEventListener('loadedmetadata', function () {
that.$refs.audio.play();
});
}
},
  stringToUint8Array (str) {
var arr = [];
for (var i = 0, j = str.length; i < j; ++i) {
arr.push(str.charCodeAt(i));
}
var tmpUint8Array = new Uint8Array(arr);
return tmpUint8Array
},
getQueryVariable (query, variable) {
return decodeURIComponent((new RegExp('[?|&]' + variable + '=' + '([^&;]+?)(&|#|;|$)').exec(query) || [, ""])[1]) || null
},
decrypt (word, keyStr) {
var key = CryptoJS.enc.Utf8.parse(keyStr);
var decrypt = CryptoJS.AES.decrypt(word, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 });
return CryptoJS.enc.Utf8.stringify(decrypt).toString();
}
},
mounted(){
this.getHls('https://s.music.com/m/90b416a4faff0e6/000_00000.m3u8')
}
  

  

H5播放需要解密的m3u8音频文件的更多相关文章

  1. 在H5页面播放m3u8音频文件

    需要使用hls插件 首先安装依赖npm install hls.js --save <audio ref="audio"></audio> import H ...

  2. S3C2416裸机开发系列19_Fatfs播放录像wav音频文件

    S3C2416裸机开发系列19 Fatfs播放录像wav音频文件 国际象棋男孩    1048272975 多媒体资源,一般都是以文件的形式存储在固化存储器中.Fatfs所支持的fat32为windo ...

  3. C#制作文本转换为声音的demo,保存音频文件到本地

    TTS(Text To Speech)可以实现把文本转换成语音并朗读出来.Windows Xp可以使用Com组件--Microsoft Speech Object Library实现TTS,Windo ...

  4. h5 audio播放音频文件

    h5 audio播放音频文件 注:下面html中样式及不相关的内容去掉了 第一个例子 播放没有防盗链的外网音频文件是可以的 <!doctype html> <html> < ...

  5. H5页面实现一个Audio标签加载多个音频文件,并进行播放和展示音频长度

    最近微信项目中有需求,要将微信端发送过来的amr格式的语音文件,在项目中的页面上进行展示和播放,实现方式如下: 1.首先java后台收到微信端的消息推送的时候,使用 ffmpeg将amr格式的音频文件 ...

  6. iOS从零开始学习直播之音频1.播放本地音频文件

      现在直播越来越火,俨然已经成为了下一个红海.作为一个资深码农(我只喜欢这样称呼自己,不喜欢别人这样称呼我),我必须赶上时代的潮流,开始研究视频直播.发现视屏直播类的文章上来就讲拉流.推流.采集.美 ...

  7. 关于Window Server2008 服务器上无法播放音频文件的解决方案

    在偌大的百度当中查找我所需要的资源信息,但网络上所描述的都不能解决,发生此类问题的人很多,但是都没有得到准确的解决方法!经个人各方面的尝试,其实非常简单的解决了无法播放音频文件的问题,如果各位今后也遇 ...

  8. web页面如何播放amr的音频文件

    这个需求由来已久,公司的语音订单很多,每次客服都是从服务器down下语音来听.很不方便..于是我就上网扒拉看有么有什么web播放器能播放amr格式的音频文件,amr百度百科 总之找了很久.,,然后发现 ...

  9. 使用audio标签播放音频文件

    HTML5定义了一个新的元素用来指定标准的方式来插入音频文件到web页面中:<audio>标签.使用audio标签可以控制音频的播放与停止,循环播放与播放次数设置,以及播放位置等等. 例如 ...

随机推荐

  1. PHP解压压缩包文件到指定目录的实现

    $src_file为文件路径,上传文件返回压缩包路径即可 public function unzip($src_file, $dest_dir=false, $create_zip_name_dir= ...

  2. MongoDB评论管理

    MongoDB简介 文章评论数据分析 相较于一般数据,文章评论一般有如下特点: 数据量巨大.通常评论量要比帖子.文章大很多 写入操作频繁. 价值较低.一般来说,我们的主要目标还是在帖子(文章)本身. ...

  3. Keycloak 13 自定义用户身份认证流程(User Storage SPI)

    Keycloak 版本:13.0.0 介绍 Keycloak 是为现代应用程序和服务提供的一个开源的身份和访问管理的解决方案. Keycloak 在测试环境可以使用内嵌数据库,生产环境需要重新配置数据 ...

  4. Python数模笔记-NetworkX(2)最短路径

    1.最短路径问题的常用算法 最短路径问题是图论研究中的经典算法问题,用于计算图中一个顶点到另一个顶点的最短路径. 1.1 最短路径长度与最短加权路径长度 在日常生活中,最短路径长度与最短路径距离好像并 ...

  5. 《前端运维》一、Linux基础--03Shell基础及补充

    诶诶欸?不是学Linux么?怎么要讲shell了?shell是啥?啥是shell? 别急,我们先简单了解下shell是什么.Shell 是一个用 C 语言编写的程序,它是用户使用 Linux 的桥梁. ...

  6. goland无法解析go mod问题解决

    Goland 版本是 2018.03 由于之前使用GOPATH方式进行存在很多项目,在怎么配置后都无法解析包,但是命令行时正常的. 这边设置全局的设置,开启goland的go mod包管理. 创建新项 ...

  7. linux下获取占用CPU资源最多的10个进程,可以使用如下命令组合:

    linux下获取占用CPU资源最多的10个进程,可以使用如下命令组合: ps aux|head -1;ps aux|grep -v PID|sort -rn -k +3|head linux下获取占用 ...

  8. Linux压力测试软件Stress安装及使用指南2

    stress工具使用指南和结果分析 Linux压力测试软件Stress安装及使用指南     一.Stress是什么 stress是一个linux下的压力测试工具,专门为那些想要测试自己的系统,完全高 ...

  9. OpenStack常见面试题

    现在,大多数公司都试图将它们的 IT 基础设施和电信设施迁移到私有云, 如 OpenStack.如果你打算面试 OpenStack 管理员这个岗位,那么下面列出的这些面试问题可能会帮助你通过面试. Q ...

  10. 018.Python迭代器以及map和reduce函数

    一 迭代器 能被next进行调用,并且不断返回下一个值的对象 特征:迭代器会生成惰性序列,它通过计算把值依次的返回,一边循环一边计算而不是一次性得到所有数据 优点:需要数据的时候,一次取一个,可以大大 ...