webview跨域问题解决方案

hi,all

本邮件分六部分：目的、意义、步骤、具体实现及测试办法，调研结论（3点），额外思考

一、调研目的

浏览器的同源策略阻止了跨域访问，本次调研目的就是为了解决这个问题，让客户端可跨域访问其他网站

二、意义：

1、跨域问题的解决，扩展了客户端解决缓存问题的思路，可达到完全控制缓存、较好的利用缓存的目的，从而可利用缓存达到提高H5页面的加载速度的目的 。

2、为客户端自行调试提供了方便。

三、调研步骤：

1、把html+js+css+资源文件放到本地。

2、webview加载html+js+css+资源文件。

3、html此时都是本地域，要访问其他网站，需要解决跨域问题，此步骤就是要通过客户端来解决跨域问题。

4、通过js代码请求其他域名的网站（如米学网），请求成功，返回测试结果。

四、具体实现及测试办法：以android为例，IOS可参考实现。所有的测试文件都已写好，请见附件。

1、把html+js+css+资源文件放到本地。（参考文件如附件）

2、 webview加载html+js+css+资源文件。

3、解决跨域的问题，访问其他网站接口。

android端可通过设置setAllowUniversalAccessFromFileURLs来解决跨域访问的目的。

这个方法的描述如下：

可见，要想跨域访问，此值默认为true,经测试，设置为false后，就不可以跨域访问了。

但这个方法目前需要在api level 16以上使用，即对应android系统为4.1版本。也就是说4.1版本以上才可以。

不过，这个问题不大，一方面是4.1以下的机器比较少了，另一方面，客户端可做版本区分 。4.1以下的还是加载网页或用webview自定义缓存。4.1以上才做我们自己定义的缓存。

android端还涉及一个方法 setAllowFileAccessFromFileURLs，官网描述如下：

 从描述上可看出两者的区别是：

setAllowFileAccessFromFileURLs主要用于设置是否允许通过file url加载的Javascript读取其他的本地文件

setAllowUniversalAccessFromFileURLs可以设置是否允许通过file url加载的Javascript可以访问其他任何的源，也就是说，它包括其他的文件和http,https等其他的源

如果设置了 setAllowUniversalAccessFromFileURLs为true，则setAllowFileAccessFromFileURLs就不用设置了。

4、通过js代码请求其他域名的网站（如米学网），请求成功，返回测试结果。

点击按钮，进行xmlhttpRequest请求，请求的URL是咱们米学网的userinfo接口：http://www.mexue.com/mobile/api/userInfo?m=getUserInfo&userId=5574de0f0cf277e7040db77a&token=97d3059fc6d06e321f011fd7190db41b

此时，如果请求成功，页面会弹出如下提示。

  五、调研结论：

1、android本地可加载图片资源到html

2、android端可实现跨域访问。

3、android端可通过本地路径"file:///android_asset/main.css"加载到js和css文件

  六、额外的思考：

有一种安全性的思考：就是假如其他的应用知道我们的包名和类名，那么可以让我们的应用加载一个恶意的url,从而可以获取我们应用的内部私有文件。