如何通过 JavaScriptProxy 代理机制在鸿蒙应用中实现 JS 调用 ArkUI 主进程的拨打电话功能?
尝试:
typescript
Copy
// ArkUI侧注册代理
webview.registerJavaScriptProxy({
callPhoneNumber: (number: string) => {
call.makeCall(number); // 调用系统电话接口
}
}, "JSBridge");
// JS侧调用
window.JSBridge.callPhoneNumber("123456");
期望结果:
验证 JS 调用后能否正确触发系统拨号界面,并统计接口调用耗时(目标 < 50ms)。
ets:
import { call } from '@kit.TelephonyKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { webview } from '@kit.ArkWeb';
class TestObj {
constructor() {
}
startCallDialog(phoneNumber: string): void {
let isSupport = call.hasVoiceCapability();
if (!isSupport) {
console.error('Not support voice capability.');
return;
}
call.makeCall(phoneNumber, (err: BusinessError) => {
if (err) {
console.error(
Failed to make call. Code is ${err.code}, Message is ${err.message}
);return;
}
console.info('Succeeded in making call.');
})
}
}
@Entry
@Component
struct StartCallDialogView {
@State message: string = '拉起拨号界面;
controller: webview.WebviewController = new webview.WebviewController()
testObj = new TestObj();
build() {
Row() {
Column() {
Web({ src: $rawfile('index.html'), controller: this.controller })
.javaScriptAccess(true)
.javaScriptProxy({
object: this.testObj,
name: "objName",
methodList: ["startCallDialog"],
controller: this.controller,
})
}
.width('100%')
}
.height('100%')
}
}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>Hello, ArkWeb</h1>
<div onclick="htmlTest()">拉起拨号界面</div>
<script type="text/javascript">
function htmlTest() {
str = objName.startCallDialog("15988888888")
console.log('objName.test result:'+ str)
}
</script>
</body>
</html>