gitee page发布的静态网站,无法播放目录中的mp4视频
gitee 静态王章 mp4均提示404,资源无法获取;
·
起因是希望在gitee上部署静态网站,利用three.js VideoTexture 环境贴图播放视频。
但是试了多几次 mp4均提示404,资源无法获取;
找了很多方案,最后发现将视频转为ogv 就可以完美适配了;
附threejs使用ogv进行环境贴图的代码:
// 视频纹理
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()
}
});
开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!
更多推荐
已为社区贡献1条内容
所有评论(0)