使用
使用还是比较简单的,直接贴代码了
别忘了配置网络权限
@Entry
@Component
struct WebPage {@State isAttachController: boolean = false@State url: string = ''@State title: string = ''@Prop controller: web_webview.WebviewController = new web_webview.WebviewController()// 与前端交互 对象jsObj = new JsObj({setHeaderContentCallback: (str: string) => {this.title = str}});// js 调用App方法: 需要在数组中声明,设置给 methodList:jsArray: string[] = ["setHeaderContent", "toLogin", "jumpToBossDetailNew", "jumpToBossDetail", "jumpToCompanyDetail", "openRenewDefaultNavPageLoad", "openRenewPageLoad", "openNewPageLoad", "openBrowser"];aboutToAppear(): void {this.url = (router.getParams() as RouterParams).urlif (this.url.indexOf('?') > 0) {this.url = this.url + BranchUtils.appendBranchParams()} else {this.url = this.url + `?${BranchUtils.appendBranchParams()}`}web_webview.WebviewController.setWebDebuggingAccess(true);PreferencesUtil.getString("urlCookie").then((value) => {// 如果连接本地调试 一定要写完整的域名 带上http//web_webview.WebCookieManager.configCookieSync('http://10.1.65.120:5173/', value)// 设置cookieweb_webview.WebCookieManager.configCookieSync('.sscha.com', value)})web_webview.once("webInited", () => {})eventBus.on(EventBusId.ID_LOGIN, () => {// todo})}build() {Column() {PubTitle({ title: this.title, isShowRightBtn: false })Web({ src: this.url, controller: this.controller }).width('100%').height('100%').mixedMode(MixedMode.All).javaScriptAccess(true).javaScriptProxy({object: this.jsObj,name: "android",methodList: this.jsArray,controller: this.controller,}).onControllerAttached(() => {// 官方建议是在这里设置 serAgentthis.controller.setCustomUserAgent(this.controller.getUserAgent() + BranchUtils.appendBranch())}).onPageEnd((urlEnd) => {console.log("onPageEnd= " + JSON.stringify(urlEnd))})}.width('100%')}
}
export interface JSCallback {reqResult?: (code: string) => void;setHeaderContentCallback?: (msg: string) => void;
}export class JsObj {callback?: JSCallbackregistCallBack(callback: JSCallback) {this.callback = callback}constructor(callback?: JSCallback) {this.callback = callback}// ...省略代码
}
加载网页(这个问题不难但是血坑,搞了好久才定位到问题)
-
现象:
Android 、Ios 都有线上App 网页都是调试好的
鸿蒙加载有些网页加载不出来(绝大多数都加载不出来),有些能加载出来 。个人认为肯定不是ArkWeb的问题,这一块就需要跟前端调试,最后排查出的问题还真是前端的问题 -
排查结果
前端使用:localStorage,调用时localStorage为null,导致整个界面都加载不出来
经过前端修改,对localStorage是否为null进行判断,网页都可以正常加载出来了
官网文档
官网上有一个写法,不过没验证