Electron鸿蒙化的又一个坑

鸿蒙申请权限踩的坑

大家好，我是程序员Aaron。近期在忙音频项目鸿蒙化的过程中，遇到了一个比较怪异的问题：使用Electron鸿蒙化模板编译出来的产物，在index.js中配置了app.whenReady().then(requestPermissions)。首次启动时会正常弹出用户协议弹窗，但申请录音权限的弹窗却不会主动弹出，需要先结束进程重新进入才能触发。初次排查时，怀疑是因为用户协议弹窗覆盖导致录音权限弹窗被遮挡，但进一步排查未果。

问题复现及沟通情况

与开发者联盟的交流: 这个问题跨越了近两周，期间进行了多次讨论，但最终因为开发者联盟测试环境未出现隐私协议弹窗从而无法完美复现问题，故暂时搁置。
解决方案试探: 暂时休息了一部分时间，考虑到在录音开始前而不是启动时请求权限可能会解决问题，并尝试通过Vue的预加载脚本进行交互。

当前的实现方案

为了确保录音权限申请逻辑在录音开始时生效，而不是启动时，我们采用了以下方案：

Vue层: 在用户点击录音按钮时检查录音权限，并通过预加载脚本向Electron层发送请求。
IPC通信:
- index.js: 使用ipcMain监听录音开始事件，并通过requestPermissions请求权限，然后通过事件回应对Vue层返回结果。
csharp 复制代码
```
ipcMain.on('record-started', async (event) => {
    await requestPermissions().then(result => event.reply('permission-granted', result))
})
```

preload.js: 用于Electron和Vue层之间的通信。

javascript 复制代码

export function recordStarted() {
    ipcRenderer.send('record-started')
}

export function permissionGranted(callback) {
    ipcRenderer.on('permission-granted', callback)
}

AudioEase.js: 负责录音相关操作的Vue脚本。

ini 复制代码

try {
    let permission = false;
    window.electronAPI.recordStarted();
    window.electronAPI.permissionGranted(async (event, result) => {
        if (result) await startWavesurferRecording();
    });

    if (!permission) {
        setShowMessage(`录音失败`, 'error');
        isRecording.value = false;
        recordingStatus.value = '录音失败';
    }
  
} catch (error) {
    console.error('录音失败:', error);
    setShowMessage(`录音失败: ${error.message}`, 'error');
    isRecording.value = false;
    recordingStatus.value = '录音失败';
}

总结

这个方案是为了确保在用户实际录音开始时申请录音权限，而非在应用启动时。希望这段代码能帮到一些正在进行或计划进行Electron鸿蒙化的小白们。感谢大家的关注和支持，希望下次相见！