2024年Web前端最新WebView交互架构项目实战(三):多进程WebView使用实践,各种风格的前端面试题进来了解一下

其实前端开发的知识点就那么多,面试问来问去还是那么点东西。所以面试没有其他的诀窍,只看你对这些知识点准备的充分程度。so,出去面试时先看看自己复习到了哪个阶段就好。

这里再分享一个复习的路线:(以下体系的复习资料是我从各路大佬收集整理好的)

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

《前端开发四大模块核心知识笔记》

最后,说个题外话,我在一线互联网企业工作十余年里,指导过不少同行后辈。帮助很多人得到了学习和成长。

我意识到有很多经验和知识值得分享给大家,也可以通过我们的能力和经验解答大家在IT学习中的很多困惑,所以在工作繁忙的情况下还是坚持各种整理和分享。

prompt(“settitle”,JSON.stringify(params))

},

‘params’: {},

‘callback’: function(res) {}

},

}catch(e){

alert(‘demo.js error:’+e);

}

var readyEvent = document.createEvent(‘Events’);

readyEvent.initEvent(‘JSBridgeReady’, true, true);

document.dispatchEvent(readyEvent)

})();

关于 JS 延迟加载

Android 的 OnPageFinished 事件会在 Javascript 脚本执行完成之后才会触发。如果在页面中使 用JQuery,会在处理完 DOM 对象,执行完 $(document).ready(function() {}); 事件自会后才会渲染并显示页面。而同样的页面在 iPhone 上却是载入相当的快,因为 iPhone 是显示完页面才会触发脚本的执行。所以我们这边的解决方案延迟 JS 脚本的载入,这个方面的问题是需要Web前端工程师帮忙优化的。

**

*2:使用第三方 WebView 内核***

WebView 的兼容性一直也是困扰我们 Android 开发者的一个大问题,不说 Android 4.4 版本 Google 使用了Chromium 替代 Webkit 作为 WebView 内核,就看看国内众多的第三方 ROM 都有可能会对原生的 WebView 做出修改,这时候如果出现兼容问题,是非常难定位到问题和解决的。

在一次使用微信浏览订阅公众号文章的过程中,发现微信的 H5 页面有一行 『QQ 浏览器 X5 内核提供技术支持』。顺着这个线索我就找到了腾讯浏览服务。发现腾讯已经把这个功能开放了,而且集成的 SDK 很小只有212 KB。这是很惊人的,通过介绍才发现这个 SDK 是可以共享微信和手机 QQ 的 X5 内核。这就很方便了,作为国内市场最不可或缺的两个 App,我们能只需要集成一个很小的 SDK 就可以共享使用 X5 内核了,不得不说腾讯还是很有想法的。

简单摘录些功能亮点,想必能让大家高潮一番。详细内容大家可以直接到腾讯浏览服务看看,我相信不会让你们失望的。

网页浏览能力

Web页面crash率降低75%

页面打开速度提升35%

流量节省60%

阅读模式

去除网页中广告等杂质

优化文章的阅读体验

文件打开能力

包括会话页的互传文件及邮件中附件

支持doc、ppt、xls、pdf等办公格式

支持jpg、gif、png、bmp等图片格式

支持zip、rar等压缩文件

支持mp3、mp4、RMVB等音视频格式

视频菜单能力

支持屏幕调节等常规视频菜单功能

灵活切换全屏&小窗功能

*3:加快HTML网页装载完成的速度*

默认情况html代码下载到WebView后,webkit开始解析网页各个节点,发现有外部样式文件或者外部脚本文件时,会异步发起网络请求下载文件,但如果在这之前也有解析到image节点,那势必也会发起网络请求下载相应的图片。在网络情况较差的情况下,过多的网络请求就会造成带宽紧张,影响到css或js文件加载完成的时间,造成页面空白loading过久。解决的方法就是告诉WebView先不要自动加载图片,等页面finish后再发起图片加载。

故在WebView初始化时设置如下代码:

public void int () {

if(Build.VERSION.SDK_INT >= 19) {

webView.getSettings().setLoadsImagesAutomatically(true);

} else {

webView.getSettings().setLoadsImagesAutomatically(false);

}

}

同时在WebView的WebViewClient实例中的onPageFinished()方法添加如下代码:

@Override

