developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
yuzhilin
3f207053 1 parent 779ad522

h5专题跳转 H5详情

Inline Side-by-side
Showing 6 changed files with 70 additions and 103 deletions
1 import { Action } from './Action'; 1 import { Action } from './Action';
2 interface dataObject { 2 interface dataObject {
3 webViewHeight?: string 3 webViewHeight?: string
  4 + dataJson?: string
4 } 5 }
5 /** 6 /**
6 * 消息Message 7 * 消息Message
@@ -8,6 +8,8 @@ export class H5CallNativeType { @@ -8,6 +8,8 @@ export class H5CallNativeType {
8 static jsCall_getAppPublicInfo = 'jsCall_getAppPublicInfo' 8 static jsCall_getAppPublicInfo = 'jsCall_getAppPublicInfo'
9 static jsCall_getArticleDetailBussinessData = 'jsCall_getArticleDetailBussinessData' 9 static jsCall_getArticleDetailBussinessData = 'jsCall_getArticleDetailBussinessData'
10 static jsCall_callAppService = 'jsCall_callAppService' 10 static jsCall_callAppService = 'jsCall_callAppService'
  11 + static jsCall_appInnerLinkMethod = 'jsCall_appInnerLinkMethod'
  12 + static jsCall_receiveH5Data = 'jsCall_receiveH5Data'
11 // TODO 业务自行新增类型、自行在JsBridgeBiz#performJSCallNative里添加接收分支处理。 13 // TODO 业务自行新增类型、自行在JsBridgeBiz#performJSCallNative里添加接收分支处理。
12 14
13 static { 15 static {
@@ -15,6 +17,8 @@ export class H5CallNativeType { @@ -15,6 +17,8 @@ export class H5CallNativeType {
15 H5CallNativeType.JsCallTypeList.push(H5CallNativeType.jsCall_getAppPublicInfo) 17 H5CallNativeType.JsCallTypeList.push(H5CallNativeType.jsCall_getAppPublicInfo)
16 H5CallNativeType.JsCallTypeList.push(H5CallNativeType.jsCall_getArticleDetailBussinessData) 18 H5CallNativeType.JsCallTypeList.push(H5CallNativeType.jsCall_getArticleDetailBussinessData)
17 H5CallNativeType.JsCallTypeList.push(H5CallNativeType.jsCall_callAppService) 19 H5CallNativeType.JsCallTypeList.push(H5CallNativeType.jsCall_callAppService)
  20 + H5CallNativeType.JsCallTypeList.push(H5CallNativeType.jsCall_appInnerLinkMethod)
  21 + H5CallNativeType.JsCallTypeList.push(H5CallNativeType.jsCall_receiveH5Data)
18 } 22 }
19 } 23 }
20 24
@@ -2,6 +2,9 @@ import { Callback, BridgeWebViewControl } from 'wdJsBridge'; @@ -2,6 +2,9 @@ import { Callback, BridgeWebViewControl } from 'wdJsBridge';
2 import { Message } from 'wdJsBridge/src/main/ets/bean/Message'; 2 import { Message } from 'wdJsBridge/src/main/ets/bean/Message';
3 import { Logger, StringUtils, } from 'wdKit'; 3 import { Logger, StringUtils, } from 'wdKit';
4 import { H5CallNativeType } from './H5CallNativeType'; 4 import { H5CallNativeType } from './H5CallNativeType';
  5 +import { ContentDTO } from 'wdBean';
  6 +//TODO 这里引用了 features模块，是否考虑将跳转抽到公共模块
  7 +import { ProcessUtils } from '../../../../../../features/wdComponent/src/main/ets/utils/ProcessUtils';
5 8
6 const TAG = 'JsBridgeBiz' 9 const TAG = 'JsBridgeBiz'
7 10
@@ -11,7 +14,7 @@ const TAG = 'JsBridgeBiz' @@ -11,7 +14,7 @@ const TAG = 'JsBridgeBiz'
11 * @param call 14 * @param call
12 */ 15 */
13 export function performJSCallNative(data: Message, call: Callback) { 16 export function performJSCallNative(data: Message, call: Callback) {
14 - Logger.debug(TAG, 'performJSCallNative handlerName: ' + data.handlerName + ', data: ' + data.data) 17 + Logger.debug(TAG, 'performJSCallNative handlerName: ' + data.handlerName + ', data: ' + JSON.stringify(data.data))
15 switch (data.handlerName) { 18 switch (data.handlerName) {
16 case H5CallNativeType.jsCall_currentPageOperate: 19 case H5CallNativeType.jsCall_currentPageOperate:
17 break; 20 break;
@@ -23,6 +26,9 @@ export function performJSCallNative(data: Message, call: Callback) { @@ -23,6 +26,9 @@ export function performJSCallNative(data: Message, call: Callback) {
23 break; 26 break;
24 case H5CallNativeType.jsCall_callAppService: 27 case H5CallNativeType.jsCall_callAppService:
25 break; 28 break;
  29 + case H5CallNativeType.jsCall_receiveH5Data:
  30 + handleH5Data(JSON.parse(data?.data?.dataJson || '{}'))
  31 + break;
26 case 'changeNativeMessage': 32 case 'changeNativeMessage':
27 call("this is change Web Message") 33 call("this is change Web Message")
28 break; 34 break;
@@ -50,4 +56,7 @@ function getAppPublicInfo(): string { @@ -50,4 +56,7 @@ function getAppPublicInfo(): string {
50 return result; 56 return result;
51 } 57 }
52 58
  59 +function handleH5Data(content:ContentDTO) {
  60 + ProcessUtils.processPage(content)
  61 +}
53 62
1 import router from '@ohos.router'; 1 import router from '@ohos.router';
2 -import { Action } from 'wdBean';  
3 -import { ConfigConstants } from 'wdConstant';  
4 -import { Logger } from 'wdKit';  
5 -import { BridgeHandler, BridgeUtil, BridgeWebViewControl, Callback } from 'wdJsBridge'; 2 +import { BridgeUtil, BridgeWebViewControl, Callback } from 'wdJsBridge';
  3 +import { Logger } from 'wdKit/Index';
6 import { performJSCallNative } from './JsBridgeBiz'; 4 import { performJSCallNative } from './JsBridgeBiz';
7 -import { setDefaultNativeWebSettings } from './WebComponentUtil';  
8 -import { Message } from 'wdJsBridge/src/main/ets/bean/Message';  
9 import { H5CallNativeType } from './H5CallNativeType'; 5 import { H5CallNativeType } from './H5CallNativeType';
  6 +import { Message } from 'wdJsBridge/src/main/ets/bean/Message';
10 7
11 -const TAG = 'WdWebComponent'; 8 +const TAG = 'WdWebLocalComponent';
12 9
13 @Component 10 @Component
14 export struct WdWebComponent { 11 export struct WdWebComponent {
15 - private webviewControl: BridgeWebViewControl = new BridgeWebViewControl()  
16 - //TODO 默认网页  
17 - webUrl: string | Resource = ConfigConstants.DETAIL_URL  
18 - /**  
19 - * 对外暴露webview的回调，能力  
20 - */  
21 - onPageBegin: (url?: string) => void = () => {  
22 - }  
23 - onPageEnd: (url?: string) => void = () => {  
24 - }  
25 - onLoadIntercept: (url?: string) => boolean = () => {  
26 - return false  
27 - }  
28 - onHttpErrorReceive: (url?: string) => boolean = () => {  
29 - return false  
30 - } 12 + webviewControl: BridgeWebViewControl = new BridgeWebViewControl()
  13 + @Prop backVisibility: boolean = false
  14 + @Prop webUrl: string = ''
31 @Prop @Watch('onReloadStateChanged') reload: number = 0 15 @Prop @Watch('onReloadStateChanged') reload: number = 0
32 - /**  
33 - * 默认【CallNative】逻辑处理  
34 - */  
35 - private defaultPerformJSCallNative: (data: Message, f: Callback) => void = (data: Message, f: Callback) => {  
36 - performJSCallNative(data, f)  
37 - }  
38 - /**  
39 - * jsBridge的处理  
40 - */  
41 - handleInfo: [string, BridgeHandler][] = []  
42 - backVisibility: boolean = false  
43 -  
44 - defaultRegisterHandler(): void {  
45 - this.webviewControl.registerHandler("CallNative", {  
46 - handle: (data: Message, f: Callback) => {  
47 - this.defaultPerformJSCallNative(data, f)  
48 - }  
49 - });  
50 -  
51 - }  
52 16
53 build() { 17 build() {
54 Column() { 18 Column() {
@@ -72,21 +36,13 @@ export struct WdWebComponent { @@ -72,21 +36,13 @@ export struct WdWebComponent {
72 .zoomAccess(false) 36 .zoomAccess(false)
73 .horizontalScrollBarAccess(false) 37 .horizontalScrollBarAccess(false)
74 .verticalScrollBarAccess(false) 38 .verticalScrollBarAccess(false)
75 - .onHttpErrorReceive((event) => {  
76 - //TODO 页面加载不成功的时候处理  
77 - Logger.info(TAG, 'onHttpErrorReceive event.request.getRequestUrl:' + event?.request.getRequestUrl());  
78 - Logger.info(TAG, 'onHttpErrorReceive event.response.getResponseCode:' + event?.response.getResponseCode()); 39 + .onPageBegin((event) => {
  40 + console.log(this.webUrl,"yzl")
  41 + this.onPageBegin(event?.url);
79 }) 42 })
80 .onPageEnd((event) => { 43 .onPageEnd((event) => {
81 this.onPageEnd(event?.url) 44 this.onPageEnd(event?.url)
82 }) 45 })
83 - .onPageBegin((event) => {  
84 - this.onPageBegin(event?.url);  
85 - this.registerHandlers();  
86 - setTimeout(() => {  
87 - BridgeUtil.webViewLoadLocalJs(getContext(this), this.webviewControl)  
88 - }, 200)  
89 - })  
90 .onLoadIntercept((event) => { 46 .onLoadIntercept((event) => {
91 let url: string = event.data.getRequestUrl().toString() 47 let url: string = event.data.getRequestUrl().toString()
92 url = url.replace("%(?![0-9a-fA-F]{2})", "%25") 48 url = url.replace("%(?![0-9a-fA-F]{2})", "%25")
@@ -97,30 +53,51 @@ export struct WdWebComponent { @@ -97,30 +53,51 @@ export struct WdWebComponent {
97 return true 53 return true
98 } 54 }
99 if (url.startsWith(BridgeUtil.YY_OVERRIDE_SCHEMA)) { 55 if (url.startsWith(BridgeUtil.YY_OVERRIDE_SCHEMA)) {
  56 + Logger.debug(TAG, 'flushMessageQueue');
100 this.webviewControl.flushMessageQueue() 57 this.webviewControl.flushMessageQueue()
101 return true 58 return true
102 } 59 }
103 - return this.onLoadIntercept(event.data.getRequestUrl().toString()) 60 + return this.onLoadIntercept(event.data.getRequestUrl().toString());
104 }) 61 })
105 } 62 }
106 } 63 }
107 64
108 - onReloadStateChanged() {  
109 - Logger.info(TAG, `onReloadStateChanged:::refresh, this.reload: ${this.reload}`);  
110 - if (this.reload > 0) {  
111 - this.webviewControl.refresh()  
112 - }  
113 - }  
114 -  
115 private registerHandlers(): void { 65 private registerHandlers(): void {
116 // 注册h5调用js相关 66 // 注册h5调用js相关
117 for (let i = 0; i < H5CallNativeType.JsCallTypeList.length; i++) { 67 for (let i = 0; i < H5CallNativeType.JsCallTypeList.length; i++) {
118 let handleName = H5CallNativeType.JsCallTypeList[i]; 68 let handleName = H5CallNativeType.JsCallTypeList[i];
  69 + console.log('handleName:', handleName)
119 let handle = (data: Message, f: Callback) => { 70 let handle = (data: Message, f: Callback) => {
120 this.defaultPerformJSCallNative(data, f) 71 this.defaultPerformJSCallNative(data, f)
121 - } ; 72 + };
122 this.webviewControl.registerHandler(handleName, { handle: handle }); 73 this.webviewControl.registerHandler(handleName, { handle: handle });
123 } 74 }
124 } 75 }
  76 +
  77 + /**
  78 + * 默认【CallNative】逻辑处理
  79 + */
  80 + private defaultPerformJSCallNative: (data: Message, f: Callback) => void = (data: Message, f: Callback) => {
  81 + performJSCallNative(data, f)
  82 + }
  83 + onPageBegin: (url?: string) => void = () => {
  84 + Logger.debug(TAG, 'onPageBegin');
  85 + this.registerHandlers();
  86 + BridgeUtil.webViewLoadLocalJs(getContext(this), this.webviewControl)
  87 + }
  88 + onPageEnd: (url?: string) => void = () => {
  89 + Logger.debug(TAG, 'onPageEnd');
  90 + }
  91 + onLoadIntercept: (url?: string) => boolean = () => {
  92 + Logger.debug(TAG, 'onLoadIntercept return false');
  93 + return false
  94 + }
  95 + onReloadStateChanged() {
  96 + Logger.info(TAG, `onReloadStateChanged:::refresh, this.reload: ${this.reload}`);
  97 + if (this.reload > 0) {
  98 + this.webviewControl.refresh()
  99 + }
  100 + }
  101 +
125 } 102 }
126 103
@@ -11,9 +11,9 @@ const TAG = 'WdWebLocalComponent'; @@ -11,9 +11,9 @@ const TAG = 'WdWebLocalComponent';
11 11
12 @Component 12 @Component
13 export struct WdWebLocalComponent { 13 export struct WdWebLocalComponent {
14 - private webviewControl: BridgeWebViewControl = new BridgeWebViewControl()  
15 - backVisibility: boolean = false  
16 - webResource: Resource = {} as Resource 14 + webviewControl: BridgeWebViewControl = new BridgeWebViewControl()
  15 + @Prop backVisibility: boolean = false
  16 + @Prop webResource: Resource = {} as Resource
17 @State webHeight : string = '100%' 17 @State webHeight : string = '100%'
18 18
19 build() { 19 build() {
@@ -35,6 +35,10 @@ export struct WdWebLocalComponent { @@ -35,6 +35,10 @@ export struct WdWebLocalComponent {
35 .domStorageAccess(true) 35 .domStorageAccess(true)
36 .databaseAccess(true) 36 .databaseAccess(true)
37 .javaScriptAccess(true) 37 .javaScriptAccess(true)
  38 + .imageAccess(true)
  39 + .mixedMode(MixedMode.All)
  40 + .onlineImageAccess(true)
  41 + .enableNativeEmbedMode(true)
38 .height(this.webHeight === '100%' ? '100%' : Number(this.webHeight)) 42 .height(this.webHeight === '100%' ? '100%' : Number(this.webHeight))
39 .onPageBegin((event) => { 43 .onPageBegin((event) => {
40 this.onPageBegin(event?.url); 44 this.onPageBegin(event?.url);
1 -import { Action, ContentDetailDTO, ContentDTO, batchLikeAndCollectResult, InteractDataDTO, } from 'wdBean'; 1 +import { Action, ContentDetailDTO, } from 'wdBean';
2 import DetailViewModel from '../viewmodel/DetailViewModel'; 2 import DetailViewModel from '../viewmodel/DetailViewModel';
3 -import { OperRowListView } from './view/OperRowListView';  
4 import { WdWebComponent } from 'wdWebComponent'; 3 import { WdWebComponent } from 'wdWebComponent';
5 import router from '@ohos.router'; 4 import router from '@ohos.router';
6 import { CommonConstants } from 'wdConstant' 5 import { CommonConstants } from 'wdConstant'
  6 +import { BridgeWebViewControl } from 'wdJsBridge/Index';
7 7
8 const TAG = 'SpacialTopicPageComponent' 8 const TAG = 'SpacialTopicPageComponent'
9 9
10 @Component 10 @Component
11 export struct SpacialTopicPageComponent { 11 export struct SpacialTopicPageComponent {
  12 + webviewControl: BridgeWebViewControl = new BridgeWebViewControl()
12 scroller: Scroller = new Scroller(); 13 scroller: Scroller = new Scroller();
13 action: Action = {} as Action 14 action: Action = {} as Action
14 - private webUrl?: string;  
15 - @State contentDetailData: ContentDetailDTO [] = [] as ContentDetailDTO []  
16 - @State recommendList: ContentDTO[] = []  
17 - @State newsStatusOfUser: batchLikeAndCollectResult | undefined = undefined // 点赞、收藏状态  
18 - @State interactData: InteractDataDTO = {} as InteractDataDTO  
19 - 15 + @State webUrl: string = '';
20 build() { 16 build() {
21 Column() { 17 Column() {
22 Stack({ alignContent: Alignment.Bottom }) { 18 Stack({ alignContent: Alignment.Bottom }) {
23 Column() { 19 Column() {
24 WdWebComponent({ 20 WdWebComponent({
  21 + webviewControl: this.webviewControl,
25 webUrl: this.webUrl, 22 webUrl: this.webUrl,
26 - backVisibility: false 23 + backVisibility: false,
27 }) 24 })
28 } 25 }
29 - .padding({bottom:56}) 26 + .padding({ bottom: 56 })
30 .width(CommonConstants.FULL_WIDTH) 27 .width(CommonConstants.FULL_WIDTH)
31 .height(CommonConstants.FULL_HEIGHT) 28 .height(CommonConstants.FULL_HEIGHT)
32 29
@@ -72,36 +69,11 @@ export struct SpacialTopicPageComponent { @@ -72,36 +69,11 @@ export struct SpacialTopicPageComponent {
72 .backgroundColor(Color.White) 69 .backgroundColor(Color.White)
73 } 70 }
74 71
75 - // private async getDetail() {  
76 - // let contentId: string = ''  
77 - // let relId: string = ''  
78 - // let relType: string = ''  
79 - // if (this.action && this.action.params) {  
80 - // if (this.action.params.contentID) {  
81 - // contentId = this.action.params.contentID;  
82 - // }  
83 - // if (this.action && this.action.params && this.action.params.extra) {  
84 - // if (this.action.params.extra.relId) {  
85 - // relId = this.action.params.extra.relId;  
86 - // }  
87 - // if (this.action.params.extra.relType) {  
88 - // relType = this.action.params.extra.relType  
89 - // }  
90 - //  
91 - // }  
92 - // let detailBeans = await DetailViewModel.getDetailPageData(relId, contentId, relType)  
93 - // if (detailBeans && detailBeans.length > 0) {  
94 - // this.contentDetailData = detailBeans;  
95 - // }  
96 - // }  
97 - // }  
98 -  
99 aboutToAppear() { 72 aboutToAppear() {
100 let action: Action = router.getParams() as Action 73 let action: Action = router.getParams() as Action
101 if (action) { 74 if (action) {
102 - this.webUrl = action.params?.url 75 + this.webUrl = action.params?.url || ''
103 } 76 }
104 - // this.getDetail()  
105 } 77 }
106 78
107 aboutToDisappear() { 79 aboutToDisappear() {