HarmonyOS web组件加载url 显示为电脑网页 手机不适配-鸿蒙开发者社区-51CTO.COM

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

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


HarmonyOS
2024-09-04 12:09:08
浏览
收藏 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%') 
  } 
}
分享
微博
QQ
微信
回复
2024-09-04 18:18:50
相关问题
使用Web组件加载网页显示空白。
375浏览 • 1回复 待解决
HarmonyOS web组件加载url失败
352浏览 • 1回复 待解决
HarmonyOS Web 加载URL异常
226浏览 • 1回复 待解决
HarmonyOS Web加载网页白屏
421浏览 • 1回复 待解决
Web加载网页后获取当前页面和url
1081浏览 • 1回复 待解决
HarmonyOS Web组件加载片段时候不显示
143浏览 • 1回复 待解决
web组件加载url内容来
338浏览 • 1回复 待解决
HarmonyOS web加载页面图片不显示
356浏览 • 1回复 待解决
HarmonyOS web组件内容适配折叠屏
187浏览 • 1回复 待解决
HarmonyOS web组件加载pdf问题
497浏览 • 1回复 待解决