HarmonyOS web组件加载url 显示为电脑网页 手机不适配

HarmonyOS  web组件加载url 显示为电脑网页 手机不适配。


HarmonyOS
2024-09-04 12:09:08
1772浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
Heiang

h5网站需要增加对HarmonyOS Web的UA适配,即在h5网站中通过ArkWeb关键字识别是否是OpenHarmony设备以及web内核是否为ArkWeb,进行移动端的屏幕和布局适配

获取自定义用户代理,getCustomUserAgent: https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-webview-V5#getcustomuseragent10

设置自定义用户代理,setCustomUserAgent: https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-webview-V5#setcustomuseragent10

代码示例如下:

import webview from '@ohos.web.webview'; 
@Entry 
@Component 
struct Index { 
  controller: WebviewController = new webview.WebviewController(); 
  @State userAgent: string = ''; 
 
  aboutToAppear() { 
    webview.WebviewController.setWebDebuggingAccess(true); 
  } 
 
  build() { 
    Row() { 
      Column() { 
        Web({ 
          src: 'https://index.html', 
          controller: this.controller 
        }) 
          .onControllerAttached(() => { 
            this.userAgent = this.controller.getCustomUserAgent() + ' ' + 'ArkWeb/4.1.6.1'; 
            this.controller.setCustomUserAgent(this.userAgent); 
            console.log('[LOG]this.userAgent', this.userAgent); 
          }) 
          .javaScriptAccess(true) 
          .domStorageAccess(true) 
      } 
      .width('100%') 
    } 
    .height('100%') 
  } 
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
分享
微博
QQ
微信
回复
2024-09-04 18:18:50


相关问题
HarmonyOS Web组件加载URL显示空白
808浏览 • 1回复 待解决
使用Web组件加载网页显示空白。
1439浏览 • 1回复 待解决
HarmonyOS Web加载Url,图片不能显示
1089浏览 • 1回复 待解决
HarmonyOS web组件加载url失败
1522浏览 • 1回复 待解决
Web加载网页后获取当前页面和url
2234浏览 • 1回复 待解决
HarmonyOS Web加载网页白屏
1403浏览 • 1回复 待解决
HarmonyOS Web 加载URL异常
1366浏览 • 1回复 待解决
web组件加载url内容来
1203浏览 • 1回复 待解决
HarmonyOS 如何拦截web加载url
766浏览 • 1回复 待解决