feat(XWebview): 新增 JavaScript 代理功能
- 实现了在 XWebview 中使用 JavaScript代理的功能 - 添加了 JSSdkClsManager 类来处理 JS SDK 的调用 - 更新了 XWebHelper 和 XWebManager 以支持 JS 代理 - 新增了类型定义文件 types.ets来规范接口和数据结构
这个提交包含在:
父节点
858d57ae38
当前提交
6a95d3324b
@ -2,8 +2,8 @@
|
||||
* Use these variables when you tailor your ArkTS code. They must be of the const type.
|
||||
*/
|
||||
export const HAR_VERSION = '1.0.6';
|
||||
export const BUILD_MODE_NAME = 'release';
|
||||
export const DEBUG = false;
|
||||
export const BUILD_MODE_NAME = 'debug';
|
||||
export const DEBUG = true;
|
||||
export const TARGET_NAME = 'default';
|
||||
|
||||
/**
|
||||
|
||||
17
src/main/ets/pages/ClasTest.ets
普通文件
17
src/main/ets/pages/ClasTest.ets
普通文件
@ -0,0 +1,17 @@
|
||||
import { ToolsHelper } from "../utils/ToolsHelper";
|
||||
|
||||
export class ClasTest{
|
||||
constructor() {
|
||||
}
|
||||
|
||||
test(): string {
|
||||
return "ArkUI Web Component";
|
||||
}
|
||||
|
||||
toString(): void {
|
||||
console.log('Web Component toString');
|
||||
}
|
||||
postMsg(res: string): void {
|
||||
ToolsHelper.showMessage(res)
|
||||
}
|
||||
}
|
||||
@ -6,7 +6,7 @@ import { XDialogList } from '../dialog/XDialogList';
|
||||
import { picker } from '@kit.CoreFileKit';
|
||||
import { BusinessError } from '@kit.BasicServicesKit';
|
||||
import { ToolsHelper } from '../utils/ToolsHelper';
|
||||
import { XWebController, XWebParams } from '../utils/XWebHelper';
|
||||
import { JsParams, XWebController, XWebParams } from '../utils/XWebHelper';
|
||||
import { WindowHelper } from '../utils/WindowHelper';
|
||||
import { SZYXLocalStorageHelper } from '../utils/SZYXLocalStorageHelper';
|
||||
import { SZYXLocalStorageKeys } from '../utils/SZYXLocalStorageKeys';
|
||||
@ -18,10 +18,12 @@ export struct XWebview {
|
||||
// 手机号
|
||||
@State headers?: Array<WebHeader> = (router.getParams() as XWebParams).headers
|
||||
@State url?: string = (router.getParams() as XWebParams).url
|
||||
@State jsParams?: JsParams = (router.getParams() as XWebParams).jsParams
|
||||
@State zoomAccess?: boolean = (router.getParams() as XWebParams).zoomAccess
|
||||
@State content?: string = (router.getParams() as XWebParams).content
|
||||
@State title?: string = (router.getParams() as XWebParams).title
|
||||
@State xController?: XWebController = (router.getParams() as XWebParams).controller
|
||||
// @State xJsController?: XWebController = (router.getParams() as XWebParams).jsController
|
||||
@State closeTag?: string = (router.getParams() as XWebParams).closeTag
|
||||
@State showMenu: boolean = (router.getParams() as XWebParams).showMenu ?? false
|
||||
@State errorInfo: string | null = null
|
||||
@ -35,7 +37,6 @@ export struct XWebview {
|
||||
aboutToAppear(): void {
|
||||
SZYXLocalStorageHelper.storage.setOrCreate(SZYXLocalStorageKeys.XWebViewCLose, undefined)
|
||||
webview.WebviewController.setWebDebuggingAccess(true);
|
||||
|
||||
if (this._uuidToHtml) {
|
||||
XWebManager.addOnMessageToHtml(this._uuidToHtml, (msg) => {
|
||||
if (this.ports && this.ports[1]) {
|
||||
@ -43,6 +44,11 @@ export struct XWebview {
|
||||
}
|
||||
})
|
||||
}
|
||||
if (this.jsParams?.controller && this._uuidToHtml) {
|
||||
XWebManager.addOnMessageToWeb(this._uuidToHtml, (msg) => {
|
||||
this.controller.runJavaScript(msg)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
aboutToDisappear(): void {
|
||||
@ -51,6 +57,14 @@ export struct XWebview {
|
||||
}
|
||||
XWebManager.removeOnMessage(this._uuid)
|
||||
XWebManager.removeOnMessageToHtml(this._uuidToHtml)
|
||||
if (this._uuidToHtml) {
|
||||
XWebManager.objs.delete(this._uuidToHtml)
|
||||
}
|
||||
try {
|
||||
this.controller.deleteJavaScriptRegister(this.jsParams?.name);
|
||||
} catch (error) {
|
||||
console.error(`ErrorCode: ${(error as BusinessError).code}, Message: ${(error as BusinessError).message}`);
|
||||
}
|
||||
}
|
||||
|
||||
onBackPress(): boolean | void {
|
||||
@ -118,6 +132,12 @@ export struct XWebview {
|
||||
|
||||
Web({ src: this.url ?? 'www.example.com', controller: this.controller })
|
||||
.javaScriptAccess(true)
|
||||
.javaScriptProxy({
|
||||
object: XWebManager.objs.get(this._uuidToHtml),
|
||||
name: this.jsParams?.name,
|
||||
methodList: this.jsParams?.methodList,
|
||||
controller: this.controller
|
||||
})
|
||||
.domStorageAccess(true)
|
||||
.geolocationAccess(true)
|
||||
.width('100%')
|
||||
@ -312,7 +332,11 @@ export struct XWebview {
|
||||
values: ['刷新', '浏览器打开', '分享', '复制地址'],
|
||||
// 用户选择事件
|
||||
onSelected: (index: number, value: string) => {
|
||||
ToolsHelper.showMessage(`用户选择了第${index}个,内容为:${value}`)
|
||||
if (index === 0) {
|
||||
this.controller.refresh()
|
||||
} else {
|
||||
ToolsHelper.showMessage(`用户选择了第${index}个,内容为:${value}`)
|
||||
}
|
||||
},
|
||||
// 用户取消事件
|
||||
onCancel: () => {
|
||||
|
||||
@ -12,19 +12,31 @@ export interface XWebController {
|
||||
sendMessage: (message: string) => void
|
||||
}
|
||||
|
||||
export interface XWebJsController {
|
||||
sendMessage: (message: string) => void
|
||||
}
|
||||
|
||||
export interface JsParams {
|
||||
obj: object;
|
||||
name: string;
|
||||
methodList: Array<string>;
|
||||
controller?: XWebJsController
|
||||
}
|
||||
|
||||
export interface XWebParams {
|
||||
url?: string
|
||||
zoomAccess?: boolean
|
||||
content?: string
|
||||
title?: string
|
||||
showMenu?: boolean
|
||||
closeTag?: string
|
||||
watermarkTxt?: string
|
||||
_uuid?: string
|
||||
_uuidToHtml?: string
|
||||
showMenu?: boolean
|
||||
jsParams?: JsParams
|
||||
closeTag?: string
|
||||
headers?: Array<WebHeader>
|
||||
onMessage?: (message: string) => void
|
||||
controller?: XWebController
|
||||
headers?: Array<WebHeader>
|
||||
zoomAccess?: boolean
|
||||
_uuid?: string
|
||||
_uuidToHtml?: string
|
||||
}
|
||||
|
||||
export class XWebHelper {
|
||||
@ -46,6 +58,19 @@ export class XWebHelper {
|
||||
}
|
||||
}
|
||||
|
||||
if (params.jsParams && params.jsParams.obj) {
|
||||
if (!params._uuidToHtml) {
|
||||
params._uuidToHtml = ToolsHelper.getUuid()
|
||||
}
|
||||
XWebManager.objs.set(params._uuidToHtml, params.jsParams.obj)
|
||||
|
||||
if (params.jsParams?.controller) {
|
||||
params.jsParams.controller.sendMessage = (msg) => {
|
||||
XWebManager.sendMessageToWeb(msg)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return new Promise((resolve) => {
|
||||
router.pushNamedRoute({
|
||||
name: 'XWebview',
|
||||
|
||||
@ -2,6 +2,7 @@ import { ToolsHelper } from './ToolsHelper';
|
||||
|
||||
export class XWebManager {
|
||||
private static MapEventListener = new Map<string, (msg: string) => void>();
|
||||
static objs:Map<string,object> = new Map()
|
||||
|
||||
static addOnMessage(listener: (msg: string) => void): string {
|
||||
const id = ToolsHelper.getUuid()
|
||||
@ -38,4 +39,22 @@ export class XWebManager {
|
||||
item(message)
|
||||
}
|
||||
}
|
||||
|
||||
private static MapEventListenerToWeb = new Map<string, (msg: string) => void>();
|
||||
|
||||
static addOnMessageToWeb(id: string, listener: (msg: string) => void) {
|
||||
XWebManager.MapEventListenerToWeb.set(id, listener)
|
||||
}
|
||||
|
||||
static removeOnMessageToWeb(id?: string) {
|
||||
if (id) {
|
||||
XWebManager.MapEventListenerToWeb.delete(id)
|
||||
}
|
||||
}
|
||||
|
||||
static sendMessageToWeb(message: string) {
|
||||
for (let item of XWebManager.MapEventListenerToWeb.values()) {
|
||||
item(message)
|
||||
}
|
||||
}
|
||||
}
|
||||
正在加载...
在新工单中引用
屏蔽一个用户