DPlayer m3u8 视频禁止下载

1. 介绍

正常的 m3u8 格式视频通过控制台是无法下载的,但是可以通过插件下载,下面介绍如何规避这个问题。

思路:后端生成一个一次性的密钥,前端放在请求头中,可以防止大部分插件下载。这里只说前端。

2. 实现

集成 DPlayer 播放器这里就不说了,网上一大推。

javascript 复制代码
  // 接口封装
  disposable() {
    return new Promise((resolve, reject) => {
      axios.get('file/disposable').then(res => {
        resolve(res);
      }).catch(err => {
        reject(err);
      });
    });
  },
javascript 复制代码
 // m3u8
 let that = this;
 this.dplayer = new DPlayer({
    container: document.getElementById('page-content-view-video'),
    autoplay: true,
    hotkey: true,
    video: {
      url: 'http:xxxx.m3u8',
      type: 'customHls',
      customType: {
        customHls: function(video, player) {
          let config = {
            xhrSetup: async function(xhr, url) {
              // 这里是为了每个请求携带不同的一次性密钥
              if(url.endsWith('.m3u8')) {
                xhr.setRequestHeader('disposable', await that.$api.disposable());
              }else if(url.endsWith('.ts')) {
                xhr.setRequestHeader('disposable', await that.$api.disposable());
              }
            },
          };
          const hls = new window.Hls(config);
          hls.loadSource(video.src);
          hls.attachMedia(video);
        },
      }
    },
  });
相关推荐
jinglong.zha8 小时前
AI萌宠短剧实战:从0孵化动物IP,用AI制作爆款短视频
人工智能·ai·音视频·网赚教程·萌宠
大学生小郑12 小时前
CMOS 传感器堆叠结构
图像处理·学习·音视频·视频
luoqice13 小时前
利用librtmp实现h264和AAC音频的推流
音视频·aac
byte轻骑兵13 小时前
蓝牙CAP规范解析:构建多设备协同的通用音频新生态
人工智能·音视频·le audio·低功耗音频·蓝牙通话
大象AI共学13 小时前
我让AI写了个网页,它自动变成了视频
人工智能·音视频
Prannt13 小时前
星朗智能语音——视频音色替换
ai·音视频·语音识别
时空自由民.1 天前
音视频图片压缩
音视频
日取其半万世不竭1 天前
PeerTube 部署指南:自建视频托管平台
云原生·eureka·音视频
luoqice1 天前
FLV文件解析
音视频
byte轻骑兵2 天前
【AVRCP】规范精讲[10]:链路管理器LM互操作规则与场景落地
人工智能·音视频·蓝牙·avrcp·音视频控制