webassembly——同源策略问题的处理（浏览器不能加载本地资源的问题）

webassembly——同源策略问题的处理（浏览器不能加载本地资源的问题）

当你希望浏览器运行本地上的wasm模块时（或者使用fetch对获取本机的URL资源时），你可能会碰到以下问题：

已拦截跨源请求：同源策略禁止读取位于 file:///C:/Users/95461/Desktop/%E6%95%99%E7%A8%8B/index.wasm 的远程资源。（原因：CORS 请求不是 http）。
TypeError: NetworkError when attempting to fetch resource.

这意味者你是在本地直接打开html，并在该页面中企图加载本地文件夹下的wasm文件，因而违背同源策略。
参考资料：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/CORS/Errors/CORSRequestNotHttp

分析：在加载wasm模块时，会将指向wasm模块的URL作为fetch()的参数 。在一些浏览器中，使用fetch（）直接获取同与html文件同一文件夹下的本地资源时，会触发同源策略问题。

解决途径：
1、使用Microsoft Edge打开本地的“包含加载wasm模块”的html页面。(我当前版本为Microsoft Edge 44.18362.449.0) 。
不是所有浏览器都有同样严格的同源策略，使用edge浏览器可以避免开发过程中碰到此类问题。

2、打开本地http服务器。将页面涉及的资源放置到本地服务器上，再在浏览器上以http://打开（而非file://）。
我一般使用xampp工具箱，挺方便的。将页面资源全部放在xampp指定的文件夹下，具体使用方法请自行查找。

3、对所使用的浏览器进行设置。
以下转载于:https://blog.51cto.com/lindianli/1557510
Chrome:
1、
（1）得到Chrome的安装路径，例如：C:\Program Files\Google\Chrome\Application
（2）在命令行窗口，输入安装路径，加上–allow-file-access-from-files参数，例如：
Chrome installation path\chrome.exe --allow-file-access-from-files
重新启动浏览器即可。
2、
在Chrome的快捷方式，右键->属性->目标的文本框中加上参数 --allow-file-access-from-files
例：“C:\Program Files \Google\Chrome\Application\chrome.exe” --allow-file-access-from-files
（我没试过）

Firefox：
1、在浏览器的地址栏输入“about:config”，回车
2、在过滤器（filter）中搜索“security.fileuri.strict_origin_policy”
3、将security.fileuri.strict_origin_policy设置为false
4、关闭目前开启的所有Firefox窗口，然后重新启动Firefox。
（亲测有效）