public void onPageFinished(WebView view, String url) {

if(!webView.getSettings().getLoadsImagesAutomatically()) {

webView.getSettings().setLoadsImagesAutomatically(true);

}

}

从上面的代码,可以看出我们对系统API在19以上的版本作了兼容。因为4.4以上系统在onPageFinished时再恢复图片加载时,如果存在多张图片引用的是相同的src时,会只有一个image标签得到加载,因而对于这样的系统我们就先直接加载。

**

*4:自定义出错界面***

当WebView加载页面出错时(一般为404 NOT FOUND),安卓WebView会默认显示一个卖萌的出错界面。但我们怎么能不让用户发现原来我使用的是网页应用呢,我们期望的是用户在网页上得到是如原生般应用的体验,那就先要从干掉这个默认出错页面开始。当WebView加载出错时,我们会在WebViewClient实例中的onReceivedError()方法接收到错误,我们就在这里做些手脚:

@Override

public void onReceivedError (WebView view, int errorCode, String description, String failingUrl) {

super.onReceivedError(view, errorCode, description, failingUrl);

loadDataWithBaseURL(null, “”, “text/html”, “utf-8”, null);

mErrorFrame.setVisibility(View.VISIBLE);

}

从上面可以看出,我们先使用loadDataWithBaseURL清除掉默认错误页内容,再让我们自定义的View得到显示(mErrorFrame为蒙在WebView之上的一个LinearLayout布局,默认为View.GONE)。

远程网页需访问本地资源

当我们在WebView中加载出从web服务器上拿取的内容时,是无法访问本地资源的,如assets目录下的图片资源,因为这样的行为属于跨域行为(Cross-Domain),而WebView是禁止的。解决这个问题的方案是把html内容先下载到本地,然后使用loadDataWithBaseURL加载html。这样就可以在html中使用 file:///android_asset/xxx.png 的链接来引用包里面assets下的资源了。示例如下:

private void loadWithAccessLocal(final String htmlUrl) {

new Thread(new Runnable() {

public void run() {

try {

final String htmlStr = NetService.fetchHtml(htmlUrl);

if (htmlStr != null) {

TaskExecutor.runTaskOnUiThread(new Runnable() {

@Override

public void run() {

loadDataWithBaseURL(htmlUrl, htmlStr, “text/html”, “UTF-8”, “”);

}

});

return;

}

} catch (Exception e) {

Log.e(“Exception:” + e.getMessage());

}

TaskExecutor.runTaskOnUiThread(new Runnable() {

@Override

public void run() {

onPageLoadedError(-1, “fetch html failed”);

}

});

}

}).start();

}

上面有几点需要注意:

•从网络上下载html的过程应放在工作线程中

•html下载成功后渲染出html的步骤应放在UI主线程,不然WebView会报错

•html下载失败则可以使用我们前面讲述的方法来显示自定义错误界面

5:WebView 导致的内存泄露

Android 中的 WebView 存在很大的兼容性问题,不仅仅是 Android 系统版本的不同对 WebView 产生很大的差异,另外不同的厂商出货的 ROM 里面 WebView 也存在着很大的差异。更严重的是标准的 WebView 存在内存泄露的问题,看这里WebView causes memory leak - leaks the parent Activity。所以通常根治这个问题的办法是为 WebView 开启另外一个进程,通过 AIDL 与主进程进行通信,WebView 所在的进程可以根据业务的需要选择合适的时机进行销毁,从而达到内存的完整释放。

这段话来自胡凯翻译的 Google Android 内存优化之 OOM 。这里提到的让 WebView 独立运行在一个进程里,用完 WebView 后直接销毁这个进程,即使内存泄露了,也不会影响到主进程。微信,手 Q 等 App 也采用了这个方案。但是这就涉及到了跨进程通讯,处理起来就比较麻烦。

另外个解决方案,就是使用自己封装的 WebView,比如上面提到的 X5 内核,且使用 WebView 的时候,不在 XML 里面声明,而是在代码中直接 new 出来,传入 application context 来防止 activity 引用被滥用。

