javascript - WebGl - 未加载纹理

Question

我收到一个错误: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 );

    }

Answer 1

我运行一个名为 mongoose 的简单静态内容服务器在我的开发机器上本地。只需将它指向包含您的项目的文件夹，您就可以加载页面，而不必担心任何跨站点脚本/来源问题，