在使用video进行全景视频播放时,发现视频全景跨域报错!,
排查报错提示视频不支持 HLS 360 video ,但我们录制的视频是转成mp4格式的,于是再video标签上加上type
this.myPlayer = this.$video('myVideo', {
//确定播放器是否具有用户可以与之交互的控件。没有控件,启动视频播放的唯一方法是使用autoplay属性或通过Player API。
controls: true,
//自动播放属性,muted:静音播放
autoplay: "true",
//建议浏览器是否应在<video>加载元素后立即开始下载视频数据。
preload: "auto",
//设置视频播放器的显示宽度(以像素为单位)
width: "800px",
//设置视频播放器的显示高度(以像素为单位)
height: "400px",
controls: false,
sources: \[ // 视频源
{
src: src,
type: 'video/mp4'
}
\]
然后尝试还是发现不行,
发现第二条报错有提示,视频存在跨域数据,可能无法加载,于是开始排查代码,以video为中心,发现了一个 "crossorigin" 属性,
crossorigin 属性设置或返回视频的 CORS 设置。
加上该属性,发现错误解决,舒服
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。