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()
  }
});
相关推荐
专业开发者5 小时前
2020 年国际消费电子展上,蓝牙 ® 音频迎来重磅升级
音视频
专业开发者5 小时前
蓝牙低功耗音频(Bluetooth LE Audio)最具颠覆性的新功能,当属广播音频
音视频
豌豆学姐8 小时前
Sora2 短剧视频创作中如何保持人物一致性?角色创建接口教程
android·java·aigc·php·音视频·uniapp
-拟墨画扇-10 小时前
Git | 变基操作
git·gitee·github·gitcode
专业开发者10 小时前
蓝牙低功耗音频(LE Audio):蓝牙音频共享的新时代
音视频
lifewange13 小时前
Git/Gitee/GitHub有什么区别
git·gitee·github
fantasy_arch13 小时前
AV1视频编码位于图像边界的超级块划分
计算机视觉·音视频·av1
EasyDSS14 小时前
视频直播点播平台EasyDSS筑牢直播应用的“技术底座”赋能全场景音视频需求
音视频
沃虎电子14 小时前
沃虎电子【产品推荐】音频变压器:看不见的声学基石,如何定义专业音频设备的品质?
人工智能·音视频
CDwenhuohuo15 小时前
移动端app获取wifi步骤 用的uni
gitee