WebView webView = new WebView(getContext().getApplicationContext();

webFrameLayout.addView(webView, 0);

在使用了这个方式后,基本上 90% 的 WebView 内存泄漏的问题便得以解决。

6:客户端UI优化

怎么让用户看不到WebView加载前的白色页面呢?首次加载后页面的跳转可以用上面的步骤进行优化,可以提供给用户一个很好的体验,那加载的第一页呢?我们需要WebView预加载页面,这个该怎么做到的呢?下面提供两种方法:

ViewPager,将欢迎页面与WebView页面一起放进ViewPager中,设置预加载页面个数,使WebView所在页面可以预加载,在加载完毕的时候切换到WebView所在页面。

FrameLayout,将欢迎页面与WebView页面的布局合在一起,显示在一个页面内,起始隐藏WebView布局,待WebView加载完毕,隐藏欢迎布局,显示WebView布局。

使用FrameLayout简单一些,两种方法都是需要对WebChromeClient的onProgressChanged进行监听,加载完毕进行页面切换,如下:

webView.setWebChromeClient(new WebChromeClient() {

@Override

public void onProgressChanged(WebView view, int newProgress) {

super.onProgressChanged(view, newProgress);

if (newProgress >= 100) {

// 切换页面

}

}

});

*7:WebView独立进程*

有效增大App的运存,减少由webview引起的内存泄露对主进程内存的占用。

避免WebView的Crash影响App主进程的运行。

拥有对WebView独立进程操控权。

WebView进程与其他进程通讯的方式

把webview独立进程之后会发现,埋点功能和接收主进程数据都不正常了,这里就涉及到进程间通讯的问题了;

进程通讯无非就是那几种,aidl,messager,content provider,广播;

在这里就不再复述了,我是采用广播的方式来做的。

*8:WebView硬件加速导致页面渲染闪烁*

4.0以上的系统我们开启硬件加速后,WebView渲染页面更加快速,拖动也更加顺滑。但有个副作用就是,当WebView视图被整体遮住一块,

然后突然恢复时(比如使用SlideMenu将WebView从侧边滑出来时),这个过渡期会出现白块同时界面闪烁。

解决这个问题的方法是在过渡期前将WebView的硬件加速临时关闭,过渡期后再开启,代码如下:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) { webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null);}

9:webview的配置

WebSettings用于管理WebView状态配置,当WebView第一次被创建时,WebView包含着一个默认的配置,这些默认的配置将通过get方法返回,通过WebView中的getSettings方法获得一个WebSettings对象,如果一个WebView被销毁,在WebSettings中所有回调方法将抛出IllegalStateException异常。

1、setSupportZoom(boolean support)

设置WebView是否支持使用屏幕控件或手势进行缩放,默认是true,支持缩放。

getSettings.setSupportZoom(false);

2、setMediaPlaybackRequiresUserGesture(boolean require)

设置WebView是否通过手势触发播放媒体,默认是true,需要手势触发。

getSettings.setMediaPlaybackRequiresUserGesture(false);

3、setBuiltInZoomControls(boolean enabled)

设置WebView是否使用其内置的变焦机制,该机制集合屏幕缩放控件使用,默认是false,不使用内置变焦机制。

getSettings.setBuiltInZoomControls(true);

4、setDisplayZoomControls(boolean enabled)

设置WebView使用内置缩放机制时,是否展现在屏幕缩放控件上,默认true,展现在控件上。

getSettings.setDisplayZoomControls(false);

5、setAllowFileAccess(boolean allow)

设置在WebView内部是否允许访问文件,默认允许访问。

getSettings.setAllowFileAccess(false);

6、setAllowContentAccess(boolean allow)

设置WebView是否使用其内置的变焦机制,该机制结合屏幕缩放控件使用,默认是false,不使用内置变焦机制。

getSettings.setAllowContentAccess(false);

7、setLoadWithOverviewMode(boolean overview)

设置WebView是否使用预览模式加载界面。

getSettings.setLoadWithOverviewMode(false);

8、setSaveFormData(boolean save)

设置WebView是否保存表单数据,默认true,保存数据。

getSettings.setSaveFormData(false);

9、setTextZoom(int textZoom)

设置WebView中加载页面字体变焦百分比,默认100,整型数。

getSettings.setTextZoom(100);

10、setAcceptThirdPartyCookies(boolean accept)

设置WebView访问第三方Cookies策略,参考CookieManager提供的方法:setShouldAcceptThirdPartyCookies。

getSettings.setAcceptThirdPartyCookies(false);

11、setUseWideViewPort(boolean use)

