1、H5页面如何与ArkTS交互
A:通过对javaScriptProxy和runJavaScript封装,实现JSBridge通信方案。使用Web组件javaScriptProxy将原生侧接口注入到H5的window对象上,通过runJavaScript接口执行JS脚本到H5中,并在回调中获取脚本执行结果。具体调用流程如下图所示:
2、Web组件的onLoadIntercept返回结果是否影响onInterceptRequest
A:Web组件的onLoadIntercept的不同返回结果对应不同的操作:
-
onLoadIntercept返回true则直接拦截URL请求。
-
onLoadIntercept返回false走onInterceptRequest回调。
3、为什么Web组件的onKeyEvent键盘事件不生效
A:onKeyEvent为通用事件,当前Web组件不支持通用事件。Web组件监听键盘事件可以使用onInterceptKeyEvent回调函数。
4、onInterceptRequest拦截URL并自定义HTML文件,页面加载失败
A:设置拦截器时,如果只设置setResponseData,内核将无法识别到这是个HTML文件,需要同时设置setResponseEncoding、setResponseMimeType、setResponseHeader等参数。
5、如何在ArkTS代码中执行HTML内的JS函数
A:通过WebviewController中runJavaScript方法异步执行JavaScript脚本,并通过回调方式获取执行结果。
runJavaScript需要在loadUrl完成后,比如onPageEnd中调用。
6、Web组件domStorageAccess属性设置
A:设置是否开启文档对象模型存储接口(DOM Storage API)权限,默认未开启,控制web网页中localStorage的使用,对sessionStorage未做控制。
7、如何解决Web组件加载的HTML页面内检测网络状态失败
A:配置应用获取网络信息权限: ohos.permission.GET_NETWORK_INFO
8、如何自定义拼接设置UserAgent参数
A:默认UserAgent需要通过WebviewController获取。WebviewController对象必须在Web组件绑定后,才能调用WebviewController上的方法getUserAgent获取默认UserAgent。因此在页面加载前通过自定义字符串拼接修改UserAgent,可采用此方式:
-
使用@State定义初始UserAgent,绑定到Web组件;
-
在Web组件的onLoadIntercept回调中,通过WebviewController.getUserAgent()获取默认UserAgent,并修改Web组件绑定的UserAgent。
9、Web组件中如何通过手势滑动返回上一个Web页面
A:JSBridge是一种JavaScript与Web客户端之间的通信机制。通过JSBridge,可以在WebView中通过JavaScript代码调用客户端提供的功能,也可以从客户端中调用JavaScript函数。JSBridge可能无法满足复杂的通信需求,这时可以使用端口通信技术来实现更灵活的跨平台通信。
-
使用runJavaScript与registerJavaScriptProxy的JSBridge技术:
-
特点:调用函数,不需要一直保持通道。
-
使用场景:对于函数调用的场景,可以选择runJavaScript或者registerJavaScriptProxy实现。
-
-
使用WebMessagePort建立端口通信:
-
特点:建立通道,实时监听,持续消耗资源。
-
使用场景:对于有双向通信需求的场景,对于数据实时更新,聊天应用,大文件如图片等场景建议选择端口通信技术,更加稳定。
-
10、WebView的同层渲染概念是什么?解决了什么问题?如何使用
A:1、webview同层渲染实现功能:将系统原生组件直接渲染到前端H5页面上。
2、webview同层渲染demo参考:同层渲染绘制XComponent+AVPlayer和Button组件
11、webview有哪些调试工具?调试工具的用法是什么
A:setWebDebuggingAccess()接口开启Web组件前端页面调试能力,利用DevTools工具可以在电脑上调试移动设备上的前端网页,设备需为4.1.0及以上版本。
12、webview如何实现网络请求拦截功能
A:可以通过onInterceptRequest()接口实现自定义资源请求响应,该能力可用于自定义Web页面响应、自定义文件资源响应等场景。当Web网页发起资源加载请求时,应用层会收到该请求消息并构造本地资源响应消息发送给Web内核,Web内核根据应用层响应信息进行页面资源加载。
13、webview和原生进行通信的方式有哪些?怎么实现
A:如下
1.Native->H5使用runJavaScript接口注入JS进行通信,H5->Native使用registerJavaScriptProxy接口,事先将Native方法注册至H5侧,H5通过调用前端方法实现与Native侧的通信。
2.使用onInterceptrequest接口拦截H5侧请求,同时将Native侧数据作为Response返回至H5,实现Native与H5的通信。
更多详情查看:文档中心