gitee page发布的静态网站,无法播放目录中的mp4视频

起因是希望在gitee上部署静态网站,利用three.js VideoTexture 环境贴图播放视频。

但是试了多几次 mp4均提示404,资源无法获取;

找了很多方案,最后发现将视频转为ogv 就可以完美适配了;

mp4转ogv

附threejs使用ogv进行环境贴图的代码:

js 复制代码
// 视频纹理
const video = document.createElement("video");
video.src = "./images/test.ogv";
video.loop = true;

let palneTexture4 = new THREE.TextureLoader().load("./images/ruime7.jpg");
const planeGeometry4 = new THREE.PlaneGeometry(10, 12);
const planeMaterial4 = new THREE.MeshBasicMaterial({
  // color: 0xffffff,
  map: palneTexture4
});
const plane4 = new THREE.Mesh(planeGeometry4, planeMaterial4);
plane4.position.y = 2;
plane4.position.z = 16;
plane4.rotation.y = Math.PI + Math.PI / 2;

window.addEventListener("click", (e) => {
  // 当鼠标移动的时候播放视频
  //   判断视频是否处于播放状态
  if (video.paused) {
    video.play();
    let texture = new THREE.VideoTexture(video);
    planeMaterial4.map = texture;
    planeMaterial4.map.needsUpdate = true;
  } else {
    video.pause()
  }
});
相关推荐
赖small强11 分钟前
【音视频开发】Linux UVC (USB Video Class) 驱动框架深度解析
linux·音视频·v4l2·uvc
赖small强27 分钟前
【音视频开发】ISP流水线核心模块深度解析
音视频·isp·白平衡·亮度·luminance·gamma 校正·降噪处理
赖small强1 小时前
【音视频开发】Linux V4L2 (Video for Linux 2) 驱动框架深度解析白皮书
linux·音视频·v4l2·设备节点管理·视频缓冲队列·videobuf2
ACP广源盛139246256735 小时前
GSV2712@ACP#2 进 1 出 HDMI 2.0/Type-C DisplayPort 1.4 混合切换器 + 嵌入式 MCU
单片机·嵌入式硬件·计算机外设·音视频
AI周红伟6 小时前
通义万相开源14B数字人Wan2.2-S2V!影视级音频驱动视频生成,助力专业内容创作
音视频
AI周红伟6 小时前
数字人视频生成:Wan2.2-S2V-14B: 音频驱动的电影视频生成
音视频
EasyCVR7 小时前
智能农业实践:视频融合平台EasyCVR的农业大棚可视化监控方案
音视频
赖small强8 小时前
【音视频开发】CMOS Sensor图像采集原理及Linux主控ISP处理流程
linux·音视频·cmos·isp·v4l2
de_furina9 小时前
[C++]string类的使用和模拟实现
开发语言·c++·gitee
EasyCVR10 小时前
视频汇聚平台EasyCVR助力打造太阳能供电远程视频监控系统
音视频