设置WebView是否使用viewport,当该属性被设置为false时,加载页面的宽度总是适应WebView控件宽度;当被设置为true,当前页面包含viewport属性标签,在标签中指定宽度值生效,如果页面不包含viewport标签,无法提供一个宽度值,这个时候该方法将被使用。

getSettings.setUseWideViewPort(false);

12、setSupportMultipleWindows(boolean support)

设置WebView是否支持多屏窗口,参考WebChromeClient#onCreateWindow,默认false,不支持。

getSettings.setSupportMultipleWindows(true);

13、setLayoutAlgorithm(LayoutAlgorithm l)

设置WebView底层的布局算法,参考LayoutAlgorithm#NARROW_COLUMNS,将会重新生成WebView布局

getSettings.setLayoutAlgorithm(LayoutAlgorithm l);

14、setStandardFontFamily(String font)

设置WebView标准字体库字体,默认字体“sans-serif”。

getSettings.setStandardFontFamily(“sans-serif”);

15、setFixedFontFamily(String font)

设置WebView固定的字体库字体,默认“monospace”。

getSettings.setFixedFontFamily(“monospace”);

16、setSansSerifFontFamily(String font)

设置WebView Sans SeriFontFamily字体库字体,默认“sans-serif”。

getSettings.setSansSerifFontFamily(“sans-serif”);

17、setSerifFontFamily(String font)

设置WebView seri FontFamily字体库字体,默认“sans-serif”。

getSettings.setSansSerifFontFamily(“sans-serif”);

18、setCursiveFontFamily(String font)

设置WebView字体库字体,默认“cursive”

getSettings.setCursiveFontFamily(“cursive”);

19、setFantasyFontFamily(String font)

设置WebView字体库字体,默认“fantasy”。

getSettings.setFantasyFontFamily(“fantasy”);

20、setMinimumFontSize(int size)

设置WebView字体最小值,默认值8,取值1到72

getSettings.setMinimumFontSize(8);

21、setMinimumLogicalFontSize(int size)

设置WebView逻辑上最小字体值,默认值8,取值1到72

getSettings.setMinimumLogicalFontSize(8);

22、setDefaultFontSize(int size)

设置WebView默认值字体值,默认值16,取值1到72

getSettings.setDefaultFontSize(16);

23、setDefaultFixedFontSize(int size)

设置WebView默认固定的字体值,默认值16,取值1到72

getSettings.setDefaultFixedFontSize(16);

24、setLoadsImagesAutomatically(boolean flag)

设置WebView是否加载图片资源,默认true,自动加载图片

getSettings.setLoadsImagesAutomatically(false);

25、setBlockNetworkImage(boolean flag)

设置WebView是否以http、https方式访问从网络加载图片资源,默认false

getSettings.setBlockNetworkImage(true);

26、setBlockNetworkLoads(boolean flag)

设置WebView是否从网络加载资源,Application需要设置访问网络权限,否则报异常

getSettings.setBlockNetworkLoads(true);

27、setJavaScriptEnabled(boolean flag)

设置WebView是否允许执行JavaScript脚本,默认false,不允许

getSettings.setJavaScriptEnabled(true);

28、setAllowUniversalAccessFromFileURLs(boolean flag)

设置WebView运行中的脚本可以是否访问任何原始起点内容,默认true

getSettings.setAllowUniversalAccessFromFileURLs(false);

29、setAllowFileAccessFromFileURLs(boolean flag)

设置WebView运行中的一个文件方案被允许访问其他文件方案中的内容,默认值true

getSettings.setAllowFileAccessFromFileURLs(false);

30、setGeolocationDatabasePath(String databasePath)

设置WebView保存地理位置信息数据路径,指定的路径Application具备写入权限

getSettings.setGeolocationDatabasePath(String path);

31、setAppCacheEnabled(boolean flag)

设置Application缓存API是否开启,默认false,设置有效的缓存路径参考setAppCachePath(String path)方法

getSettings.setAppCacheEnabled(true);

32、setAppCachePath(String appCachePath)

设置当前Application缓存文件路径,Application Cache API能够开启需要指定Application具备写入权限的路径

getSettings.setAppCachePath(String appCachePath);

33、setDatabaseEnabled(boolean flag)

设置是否开启数据库存储API权限,默认false,未开启,可以参考setDatabasePath(String path)

