webview跨域问题解决方案

前端之家收集整理的这篇文章主要介绍了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主要用于 设置是否允许通过 fileurl 加载的 Javascript 读取其他的本地文件
setAllowUniversalAccessFromFileURLs 可以设置是否允许通过 fileurl 加载的 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, 从而可以获取 我们 应用的内部私有文件

猜你在找的Ajax相关文章