就目前而言，如何应对版本的频繁更新呢，又如何灵活多变地展示我们的界面呢,这又涉及到了web app与native app之间孰优孰劣的争论. 于是乎,一种混合型的app诞生了,灵活多变的部分，如淘宝商城首页的活动页面，一集凡客诚品中我们都可以见到web 页面与native页面的混合，既利用了web app的灵活易更新，也借助了native app本身的效率.
当然，就会用到webview这样的一个控件，这里，我把自己使用过程中遇到的一些问题整理下来.
首先上张图对WebView进行一个基本的回顾:
以上思维导图原文件下载地址:
http://download.csdn.net/detail/t12x3456/6509195
然后看一下具体的问题及解决方案:
1.为WebView自定义错误显示界面:
覆写WebViewClient中的onReceivedError()方法:
[java] view plain copy
/**
* 显示自定义错误提示页面，用一个View覆盖在WebView
*/
protected void showErrorPage() {
LinearLayout webParentView = (LinearLayout)mWebView.getParent()
initErrorPage()
while (webParentView.getChildCount() >1) {
webParentView.removeViewAt(0)
}
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT)
webParentView.addView(mErrorView, 0, lp)
mIsErrorPage = true
}
protected void hideErrorPage() {
LinearLayout webParentView = (LinearLayout)mWebView.getParent()
mIsErrorPage = false
while (webParentView.getChildCount() >1) {
webParentView.removeViewAt(0)
}
}
protected void initErrorPage() {
if (mErrorView == null) {
mErrorView = View.inflate(this, R.layout.online_error, null)
Button button = (Button)mErrorView.findViewById(R.id.online_error_btn_retry)
button.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
mWebView.reload()
}
})
mErrorView.setOnClickListener(null)
}
}
[java] view plain copy
[java] view plain copy
[java] view plain copy
@Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
<span style="white-space:pre"> </span>
<span style="white-space:pre"> </span>mErrorView.setVisibility(View.VISIBLE)
<span style="white-space:pre"> </span>super.onReceivedError(view, errorCode, description, failingUrl)
}
2.WebView cookies清理：
[java] view plain copy
CookieSyncManager.createInstance(this)
CookieSyncManager.getInstance().startSync()
CookieManager.getInstance().removeSessionCookie()
3.清理cache 和历史记录:
[java] view plain copy
webView.clearCache(true)
webView.clearHistory()
4.判断WebView是否已经滚动到页面底端:
[java] view plain copy
getScrollY()方法返回的是当前可见区域的顶端距整个页面顶端的距离,也就是当前内容滚动的距离.
getHeight()或者getBottom()方法都返回当前WebView 这个容器的高度
getContentHeight 返回的是整个html 的高度,但并不等同于当前整个页面的高度,因为WebView 有缩放功能, 所以当前整个页面的高度实际上应该是原始html 的高度再乘上缩放比例. 因此,更正后的结果,准确的判断方法应该是：
if(WebView.getContentHeight*WebView.getScale() == (webview.getHeight()+WebView.getScrollY())){ //已经处于底端 }
5.URL拦截:
Android WebView是拦截不到页面内的fragment跳转的。但是url跳转的话，又会引起页面刷新，H5页面的体验又下降了。只能给WebView注入JS方法了。
6.处理WebView中的非超链接请求(如Ajax请求):
有时候需要加上请求头，但是非超链接的请求，没有办法再shouldOverrinding中拦截并用webView.loadUrl(String url,HashMap headers)方法添加请求头
目前用了一个临时的办法解决：
首先需要在url中加特殊标记/协议, 如在onWebViewResource方法中拦截对应的请求，然后将要添加的请求头，以get形式拼接到url末尾
在shouldInterceptRequest()方法中,可以拦截到所有的网页中资源请求，比如加载JS，图片以及Ajax请求等等
Ex:
[java] view plain copy
@SuppressLint("NewApi")
@Override
public WebResourceResponse shouldInterceptRequest(WebView view,String url) {
// 非超链接(如Ajax)请求无法直接添加请求头，现拼接到url末尾,这里拼接一个imei作为示例
String ajaxUrl = url
// 如标识:req=ajax
if (url.contains("req=ajax")) {
ajaxUrl += "&imei=" + imei
}
return super.shouldInterceptRequest(view, ajaxUrl)
}
7.在页面中先显示图片:
[java] view plain copy
@Override
public void onLoadResource(WebView view, String url) {
mEventListener.onWebViewEvent(CustomWebView.this, OnWebViewEventListener.EVENT_ON_LOAD_RESOURCE, url)
if (url.indexOf(".jpg") >0) {
hideProgress()//请求图片时即显示页面
mEventListener.onWebViewEvent(CustomWebView.this, OnWebViewEventListener.EVENT_ON_HIDE_PROGRESS, view.getUrl())
}
super.onLoadResource(view, url)
}
8.屏蔽掉长按事件 因为webview长按时将会调用系统的复制控件:
[java] view plain copy
mWebView.setOnLongClickListener(new OnLongClickListener() {
@Override
public boolean onLongClick(View v) {
return true
}
})
9.在WebView加入 flash支持:
[java] view plain copy
String temp = "<html><body bgcolor=\"" + "black"
+ "\"><br/><embed src=\"" + url + "\" width=\"" + "100%"
+ "\" height=\"" + "90%" + "\" scale=\"" + "noscale"
+ "\" type=\"" + "application/x-shockwave-flash"
+ "\"></embed></body></html>"
String mimeType = "text/html"
String encoding = "utf-8"
web.loadDataWithBaseURL("null", temp, mimeType, encoding, "")
10.WebView保留缩放功能但隐藏缩放控件:
[java] view plain copy
mWebView.getSettings().setSupportZoom(true)
mWebView.getSettings().setBuiltInZoomControls(true)
if (DeviceUtils.hasHoneycomb())
mWebView.getSettings().setDisplayZoomControls(false)
HTTP协议中的 Authorization 请求消息头含有服务器用于验证用户代理身份的凭证，通常会在服务器返回 401 Unauthorized 状态码以及 WWW-Authenticate 消息头之后在后续请求中发送此消息头。
格式是Basic字符串+空格+ 用户名:密码 的Base64编码。
将凭证<credentials>部分进行Base64编码，然后再拼接字符串'Basic '，就可以生成基础验证方案。
因为DOMString 是16位编码的字符串，如果有字符超出了8位ASCII编码的字符范围时，在大多数的浏览器中对Unicode字符串调用 window.btoa将会造成一个 Character Out Of Range 的异常。
所以下列方法将UTF-16的 DOMStrin 转码为UTF-8的字符数组然后再编码。
将UTF-16的 DOMString 转码成UTF-8的字符串进行base64编码
使用 eoLinker 发送Basic Auth，输入用户名scar 密码123456
PS: eoLinker是一个很好用的接口管理网站，前端测试很方便
在JS Bin运行后，发现和eoLinker结果一致，成功！！
Authorization
Authentication
Javascript base64
Base64的编码与解码
Base64笔记-阮一峰老师
btoa方法
遇到一个需求：在网页抛出一切请求时，不管是资源请求还是重定向等，需要拦截掉并在header添加信息，ng拿到去做处理，访问不同资源服务器。
一开始想到的方式是：通过WKNavigationDelegate的代理方法- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
来在请求之前获得请求信息，并把请求头信息添加进去，如下：
-(void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler{
NSLog(@"灰度测试h5Url: %@",navigationAction.request.URL.absoluteString)
if ([navigationAction.request.URL.absoluteString containsString:OUR_URL_ID]) {
// 拦截所有网络请求头，重新添加参数请求头信息
NSMutableURLRequest *mutableRequest = [navigationAction.request mutableCopy]
NSDictionary *requestHeaders = navigationAction.request.allHTTPHeaderFields
if ([requestHeaders isKindOfClass:[NSDictionary class]]) {
//简单通过Version_Key判断下是否已经加入了请求信息
if ([AFNetWorkManager KeyUrlrequestOneNull:requestHeaders]) {
[AFNetWorkManager addWebDefaultKeyUrlrequest:mutableRequest]
[webView loadRequest:mutableRequest]
NSLog(@"灰度测试h5Url: %@ \n请求头：%@",navigationAction.request.URL.absoluteString,mutableRequest.allHTTPHeaderFields)
decisionHandler(WKNavigationActionPolicyCancel)
return
}else{
//参数正常，放开请求
NSLog(@"灰度测试h5Url: %@ \n请求头：%@",navigationAction.request.URL.absoluteString,requestHeaders)
decisionHandler(WKNavigationActionPolicyAllow)
}
}else{
//没有请求头,加上新的请求头，并赋予参数
mutableRequest.allHTTPHeaderFields = [NSMutableDictionary new]
[AFNetWorkManager addWebDefaultKeyUrlrequest:mutableRequest]
[webView loadRequest:mutableRequest]
NSLog(@"灰度测试h5Url: %@ \n请求头：%@",navigationAction.request.URL.absoluteString,mutableRequest.allHTTPHeaderFields)
decisionHandler(WKNavigationActionPolicyCancel)
}
}else{
//本地请求资源，pdf等
decisionHandler(WKNavigationActionPolicyAllow)
}
}
但是经过打印发现，只拦截了一些html请求，向png、css、js资源请求，并没有拦截到，甚至没有走这个方法。
无奈，只能网上搜索，结果发现了：https://github.com/fenglee594/WKWebViewRequestHook
这个demo，稍加改动，亲测有效。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）