getSettings.setDatabaseEnabled(false);

34、setDomStorageEnabled(boolean flag)

设置是否开启DOM存储API权限,默认false,未开启,设置为true,WebView能够使用DOM storage API

getSettings.setDomStorageEnabled(true);

35、setGeolocationEnabled(boolean flag)

设置是否开启定位功能,默认true,开启定位

getSettings.setGeolocationEnabled(false);

36、setJavaScriptCanOpenWindowsAutomatically(boolean flag)

设置脚本是否允许自动打开弹窗,默认false,不允许

getSettings.setJavaScriptCanOpenWindowsAutomatically(true);

37、setDefaultTextEncodingName(String encoding)

设置WebView加载页面文本内容的编码,默认“UTF-8”。

getSettings.setDefaultTextEncodingName(“UTF-8”);

38、setUserAgentString(String ua)

设置WebView代理字符串,如果String为null或为空,将使用系统默认值

getSettings.setUserAgentString(String ua);

39、setNeedInitialFocus(boolean flag)

设置WebView是否需要设置一个节点获取焦点当被回调的时候,默认true

getSettings.setNeedInitialFocus(false);

40、setCacheMode(int mode)

重写缓存被使用到的方法,该方法基于Navigation Type,加载普通的页面,将会检查缓存同时重新验证是否需要加载,如果不需要重新加载,将直接从缓存读取数据,允许客户端通过指定LOAD_DEFAULT、LOAD_CACHE_ELSE_NETWORK、LOAD_NO_CACHE、LOAD_CACHE_ONLY其中之一重写该行为方法,默认值LOAD_DEFAULT

getSettings.setCacheMode(WebSettings.LOAD_DEFAULT);

LOAD_CACHE_ONLY: 不使用网络,只读取本地缓存数据

LOAD_DEFAULT: 根据cache-control决定是否从网络上取数据。

LOAD_CACHE_NORMAL: API level 17中已经废弃, 从API level 11开始作用同LOAD_DEFAULT模式

LOAD_NO_CACHE: 不使用缓存,只从网络获取数据.

LOAD_CACHE_ELSE_NETWORK,只要本地有,无论是否过期,或者no-cache,都使用缓存中的数据。

如:www.taobao.com的cache-control为no-cache,在模式LOAD_DEFAULT下,无论如何都会从网络上取数据,如果没有网络,就会出现错误页面;在LOAD_CACHE_ELSE_NETWORK模式下,无论是否有网络,只要本地有缓存,都使用缓存。本地没有缓存时才从网络上获取。

www.360.com.cn的cache-control为max-age=60,在两种模式下都使用本地缓存数据。

根据以上两种模式,建议缓存策略为,判断是否有网络,有的话,使用LOAD_DEFAULT,无网络时,使用LOAD_CACHE_ELSE_NETWORK。

41、setMixedContentMode(int mode)

设置当一个安全站点企图加载来自一个不安全站点资源时WebView的行为,android.os.Build.VERSION_CODES.KITKAT默认为MIXED_CONTENT_ALWAYS_ALLOW,android.os.Build.VERSION_CODES#LOLLIPOP默认为MIXED_CONTENT_NEVER_ALLOW,取值其中之一:MIXED_CONTENT_NEVER_ALLOW、MIXED_CONTENT_ALWAYS_ALLOW、MIXED_CONTENT_COMPATIBILITY_MODE.

getSettings.setMixedContentMode(WebSettings.MIXED_CONTENT_COMPATIBILITY_MODE);

下面贴上我自己的配置代码:

WebSettings settings = webview.getSettings();

settings.setJavaScriptEnabled(true);//启用js

settings.setJavaScriptCanOpenWindowsAutomatically(true);//js和android交互

String cacheDirPath = PathCommonDefines.WEBVIEW_CACHE;

settings.setAppCachePath(cacheDirPath); //设置缓存的指定路径

settings.setAllowFileAccess(true); // 允许访问文件

settings.setAppCacheEnabled(true); //设置H5的缓存打开,默认关闭

settings.setUseWideViewPort(true);//设置webview自适应屏幕大小

settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NARROW_COLUMNS);//设置,可能的话使所有列的宽度不超过屏幕宽度

settings.setLoadWithOverviewMode(true);//设置webview自适应屏幕大小

