IIS 跨域设置 ts m3u8 文件支持下载_综合

一般IIS下发布的后台服务，存在跨域问题的话，设置如下头名称即可解决

配置头名称及值

Access-Control-Allow-Origin 值:*
Access-Control-Allow-Methods 值:*
Access-Control-Allow-Headers 值:*

M3U8文件
加上俩 MIME 类型就可以了

<mimeMap fileExtension=".m3u8" mimeType="application/x-mpegURL" />
<mimeMap fileExtension=".ts" mimeType="video/MP2T" />
<mimeMap fileExtension=".key" mimeType="application/x-mpegURL" />

下载：??https://download.csdn.net/download/qq_37959151/15051929

<?xml version="1.0" encoding="UTF-8"?>
<configuration><system.webServer><httpProtocol><customHeaders><add name="Access-Control-Allow-Origin" value="*" /><add name="Access-Control-Allow-Methods" value="*" /><add name="Access-Control-Allow-Headers" value="*" /></customHeaders></httpProtocol><staticContent><mimeMap fileExtension=".m3u8" mimeType="application/x-mpegURL" /><mimeMap fileExtension=".key" mimeType="application/x-mpegURL" /></staticContent></system.webServer>
</configuration>

html m3u8下载

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><title>前端播放m3u8格式视频</title><link href="https://vjs.zencdn.net/7.4.1/video-js.css" rel="stylesheet"><script src='https://vjs.zencdn.net/7.4.1/video.js'></script><script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js" type="text/javascript"></script><!-- videojs-contrib-hls 用于在电脑端播放 如果只需手机播放可以不引入 -->
</head>
<body><style>.video-js .vjs-tech {
     position: relative !important;}</style><div><video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" data-setup='{}' style='width: 100%;height: auto'><source id="source" src="http://1252093142.vod2.myqcloud.com/4704461fvodcq1252093142/f865d8a05285890787810776469/playlist.f3.m3u8" type="application/x-mpegURL"></source></video></div><div class="qiehuan" style="width:100px;height: 100px;background: red;margin:0 auto;line-height: 100px;color:#fff;text-align: center">切换视频</div>
</body><script>// videojs 简单使用var myVideo = videojs('myVideo', {
     bigPlayButton: true,textTrackDisplay: false,posterImage: false,errorDisplay: false,})myVideo.play()var changeVideo = function (vdoSrc) {
     if (/\.m3u8$/.test(vdoSrc)) {
      //判断视频源是否是m3u8的格式myVideo.src({
     src: vdoSrc,type: 'application/x-mpegURL' //在重新添加视频源的时候需要给新的type的值})} else {
     myVideo.src(vdoSrc)}myVideo.load();myVideo.play();}var src = 'http://1252093142.vod2.myqcloud.com/4704461fvodcq1252093142/f865d8a05285890787810776469/playlist.f3.m3u8';document.querySelector('.qiehuan').addEventListener('click', function () {
     changeVideo(src);}) </script>