m3u8下载时出现跨域的解决方法
2024-05-11 21:18:31
m3u8下载时出现跨域复制下面的代码
当无法下载，资源发生跨域限制时，在视频源页面打开控制台，注入代码解决，点击复制下面代码
// 注入htmllet $section = document.createElement('section')$section.innerHTML = `<!doctype html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta name="author" content="毛静文,Momo"><meta name="keywords" content="m3u8 下载工具, 毛静文的博客,Momo's Blog"><meta name="description" content="m3u8 下载工具,无需下载软件,打开网站即可下载,自动检测,一键下载"><title>m3u8 downloader</title><style>/*全局设置*/html, body {margin: 0;padding: 0;}body::-webkit-scrollbar { display: none}p {margin: 0;}[v-cloak] {display: none;}#m-app {height: 100%;width: 100%;text-align: center;padding: 10px 50px 80px;box-sizing: border-box;}.m-p-action {margin: 20px auto;max-width: 1100px;width: 100%;font-size: 35px;text-align: center;font-weight: bold;}.m-p-other, .m-p-tamper, .m-p-github, .m-p-language {position: fixed;right: 50px;background-color: #eff3f6;background-image: linear-gradient(-180deg, #fafbfc, #eff3f6 90%);color: #24292e;border: 1px solid rgba(27, 31, 35, .2);border-radius: 3px;cursor: pointer;display: inline-block;font-size: 14px;font-weight: 600;line-height: 20px;padding: 6px 12px;z-index: 99;}.m-p-help {position: fixed;right: 50px;top: 50px;width: 30px;height: 30px;color: #666666;z-index: 2;line-height: 30px;font-weight: bolder;border-radius: 50%;border: 1px solid rgba(27, 31, 35, .2);cursor: pointer;background-color: #eff3f6;background-image: linear-gradient(-180deg, #fafbfc, #eff3f6 90%);}.m-p-github:hover, .m-p-other:hover, .m-p-tamper:hover, .m-p-help:hover, .m-p-language:hover {opacity: 0.9;}.m-p-language {bottom: 70px;}.m-p-other {bottom: 110px;}.m-p-tamper {bottom: 30px;}.m-p-github {bottom: 150px;}/*广告*/.m-p-refer {position: absolute;left: 50px;bottom: 50px;}.m-p-refer .text {position: absolute;top: -80px;left: -40px;animation-name: upAnimation;transform-origin: center bottom;animation-duration: 2s;animation-fill-mode: both;animation-iteration-count: infinite;animation-delay: .5s;}.m-p-refer .close {display: block;position: absolute;top: -110px;right: -50px;padding: 0;margin: 0;width: 50px;height: 50px;border-radius: 50%;border: none;cursor: pointer;z-index: 3;transition: 0.3s all;background-size: 30px 30px;background-repeat: no-repeat;background-position: center center;background-image: url(https://blog.luckly-mjw.cn/tool-show/m3u8-downloader/imgs/close.png);background-color: rgba(0, 0, 0, 0.5);}.m-p-refer .close:hover {background-color: rgba(0, 0, 0, 0.8);}.m-p-refer .link {border-radius: 4px;text-decoration: none;background-color: #4E84E6;transition: 0.3s all;}.m-p-refer .link:hover {top: -10px;color: #333333;border: 1px solid transparent;background: rgba(0, 0, 0, 0.6);box-shadow: 2px 11px 20px 0 rgba(0, 0, 0, 0.6);}@keyframes upAnimation {0% {transform: rotate(0deg);transition-timing-function: cubic-bezier(0.215, .61, .355, 1)}10% {transform: rotate(-12deg);transition-timing-function: cubic-bezier(0.215, .61, .355, 1)}20% {transform: rotate(12deg);transition-timing-function: cubic-bezier(0.215, .61, .355, 1)}28% {transform: rotate(-10deg);transition-timing-function: cubic-bezier(0.215, .61, .355, 1)}36% {transform: rotate(10deg);transition-timing-function: cubic-bezier(0.755, .5, .855, .06)}42% {transform: rotate(-8deg);transition-timing-function: cubic-bezier(0.755, .5, .855, .06)}48% {transform: rotate(8deg);transition-timing-function: cubic-bezier(0.755, .5, .855, .06)}52% {transform: rotate(-4deg);transition-timing-function: cubic-bezier(0.755, .5, .855, .06)}56% {transform: rotate(4deg);transition-timing-function: cubic-bezier(0.755, .5, .855, .06)}60% {transform: rotate(0deg);transition-timing-function: cubic-bezier(0.755, .5, .855, .06)}100% {transform: rotate(0deg);transition-timing-function: cubic-bezier(0.215, .61, .355, 1)}}/*顶部信息录入*/.m-p-temp-url {padding-top: 50px;padding-bottom: 10px;width: 100%;color: #999999;text-align: left;font-style: italic;word-break: break-all;}.m-p-input-container {display: flex;}.m-p-input-container input {flex: 1;margin-bottom: 30px;display: block;width: 280px;padding: 16px;font-size: 24px;border-radius: 4px;box-shadow: none;color: #444444;border: 1px solid #cccccc;}.m-p-input-container .range-input {margin-left: 10px;flex: 0 0 100px;width: 100px;box-sizing: border-box;}.m-p-input-container div {position: relative;display: inline-block;margin-left: 10px;height: 60px;line-height: 60px;font-size: 24px;color: white;cursor: pointer;border-radius: 4px;border: 1px solid #eeeeee;background-color: #3D8AC7;opacity: 1;transition: 0.3s all;}.m-p-input-container div:hover {opacity: 0.9;}.m-p-input-container div {width: 200px;}.m-p-input-container .disable {cursor: not-allowed;background-color: #dddddd;}/*下载状态*/.m-p-line {margin: 20px 0 50px;vertical-align: top;width: 100%;height: 5px;border-bottom: dotted;}.m-p-tips {width: 100%;color: #999999;text-align: left;font-style: italic;word-break: break-all;}.m-p-tips p {width: 100px;display: inline-block;}.m-p-tips.error-tips{color: #DC5350;}.m-p-segment {text-align: left;}.m-p-segment .item {display: inline-block;margin: 10px 6px;width: 50px;height: 40px;color: white;line-height: 40px;text-align: center;border-radius: 4px;cursor: help;border: solid 1px #eeeeee;background-color: #dddddd;transition: 0.3s all;}.m-p-segment .finish {background-color: #0ACD76;}.m-p-segment .error {cursor: pointer;background-color: #DC5350;}.m-p-segment .error:hover {opacity: 0.9;}.m-p-cross, .m-p-final {display: inline-block;width: 100%;height: 50px;line-height: 50px;font-size: 20px;color: white;cursor: pointer;border-radius: 4px;border: 1px solid #eeeeee;background-color: #3D8AC7;opacity: 1;transition: 0.3s all;}.m-p-final {margin-top: 10px;text-decoration: none;}.m-p-force, .m-p-retry {position: absolute;right: 50px;display: inline-block;padding: 6px 12px;font-size: 18px;color: white;cursor: pointer;border-radius: 4px;border: 1px solid #eeeeee;background-color: #3D8AC7;opacity: 1;transition: 0.3s all;}.m-p-retry {right: 250px;}.m-p-force:hover, .m-p-retry:hover {opacity: 0.9;}</style>
</head><body>
<div id="loading">页面加载中，请耐心等待...<h1 style="white-space: pre;">推荐一个 m3u8 网页版提取工具，无需下载软件，打开网站即可下载，自动检测，一键下载。工具链接：https://blog.luckly-mjw.cn/tool-show/m3u8-downloader/index.html工具教程：https://segmentfault.com/a/1190000021847172?_ea=32289224<img src="https://upyun.luckly-mjw.cn/Assets/blog/m3u8-downloader-121-75.jpeg" alt="m3u8 视频下载工具" title="logo"/><a target="_blank" href="https://blog.luckly-mjw.cn/tool-show/m3u8-downloader/index.html">点击跳转</a></h1>
</div>
<section id="m-app" v-cloak><!--顶部操作提示--><section class="m-p-action g-box">{{tips}}</section><a class="m-p-help" target="_blank" href="https://segmentfault.com/a/1190000021847172">?</a><a class="m-p-tamper" target="_blank" href="https://blog.luckly-mjw.cn/tool-show/m3u8-downloader/m3u8-downloader.user.js">手动添加油猴插件</a><a class="m-p-github" target="_blank" href="https://github.com/Momo707577045/m3u8-downloader">github</a><a class="m-p-other" target="_blank" href="http://blog.luckly-mjw.cn/tool-show/index.html">其他实用工具</a><a class="m-p-language" href="http://blog.luckly-mjw.cn/tool-show/m3u8-downloader/index-en.html">English version</a><!--广告--><a v-if="isShowRefer" class="m-p-refer" target="_blank" href="https://segmentfault.com/a/1190000024416860"><img src="https://blog.luckly-mjw.cn/tool-show/m3u8-downloader/imgs/001.png" class="link"><img src="https://blog.luckly-mjw.cn/tool-show/m3u8-downloader/imgs/003.png" class="text"><i class="close" @click.prevent="isShowRefer=false"></i></a><!--文件载入--><div class="m-p-temp-url">测试链接：http://1257120875.vod2.myqcloud.com/0ef121cdvodtransgzp1257120875/3055695e5285890780828799271/v.f230.m3u8</div><section class="m-p-input-container"><input type="text" v-model="url" :disabled="downloading" placeholder="请输入 m3u8 链接"><!--范围查询--><template v-if="!downloading || rangeDownload.isShowRange"><div v-if="!rangeDownload.isShowRange" @click="getM3U8(true)">特定范围下载</div><template v-else><input class="range-input" type="number" v-model="rangeDownload.startSegment" :disabled="downloading" placeholder="起始片段"><input class="range-input" type="number" v-model="rangeDownload.endSegment" :disabled="downloading" placeholder="截止片段"></template></template><!--还未开始下载--><template v-if="!downloading"><div @click="getM3U8(false)">原格式下载</div><div @click="getMP4">转码为MP4下载</div></template><div v-else-if="finishNum === rangeDownload.targetSegment && rangeDownload.targetSegment > 0" class="disable">下载完成</div><div v-else @click="togglePause">{{ isPause ? '恢复下载' : '暂停下载' }}</div></section><div class="m-p-cross" @click="copyCode">当无法下载，资源发生跨域限制时，在视频源页面打开控制台，注入代码解决，点击本按钮复制代码</div><a class="m-p-final" target="_blank" href="https://segmentfault.com/a/1190000025182822">下载的视频看不了？试试这个终结解决方案「无差别视频提取工具」，有配套「油猴」插件啦！！！</a><template v-if="finishList.length > 0"><div class="m-p-line"></div><div class="m-p-retry" v-if="errorNum && downloadIndex >= rangeDownload.targetSegment" @click="retryAll">重新下载错误片段</div><div class="m-p-force" v-if="mediaFileList.length" @click="forceDownload">强制下载现有片段</div><div class="m-p-tips">待下载碎片总量：{{ rangeDownload.targetSegment }}，已下载：{{ finishNum }}，错误：{{ errorNum }}，进度：{{ (finishNum / rangeDownload.targetSegment * 100).toFixed(2) }}%</div><div class="m-p-tips" :class="[errorNum ? 'error-tips' : '']">若某视频碎片下载发生错误，将标记为红色，可点击相应图标进行重试</div><section class="m-p-segment"><div class="item" v-for="(item, index) in finishList" :class="[item.status]" :title="item.title" @click="retry(index)">{{ index + 1 }}</div></section></template>
</section>
</body><script>
var _hmt = _hmt || [];
(function () {var hm = document.createElement("script");hm.src = "https://hm.baidu.com/hm.js?1f12b0865d866ae1b93514870d93ce89";var s = document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm, s);
})();
</script>
`$section.style.width = '100%'$section.style.height = '800px'$section.style.top = '0'$section.style.left = '0'$section.style.position = 'relative'$section.style.zIndex = '9999'$section.style.backgroundColor = 'white'document.body.appendChild($section);// 加载 ASE 解密let $ase = document.createElement('script')$ase.src = 'https://upyun.luckly-mjw.cn/lib/aes-decryptor.js'// 加载 mp4 转码let $mp4 = document.createElement('script')$mp4.src = 'https://upyun.luckly-mjw.cn/lib/mux-mp4.js'// 加载 vuelet $vue = document.createElement('script')$vue.src = 'https://upyun.luckly-mjw.cn/lib/vue.js'// 监听 vue 加载完成，执行业务代码$vue.addEventListener('load', () => {
document.getElementById('loading') && document.getElementById('loading').remove()
new Vue({el: '#m-app',data() {return {url: '', // 在线链接tips: 'm3u8 视频在线提取工具', // 顶部提示isPause: false, // 是否暂停下载isGetMP4: false, // 是否转码为 MP4 下载durationSecond: 0, // 视频持续时长isShowRefer: true, // 是否显示推送downloading: false, // 是否下载中beginTime: '', // 开始下载的时间errorNum: 0, // 错误数finishNum: 0, // 已下载数downloadIndex: 0, // 当前下载片段finishList: [], // 下载完成项目tsUrlList: [], // ts URL数组mediaFileList: [], // 下载的媒体数组rangeDownload: { // 特定范围下载isShowRange: false, // 是否显示范围下载startSegment: '', // 起始片段endSegment: '', // 截止片段targetSegment: 1, // 待下载片段},aesConf: { // AES 视频解密配置method: '', // 加密算法uri: '', // key 所在文件路径iv: '', // 偏移值key: '', // 秘钥decryptor: null, // 解码器对象stringToBuffer: function (str) {return new TextEncoder().encode(str)},},}},created() {this.getSource();window.addEventListener('keyup', this.onKeyup)},beforeDestroy() {window.removeEventListener('keyup', this.onKeyup)},methods: {// 获取链接中携带的资源链接getSource() {let { href } = locationif (href.indexOf('?source=') > -1) {this.url = href.split('?source=')[1]}},// 退出弹窗onKeyup(event) {if (event.keyCode === 13) { // 键入ESCthis.getM3U8()}},// ajax 请求ajax(options) {options = options || {};let xhr = new XMLHttpRequest();if (options.type === 'file') {xhr.responseType = 'arraybuffer';}xhr.onreadystatechange = function () {if (xhr.readyState === 4) {let status = xhr.status;if (status >= 200 && status < 300) {options.success && options.success(xhr.response);} else {options.fail && options.fail(status);}}};xhr.open("GET", options.url, true);xhr.send(null);},// 合成URLapplyURL(targetURL, baseURL) {baseURL = baseURL || location.hrefif (targetURL.indexOf('http') === 0) {return targetURL} else if (targetURL[0] === '/') {let domain = baseURL.split('/')return domain[0] + '//' + domain[2] + targetURL} else {let domain = baseURL.split('/')domain.pop()return domain.join('/') + '/' + targetURL}},// 解析为 mp4 下载getMP4() {this.isGetMP4 = truethis.getM3U8()},// 获取在线文件getM3U8(onlyGetRange) {if (!this.url) {alert('请输入链接')return}if (this.url.toLowerCase().indexOf('.m3u8') === -1) {alert('链接有误，请重新输入')return}if (this.downloading) {alert('资源下载中，请稍后')return}// 在下载页面才触发，代码注入的页面不需要校验// 当前协议不一致，切换协议if (location.href.indexOf('blog.luckly-mjw.cn') > -1 && this.url.indexOf(location.protocol) === -1) {//alert('当前协议不一致，跳转至正确页面重新下载')location.href = `${this.url.split(':')[0]}://blog.luckly-mjw.cn/tool-show/m3u8-downloader/index.html?source=${this.url}`return}// 在下载页面才触发，修改页面 URL，携带下载路径，避免刷新后丢失if (location.href.indexOf('blog.luckly-mjw.cn') > -1) {window.history.replaceState(null, '', `${location.href.split('?')[0]}?source=${this.url}`)}this.tips = 'm3u8 文件下载中，请稍后'this.beginTime = new Date()this.ajax({url: this.url,success: (m3u8Str) => {this.tsUrlList = []this.finishList = []// 提取 ts 视频片段地址m3u8Str.split('\n').forEach((item) => {if (item.toLowerCase().indexOf('.ts') > -1 || item.toLowerCase().indexOf('.image') > -1) {this.tsUrlList.push(this.applyURL(item, this.url))this.finishList.push({title: item,status: ''})}})// 仅获取视频片段数if (onlyGetRange) {this.rangeDownload.isShowRange = truethis.rangeDownload.endSegment = this.tsUrlList.lengththis.rangeDownload.targetSegment = this.tsUrlList.lengthreturn} else {let startSegment = Math.max(this.rangeDownload.startSegment || 1, 1) // 最小为 1let endSegment = Math.max(this.rangeDownload.endSegment || this.tsUrlList.length, 1)startSegment = Math.min(startSegment, this.tsUrlList.length) // 最大为 this.tsUrlList.lengthendSegment = Math.min(endSegment, this.tsUrlList.length)this.rangeDownload.startSegment = Math.min(startSegment, endSegment)this.rangeDownload.endSegment = Math.max(startSegment, endSegment)this.rangeDownload.targetSegment = this.rangeDownload.endSegment - this.rangeDownload.startSegment + 1this.downloadIndex = this.rangeDownload.startSegment - 1this.downloading = true}// 获取需要下载的 MP4 视频长度if (this.isGetMP4) {let infoIndex = 0m3u8Str.split('\n').forEach(item => {if (item.toUpperCase().indexOf('#EXTINF:') > -1) { // 计算视频总时长，设置 mp4 信息时使用infoIndex++if (this.rangeDownload.startSegment <= infoIndex && infoIndex <= this.rangeDownload.endSegment) {this.durationSecond += parseFloat(item.split('#EXTINF:')[1])}}})}// 检测视频 AES 加密if (m3u8Str.indexOf('#EXT-X-KEY') > -1) {this.aesConf.method = (m3u8Str.match(/(.*METHOD=([^,\s]+))/) || ['', '', ''])[2]this.aesConf.uri = (m3u8Str.match(/(.*URI="([^"]+))"/) || ['', '', ''])[2]this.aesConf.iv = (m3u8Str.match(/(.*IV=([^,\s]+))/) || ['', '', ''])[2]this.aesConf.iv = this.aesConf.iv ? this.aesConf.stringToBuffer(this.aesConf.iv) : ''this.aesConf.uri = this.applyURL(this.aesConf.uri, this.url)// let params = m3u8Str.match(/#EXT-X-KEY:([^,]*,?METHOD=([^,]+))?([^,]*,?URI="([^,]+)")?([^,]*,?IV=([^,^\n]+))?/)// this.aesConf.method = params[2]// this.aesConf.uri = this.applyURL(params[4], this.url)// this.aesConf.iv = params[6] ? this.aesConf.stringToBuffer(params[6]) : ''this.getAES();} else if (this.tsUrlList.length > 0) { // 如果视频没加密，则直接下载片段，否则先下载秘钥this.downloadTS()} else {this.alertError('资源为空，请查看链接是否有效')}},fail: () => {this.alertError('链接不正确，请查看链接是否有效')}})},// 获取AES配置getAES() {alert('视频被 AES 加密，点击确认，进行视频解码')this.ajax({type: 'file',url: this.aesConf.uri,success: (key) => {// console.log('getAES', key)// this.aesConf.key = this.aesConf.stringToBuffer(key)this.aesConf.key = keythis.aesConf.decryptor = new AESDecryptor()this.aesConf.decryptor.constructor()this.aesConf.decryptor.expandKey(this.aesConf.key);this.downloadTS()},fail: () => {this.alertError('视频已进行定制化加密，不提供定制化解密下载')}})},// ts 片段的 AES 解码aesDecrypt(data, index) {let iv = this.aesConf.iv || new Uint8Array([0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, index])return this.aesConf.decryptor.decrypt(data, 0, iv.buffer || iv, true)},// 下载分片downloadTS() {this.tips = 'ts 视频碎片下载中，请稍后'let download = () => {let isPause = this.isPause // 使用另一个变量来保持下载前的暂停状态，避免回调后没修改let index = this.downloadIndexthis.downloadIndex++if (this.finishList[index] && this.finishList[index].status === '') {this.ajax({url: this.tsUrlList[index],type: 'file',success: (file) => {this.dealTS(file, index, () => this.downloadIndex < this.rangeDownload.endSegment && !isPause && download())},fail: () => {this.errorNum++this.finishList[index].status = 'error'if (this.downloadIndex < this.rangeDownload.endSegment) {!isPause && download()}}})} else if (this.downloadIndex < this.rangeDownload.endSegment) { // 跳过已经成功的片段!isPause && download()}}// 建立多少个 ajax 线程for (let i = 0; i < Math.min(10, this.rangeDownload.targetSegment - this.finishNum); i++) {download(i)}},// 处理 ts 片段，AES 解密、mp4 转码dealTS(file, index, callback) {const data = this.aesConf.uri ? this.aesDecrypt(file, index) : filethis.conversionMp4(data, index, (afterData) => { // mp4 转码this.mediaFileList[index - this.rangeDownload.startSegment + 1] = afterData // 判断文件是否需要解密this.finishList[index].status = 'finish'this.finishNum++if (this.finishNum === this.rangeDownload.targetSegment) {this.downloadFile(this.mediaFileList, this.formatTime(this.beginTime, 'YYYY_MM_DD hh_mm_ss'))}callback && callback()})},// 转码为 mp4conversionMp4(data, index, callback) {if (this.isGetMP4) {let transmuxer = new muxjs.Transmuxer({keepOriginalTimestamps: true,duration: parseInt(this.durationSecond),});transmuxer.on('data', segment => {if (index === this.rangeDownload.startSegment - 1) {let data = new Uint8Array(segment.initSegment.byteLength + segment.data.byteLength);data.set(segment.initSegment, 0);data.set(segment.data, segment.initSegment.byteLength);callback(data.buffer)} else {callback(segment.data)}})transmuxer.push(new Uint8Array(data));transmuxer.flush();} else {callback(data)}},// 暂停与恢复togglePause() {this.isPause = !this.isPause!this.isPause && this.retryAll()},// 重新下载某个片段retry(index) {if (this.finishList[index].status === 'error') {this.finishList[index].status = ''this.ajax({url: this.tsUrlList[index],type: 'file',success: (file) => {this.errorNum--this.dealTS(file, index)},fail: () => {this.finishList[index].status = 'error'}})}},// 重新下载所有错误片段retryAll() {this.finishList.forEach((item) => { // 重置所有片段状态if (item.status === 'error') {item.status = ''}})this.errorNum = 0this.downloadIndex = this.rangeDownload.startSegment - 1this.downloadTS()},// 下载整合后的TS文件downloadFile(fileDataList, fileName) {this.tips = 'ts 碎片整合中，请留意浏览器下载'let fileBlob = nulllet a = document.createElement('a')if (this.isGetMP4) {fileBlob = new Blob(fileDataList, { type: 'video/mp4' }) // 创建一个Blob对象，并设置文件的 MIME 类型a.download = fileName + '.mp4'} else {fileBlob = new Blob(fileDataList, { type: 'video/MP2T' }) // 创建一个Blob对象，并设置文件的 MIME 类型a.download = fileName + '.ts'}a.href = URL.createObjectURL(fileBlob)a.style.display = 'none'document.body.appendChild(a)a.click()a.remove()},// 格式化时间formatTime(date, formatStr) {const formatType = {Y: date.getFullYear(),M: date.getMonth() + 1,D: date.getDate(),h: date.getHours(),m: date.getMinutes(),s: date.getSeconds(),}return formatStr.replace(/Y+|M+|D+|h+|m+|s+/g,target => (new Array(target.length).join('0') + formatType[target[0]]).substr(-target.length))},// 强制下载现有片段forceDownload() {if (this.mediaFileList.length) {this.downloadFile(this.mediaFileList, this.formatTime(this.beginTime, 'YYYY_MM_DD hh_mm_ss'))} else {alert('当前无已下载片段')}},// 发生错误，进行提示alertError(tips) {alert(tips)this.downloading = falsethis.tips = 'm3u8 视频在线提取工具';},// 拷贝本页面本身，解决跨域问题copyCode() {if (this.tips !== '代码下载中，请稍后') {this.tips = '代码下载中，请稍后';this.ajax({url: './index.html',success: (fileStr) => {let fileList = fileStr.split(`<!--vue 前端框架--\>`);let dom = fileList[0];let script = fileList[1] + fileList[2];script = script.split('');script = script[1] + script[2];if (this.url) {script = script.replace(`url: '', // 在线链接`, `url: '${this.url}',`);}let codeStr = `// 注入htmllet $section = document.createElement('section')$section.innerHTML = \`${dom}\`$section.style.width = '100%'$section.style.height = '800px'$section.style.top = '0'$section.style.left = '0'$section.style.position = 'relative'$section.style.zIndex = '9999'$section.style.backgroundColor = 'white'document.body.appendChild($section);// 加载 ASE 解密let $ase = document.createElement('script')$ase.src = 'https://upyun.luckly-mjw.cn/lib/aes-decryptor.js'// 加载 mp4 转码let $mp4 = document.createElement('script')$mp4.src = 'https://upyun.luckly-mjw.cn/lib/mux-mp4.js'// 加载 vuelet $vue = document.createElement('script')$vue.src = 'https://upyun.luckly-mjw.cn/lib/vue.js'// 监听 vue 加载完成，执行业务代码$vue.addEventListener('load', () => {${script}})document.body.appendChild($vue);document.body.appendChild($mp4);document.body.appendChild($ase);alert('注入成功，请滚动到页面底部，若白屏则等待资源加载')`;this.copyToClipboard(codeStr);this.tips = '复制成功，打开视频网页控制台，注入本代码';},fail: () => {this.alertError('链接不正确，请查看链接是否有效');},})}},// 拷贝剪切板copyToClipboard(content) {clearTimeout(this.timeouter)if (!document.queryCommandSupported('copy')) {return false}let $input = document.createElement('textarea')$input.style.opacity = '0'$input.value = contentdocument.body.appendChild($input)$input.select()const result = document.execCommand('copy')document.body.removeChild($input)$input = nullreturn result},}
})
})document.body.appendChild($vue);document.body.appendChild($mp4);document.body.appendChild($ase);alert('注入成功，请滚动到页面底部，若白屏则等待资源加载')异常情况
【无法下载，没有显示片段Icon】
一般由于跨域造成。
点击「跨域复制代码」按钮。
打开视频目标网页的「开发者工具界面」，找到 console 栏。
粘贴刚刚复制的内容，回车。
滚动页面到底部，发现工具显示在底部。然后在注入的工具中正常使用
大家好，我叫方包，关注公众号【优派编程】，学习并了解到更多编程知识！暗号“资料”，有免费的资源app和学习资料，我会不定期得分享编程干货知识~
m3u8下载时出现跨域的解决方法相关推荐
- 浏览器同源策略及跨域的解决方法
浏览器同源策略及跨域的解决方法 参考文章: (1)浏览器同源策略及跨域的解决方法 (2)https://www.cnblogs.com/laixiangran/p/9064769.html 备忘一下.
- vue3项目实战的请求接口问题（一）跨域问题+解决方法
vue3 跨域问题➕常用解决方法 前言引入 跨域问题 解决跨域问题常用方法
- python flask 跨域问题 解决方法
问题 网页上(client)有一个ajax请求,Flask sever是直接返回 jsonify. 然后ajax就报错:No 'Access-Control-Allow-Origin' header ...
- [Unity WWW] 跨域访问解决方法
什么是跨域访问 域(Domain)是Windows网络中独立运行的单位,域之间相互访问则需要建立信任关系(即Trust Relation).信任关系是连接在域与域之间的桥梁.当一个域与其他域建立了信任 ...
- 【转】JS跨域（ajax跨域、iframe跨域）解决方法及原理详解（jsonp）
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...
- WebApi Ajax 跨域请求解决方法（CORS实现）
ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题, 特别各种A ...
- JS跨域（ajax跨域、iframe跨域）解决方法及原理详解（jsonp）
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...
- 服务器端可控情形的Javascript跨域访问解决方法
在最近的一个web项目中为了实现bookmark功能碰到了javascript跨域访问的问题.起初,在google上搜的很多解决方案并不适用于我的情形,只在有一篇文章中提到的远程加载javascrip ...
- 第114天：Ajax跨域请求解决方法（二）
一.什么是跨域 我们先回顾一下域名地址的组成: http:// www . google : 8080 / script/jquery.js http:// (协议号) www (子 ...
最新文章
- L1-016 查验身份证 (15 分)
- 芯片如何储存信息_十四五规划之：芯片
- C语言什么时候必须用到二级指针？（需要调用函数为一维空指针确定值的情况下，需要传入二维指针，也就是那个一维指针的指针）
- 启动hadoop没有resourcemanager_5.hadoop-MR YARN架构理论与集群搭建
- ElementUI在el-table基础上进行导出.xls表格操作
- [转] Windows CE 6.0 启动过程分析
- Restrictions查询用法
- 使用virt-install安装kvm虚拟机时需要的问题
- SQL Server Update 所有表的某一列(列名相同,类型相同)数值
- 强烈推荐：给去美国的新生说几句（转载），超实用
- Cat.5e/Cat.6系统测试要点和常见工程问题解答
- 【原创翻译】文本编辑器
- 物理常量/真空电容率/引力常量/真空磁导率/斯特潘-玻尔兹曼常量
- 网络安全笔记-DDoS攻击
- Java中的Constants类
- 下一代防火墙（NGFW）已死！
- 加密算法之RSA算法
- 11个你可能不知道的Python库
- 【收藏】详解FIR滤波器和IIR滤波器的区别
- Springboot+redis 做实时在线人数统计