Web组件如何判断网址是否加载成功

Web组件如何判断网址是否加载成功

HarmonyOS
2024-03-17 17:33:32
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
失望的满天星
  • 方案一:在设备无网络时,网页加载会发生错误,可以触发Web组件的onErrorReceive回调函数。
  • 方案二:在网页加载资源遇到HTTP错误(响应码>=400)时,可以触发Web组件的onHttpErrorReceive回调函数。

开发者可以根据不同的场景在对应的回调函数中进行相应的处理。

onErrorReceive:

// xxx.ets 
import { webview } from '@kit.ArkWeb'; 
 
@Entry 
@Component 
struct WebComponent { 
  controller: webview.WebviewController = new webview.WebviewController(); 
 
  build() { 
    Column() { 
      Web({ src: 'www.baidu.com', controller: this.controller }) 
        .onErrorReceive((event) => { 
          if (event) { 
            console.log('getErrorInfo:' + event.error.getErrorInfo()); 
            console.log('getErrorCode:' + event.error.getErrorCode()); 
            console.log('url:' + event.request.getRequestUrl()); 
            console.log('isMainFrame:' + event.request.isMainFrame()); 
            console.log('isRedirect:' + event.request.isRedirect()); 
            console.log('isRequestGesture:' + event.request.isRequestGesture()); 
            console.log('getRequestHeader_headerKey:' + event.request.getRequestHeader().toString()); 
            let result = event.request.getRequestHeader(); 
            console.log('The request header result size is ' + result.length); 
            for (let i of result) { 
              console.log('The request header key is : ' + i.headerKey + ', value is : ' + i.headerValue); 
            } 
          } 
        }) 
    } 
  } 
}

onHttpErrorReceive:

// xxx.ets 
import { webview } from '@kit.ArkWeb'; 
 
@Entry 
@Component 
struct WebComponent { 
  controller: webview.WebviewController = new webview.WebviewController(); 
 
  build() { 
    Column() { 
      Web({ src: 'www.example.com', controller: this.controller }) 
        .onHttpErrorReceive((event) => { 
          if (event) { 
            console.log('url:' + event.request.getRequestUrl()); 
            console.log('isMainFrame:' + event.request.isMainFrame()); 
            console.log('isRedirect:' + event.request.isRedirect()); 
            console.log('isRequestGesture:' + event.request.isRequestGesture()); 
            console.log('getResponseData:' + event.response.getResponseData()); 
            console.log('getResponseEncoding:' + event.response.getResponseEncoding()); 
            console.log('getResponseMimeType:' + event.response.getResponseMimeType()); 
            console.log('getResponseCode:' + event.response.getResponseCode()); 
            console.log('getReasonMessage:' + event.response.getReasonMessage()); 
            let result = event.request.getRequestHeader(); 
            console.log('The request header result size is ' + result.length); 
            for (let i of result) { 
              console.log('The request header key is : ' + i.headerKey + ' , value is : ' + i.headerValue); 
            } 
            let resph = event.response.getResponseHeader(); 
            console.log('The response header result size is ' + resph.length); 
            for (let i of resph) { 
              console.log('The response header key is : ' + i.headerKey + ' , value is : ' + i.headerValue); 
            } 
          } 
        }) 
    } 
  } 
}
分享
微博
QQ
微信
回复
2024-03-18 21:11:05
相关问题
如何判断Web组件是否全屏
254浏览 • 1回复 待解决
如何判断HAP是否安装
221浏览 • 1回复 待解决
Web如何使用loadData加载复杂Html字符串
301浏览 • 1回复 待解决
如何确认延迟任务是否申请成功
128浏览 • 1回复 待解决
如何判断软键盘是否弹出
254浏览 • 1回复 待解决
Image组件如何加载网络图片
168浏览 • 1回复 待解决
鸿蒙应用如何判断是否使用debug签名?
1410浏览 • 1回复 待解决
Text 组件如何加载Unicode字符
102浏览 • 1回复 待解决
Web组件如何获取和设置UserAgent
200浏览 • 1回复 待解决
如何判断某个应用是否为系统应用
259浏览 • 1回复 待解决
如何判断已安装应用是否可卸载
197浏览 • 1回复 待解决
是否支持模块的动态加载如何实现
166浏览 • 1回复 待解决
Iamge组件如何加载Graphic的资源图片?
5274浏览 • 1回复 待解决
Image组件如何加载沙盒内的图片
194浏览 • 1回复 待解决
如何判断JS对象中是否存在某个值
249浏览 • 1回复 待解决
如何判断当前线程是否是主线程
229浏览 • 1回复 待解决