解决M3U8提示has been blocked by CORS policy: No ‘Access-Control-Allow-Origin‘ header

环境:
后台:springboot_xxx.jar
代理:nginx
前端:vue
视频流:hls(m3u8)
视频播放器:vue-video-player

"vue-video-player": "^5.0.2",
"videojs-contrib-hls": "^5.15.0",

问题描述:
VUE按网上教程已经销毁播放流,在Windows电脑的chrome没问题,但是在苹果电脑的chrome和Windows的uc浏览器里不能二次播放,需要清空缓存才能播放。

destroyed() {
    this.$destroy();
  },
  

解决方案:
在nginx加以下配置:

 location ~* \.(m3u8|ts)$ {
                proxy_cache off;                                   # 禁用代理缓存
                expires -1;                                        # 禁用页面缓存
                proxy_pass http://example.com;                     # 反代目标 URL
                sub_filter_last_modified off;                      # 删除原始响应里的浏览器缓存值
                sub_filter_once off;                               # 替换所有匹配内容
                sub_filter_types *;                                # 匹配任何 MIME 类型

        }

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值