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()
  }
});
相关推荐
乐橙开放平台1 小时前
智慧连锁客流检测和离岗检测怎么对接
大数据·人工智能·笔记·物联网·自动化·音视频·智能家居
创世虚拟世界3 小时前
我做了一个 3D 虚拟世界基底,基于这个再做 3D 虚拟世界或者元宇宙,会事半功倍
javascript·人工智能·3d·gitee·虚拟现实
Anhty3 小时前
2026最新免费手机音频处理工具 !!
android·功能测试·ios·智能手机·音视频
企业数字化笔记4 小时前
AI工具参数很多怎么办?预设、表单校验、危险参数与配置审计
java·spring boot·python·音视频
VidDown5 小时前
上传 2GB 文件别让 Django 接:分片上传、对象存储直传与秒传
python·django·音视频·状态模式·实时音视频·视频编解码·视频
7177775 小时前
有没有国产 Jira?2026 年主流国产替代方案对比与 Gitee 定位解析
gitee·jira
阿明副业观察5 小时前
AI视频生成工具功能与作用全面解析:赋能高效内容创作
大数据·人工智能·aigc·音视频·ai写作
EasyDSS6 小时前
告别视频资源浪费!云点播/本地点播/网络点播EasyDSS平台点播实现企业视频高效复用
音视频·媒体·easydss
智能直播6 小时前
RK3528 Tinyalsa/ALSA框架:输入源声音获取与HDMI out声音输出,一文讲透直播音频链路
音视频·实时音视频·视频编解码
镭封6 小时前
做电视剧解说视频用什么软件?配音、文案处理一次解决
人工智能·小程序·音视频·语音识别·媒体