处理前端访问m3u8视频文件出现跨越问题_m3u8跨域访问被拒绝

一、后端模板渲染的方式,不需要处理，不会存在跨域问题

二、如果是前后端分离项目在nginx中配置跨域

• 1、m3u8文件存放在服务器地址为`/home/video-api/public/uploads/video

• 2、修改nginx的配置

  location /uploads/video {
  	types {
  	   application/vnd.apple.mpegurl m3u8;
  	   video/mp2t ts;
  	}
  	root /home/video-api/public;
  	add_header Cache-Control no-cache;
  	# 加上这句可以处理跨域
  	add_header Access-Control-Allow-Origin *;
  }
  
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11

• 3、客户端在js代码里面输入视频地址http://【ip或者域名】/uploads/video/1686034066126185.m3u8

• 4、解析

• 当前前端请求uploads/video/xx文件的时候,到了nginx中匹配到规则,会直接将当前请求的uploads/video/xx拼接到nginx中配置的root目录的后面，最终的访问服务器上的地址是/home/video-api/public/uploads/video/xx