settings.setDomStorageEnabled(true);//设置可以使用localStorage

settings.setSupportZoom(false);//关闭zoom按钮

settings.setBuiltInZoomControls(false);//关闭zoom

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {

webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null);

}

webview.setWebViewClient(new WebViewClient() {

@Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return false; }

@Override public void onLoadResource(WebView view, String url) { }

@Override public void onPageFinished(WebView view, String url) { } });

*10:html5跳原生界面*

**

**网页跳原生界面的方法有很多种,比如js调java方法,或者是通过uri scheme啦,也可以通过自己解析url来做。

在这儿,考虑到兼容性,拦截的是url,并且在清单文件中自定义了scheme~

webview.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { parserURL(url); //解析url,如果存在有跳转原生界面的url规则,则跳转原生。 return super.shouldOverri deUrlLoading(view, url); } @Override public void onPageFinished(WebView view, String url) { super.onPageFinished (view, url); } @Override public void onLoadResource(WebView view, String url) { super.onLoadResource(view, url); } });

清单文件中,声明一下 就可以在自带浏览器通过uri scheme跳到本app页面了,这个activity作为各个页面的分发页面,通过 这个界面解析数据决定接下来要跳转哪个页面:

<data

android:host=“xxxx.com”

android:scheme=“kingp2p” />

Android中处理网页时我们必然用到WebView,这里我们有这样一个需求,我们想让WebView在处理网络请求的时候将某些请 求拦截替换成某些特殊的资源。具体一点儿说,在WebView加载 http://m.sogou.com 时,会加载一个logo图片,我们的需 求就是将这个logo图片换成另一张图片。

shouldOverrideUrlLoading(拦截url加载,除资源请求的url) shouldInterceptRequest(拦截所有url请求)

shouldInterceptRequest:在每一次请求资源时,都会通过这个函数来回调,比如超链接、JS文件、CSS文件、图片等,

也就是说浏览器中每一次请求资源时,都会回调回来,无论任何资源!

但是必须注意的是shouldInterceptRequest函数是在非UI线程中执行的,在其中不能直接做UI操作,如果需要做UI操作,则需要利用Handler来实现

好在Android中的WebView比较强大,从API 11(Android 3.0)开始, shouldInterceptRequest被引入就是为了解决这一类的问题。

shouldInterceptRequest这个回调可以通知主程序WebView处理的资源(css,js,image等)请求,并允许主程序进行处理后返回数据。如果主程序返回的数据为null,WebView会自行请求网络加载资源,否则使用主程序提供的数据。注意这个回调发生在非UI线程中,所以进行UI系统相关的操作是不可以的。

shouldInterceptRequest有两种重载。

public WebResourceResponse shouldInterceptRequest (WebView view, String url) 从API 11开始引入,API 21弃用

public WebResourceResponse shouldInterceptRequest (WebView view, WebResourceRequest request) 从API 21开始引入

本次例子暂时使用第一种,即shouldInterceptRequest (WebView view, String url)。

示例代码

WebView webView = new WebView(this);

webView.setWebViewClient(new WebViewClient() {

@Override

public WebResourceResponse shouldInterceptRequest(WebView view, String url) {

Log.i(LOGTAG, “shouldInterceptRequest url=” + url + “;threadInfo” + Thread.currentThread());

WebResourceResponse response = null;

if (url.contains(“logo”)) {

try {

InputStream localCopy = getAssets().open(“droidyue.png”);

response = new WebResourceResponse(“image/png”, “UTF-8”, localCopy);}

catch (IOException e) {

e.printStackTrace();}}return response;}});

}

setContentView(webView);

webView.loadUrl(“http://m.sogou.com”);

}

其中WebResourceResponse需要设定三个属性,MIME类型,数据编码,数据(InputStream流形式)。

shouldOverrideUrlLoading(拦截url加载,除资源请求的url) shouldInterceptRequest(拦截所有url请求)

shouldOverrideUrlLoading:

这个函数会在加载超链接时回调过来

对网页中超链接按钮的响应。当按下某个连接时WebViewClient会调用这个方法,并传递参数:按下的url。

通过重写shouldOverrideUrlLoading,可以实现对网页中超链接的拦截;

