1. 介绍

正常的 m3u8 格式视频通过控制台是无法下载的，但是可以通过插件下载，下面介绍如何规避这个问题。
思路：后端生成一个一次性的密钥，前端放在请求头中，可以防止大部分插件下载。这里只说前端。

2. 实现

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

  // 接口封装disposable() {return new Promise((resolve, reject) => {axios.get('file/disposable').then(res => {resolve(res);}).catch(err => {reject(err);});});},

 // m3u8let 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);},}},});