【JavaScript：编译错误】Image from origin 'file://' has been blocked from loading by Cross-Origin Resource

问题描述：

Image from origin 'file://' has been blocked from loading by Cross-Origin Resource Sharing policy: Received an invalid response. Origin 'null' is therefore not allowed access.

中文翻译：来自“file：//”的图像已被跨源资源共享策略阻止加载：收到无效响应。 因此不允许原点'null'访问。

 

当时直接用chrome浏览器打开three.js中的example中的 .html文件。【比如webgl_materials_texture_anisotropy.html】

正常的：

断点：

three.js  中34444 行： var image = document.createElementNS( 'http://www.w3.org/1999/xhtml', 'img' )；

html中117行：var texture1 = textureLoader.load( "textures/crate.gif" );

html中124行：var texture2 = textureLoader.load( "textures/crate.gif" );

发现可能是“异步加载”的原因，导致html中加载的函数都运行好一段时间后才报错，并且除了部分没显示，其他内容都正常显示了。

 

问题分析：

可能还是JavaScript限制了读取本地文件的问题。

 

解决方法：

  1、在chrome快捷方式中的属性中添加上--allow-file-access-from-files 这个命令行参数。

  但是这个方法是不一定好，必须手动修改快捷方式的内容。

  不知道是否可以通过代码设置来处理。这样不需要客户都修改自己的浏览器参数。

  而且这个读取本地文件的方法是否会应生出其他不安全的隐患？