webView.setWebViewClient(new WebViewClient(){

@Override

public boolean shouldOverrideUrlLoading(WebView view, String url) {

view.loadUrl(url); //在当前的webview中跳转到新的url

return true;

} });

shouldoverrideurlloading返回true表明点击网页里面的链接还是在当前的webview里跳转,不跳到浏览器那边。

这个方法在手动调用WebView.loadUrl(url);时是不会被调用的,再进一步点击才会走这个方法。

返回值是boolean类型,表示是否屏蔽WebView继续加载URL的默认行为,因为这个函数是WebView加载URL前回调的,所以如果我们return true,则WebView接下来就不会再加载这个URL了,所有处理都需要在WebView中操作,包含加载。如果我们return false,则系统就认为上层没有做处理,接下来还是会继续加载这个URL的。在利用shouldOverrideUrlLoading来拦截URL时,如果return true,则会屏蔽系统默认的显示URL结果的行为,不需要处理的URL也需要调用loadUrl()来加载进WebVIew,不然就会出现白屏;如果return false,则系统默认的加载URL行为是不会被屏蔽的,所以一般建议大家return false,我们只关心我们关心的拦截内容,对于不拦截的内容,让系统自己来处理即可。

WebChromeClient与WebViewClient的区别

WebView的内部实现并不是完全使用Chrome的内核,而是部分使用Chome内核,其它都是与Chrome不相同的;

WebViewClient:在影响View的事件到来时,会通过WebViewClient中的方法回调通知用户

WebChromeClient:当影响浏览器的事件到来时,就会通过WebChromeClient中的方法回调通知用法。

通过上面的对比,我们发现WebViewClient和WebChromeClient都是针对不同事件的回调,而google将这些回调进行分类集合,就产生了WebViewClient、WebChromeClient这两个大类,其中管理着针对不同类型的回调而已。

在程序中,我们只需要加上mWebView.setWebChromeClient(new WebChromeClient());就可以实现confrim()、alert()、prompt()的弹出效果了

如:mWebView.setWebViewClient(new WebViewClient()); mWebView.setWebChromeClient(new WebChromeClient());

如果需要使网页中的confrim()、alert()、prompt()函数生效,需要设置WebChromeClient!

除了alert,prompt,confirm以外,其它时候都不需要强制设置WebChromeClient

在使用onJsAlert来拦截alert对话框时,如果不需要再弹出alert对话框,一定要return true;在return false以后,会依然调用系统的默认处理来弹出对话框的

*11:LoadData()与loadDataWithBaseURL()*

**

js基础

1)对js的理解?
2)请说出以下代码输出的值?
3)把以下代码,改写成依次输出0-9
4)如何区分数组对象,普通对象,函数对象
5)面向对象、面向过程
6)面向对象的三大基本特性
7)XML和JSON的区别?
8)Web Worker 和webSocket?
9)Javascript垃圾回收方法?
10)new操作符具体干了什么呢?
11)js延迟加载的方式有哪些?
12)WEB应用从服务器主动推送Data到客户端有那些方式?

js基础.PNG

前16.PNG

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

meClient(new WebChromeClient());就可以实现confrim()、alert()、prompt()的弹出效果了

如:mWebView.setWebViewClient(new WebViewClient()); mWebView.setWebChromeClient(new WebChromeClient());

如果需要使网页中的confrim()、alert()、prompt()函数生效,需要设置WebChromeClient!

除了alert,prompt,confirm以外,其它时候都不需要强制设置WebChromeClient

在使用onJsAlert来拦截alert对话框时,如果不需要再弹出alert对话框,一定要return true;在return false以后,会依然调用系统的默认处理来弹出对话框的

*11:LoadData()与loadDataWithBaseURL()*

**

js基础

1)对js的理解?
2)请说出以下代码输出的值?
3)把以下代码,改写成依次输出0-9
4)如何区分数组对象,普通对象,函数对象
5)面向对象、面向过程
6)面向对象的三大基本特性
7)XML和JSON的区别?
8)Web Worker 和webSocket?
9)Javascript垃圾回收方法?
10)new操作符具体干了什么呢?
11)js延迟加载的方式有哪些?
12)WEB应用从服务器主动推送Data到客户端有那些方式?

[外链图片转存中…(img-6l8nrbgI-1714921976268)]

[外链图片转存中…(img-AS9fUKsf-1714921976269)]

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

  • 26
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值