WebGl - 未加载纹理 [英] WebGl - not loaded texture

问题描述

我收到错误：Uncaught SecurityError：无法在'WebGLRenderingContext'上执行'texImage2D'：可能无法加载file：/// C：/Users/.../img.jpg上的跨源图像。

I receive an error: Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The cross-origin image at file:///C:/Users/.../img.jpg may not be loaded.

var scene, camera, renderer;
    var geometry, material, mesh;

    init();
    animate();

    function init() {

        scene = new THREE.Scene();

        camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
        camera.position.z = 1000;

        geometry = new THREE.CubeGeometry( 300, 300, 300 );
        material = new THREE.MeshLambertMaterial({
        map: THREE.ImageUtils.loadTexture('img.jpg')
        });

        mesh = new THREE.Mesh( geometry, material );
        scene.add( mesh );

        renderer = new THREE.WebGLRenderer();
        renderer.setSize( window.innerWidth, window.innerHeight );
        renderer.setClearColorHex( 0xFFF8DC, 1 );

        document.body.appendChild( renderer.domElement );

    }

    function animate() {

        requestAnimationFrame( animate );

        mesh.rotation.x += 0.02;
        mesh.rotation.y += 0.01;

        renderer.render( scene, camera );

    }

推荐答案

我跑我的开发机器上本地称为 mongoose 的简单静态内容服务器。只需将其指向包含项目的文件夹，即可加载页面而无需担心任何跨站点脚本/原始问题，

I run a simple static content server called mongoose locally on my development machine. Simply point it to the folder that contains your project and you can load the page without worrying about any cross site scripting/origin issues,

这篇关于WebGl - 未加载纹理的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！