FAQ

更新时间: 2024/03/15 17:25:05

使用 Electron 框架可以帮助您方便、快捷地开发跨平台的 RTC 桌面应用。由于配置开发环境的流程较为复杂,关于接入或使用 NERTC Electron SDK 的常见问题列举如下,您可以参考相关解答。

  • 接入相关

1. 运行项目,Electron 控制台提示 xxx is not defined

2. 使用 vue create 创建项目,运行 vscode 时提示 Module parse failed: Unexpected character '�' (1:2)

3. 在 Mac 设备上运行 Electron 应用,本地预览画面无法正常显示。

4. 在 Windows 设备上运行 Electron 应用,Electron 控制台提示 Error:The specified module coulde not found

5. 使用 electron-builder 打包应用,Electron 控制台提示 Uncaught Error: The specified module could not be found ...\nertc-electron-sdk.node

6. 如何使用 Mac M1 arm64 架构设备集成 NERTC Electron SDK。

7. 如何在系统为 Windows-64 bit 的设备上使用 32 位的 NERTC Electron SDK 开发 32 位的应用程序。

  • 功能相关

8. 调用 initialize 接口进行初始化时返回 30005 错误码。

9. 调用 startVideoPreview 开启视频画面预览时无画面。

10. 自 Electron 17.0.0 版本起使用 desktopCapturer 模块获取应用 id 只能在主进程进行,如何在渲染进程中获取应用 id。

接入相关

1. 运行项目,Electron 控制台提示 xxx is not defined

例如:

Uncaught ReferenceError: require is not defined

答:Electron 5.0 版本后,默认不支持 node 模块。您需要在 Electron 的 main.js 文件中添加 nodeIntegration:true

mainWindow = new BrowserWindow({
    height: 768,
    useContentSize: true,
    width: 1366,
    webPreferences: {
      nodeIntegration: true, //设置为true
    }
  })

2. 使用 vue create 创建项目,运行 vscode 时提示 Module parse failed: Unexpected character '�' (1:2)

答:Webpack 只能读取 JavaScript 和 JSON 文件,无法运行 NERTC的 .node 文件。loader 让 Webpack 能够处理其他类型的文件并将文件转换为有效模块,解决步骤如下。

1. 安装 native-ext-loader。
npm install native-ext-loader
2. 在您的项目中添加 Webpack 配置文件 `vue.config.js`。
const os = require('os')
module.exports = {
  lintOnSave: false,
  pluginOptions: {
    electronBuilder: {
        nodeIntegration: true
    }
  },
  configureWebpack:{
    externals: {
      "nertc-electron-sdk": "commonjs2 nertc-electron-sdk"
    },
    module: {
      rules: [
        {
          test: /\.node$/, //匹配.node文件配置对应loader
          loader: 'native-ext-loader',
          options: {
            emit: true,
            rewritePath: './node_modules/nertc-electron-sdk/build/Release'
          }
        }
      ],
    },
  }
}

3. 在 Mac 设备上运行 Electron 应用,本地预览画面无法正常显示。

答:Electron 应用默认无摄像头使用权限。您在 系统偏好设置 > 安全与隐私 中给应用开通相关权限即可。

4. 在 Windows 设备上运行 Electron 应用,Electron 控制台提示 Error:The specified module could not be found

例如:

Error: Cannot open node modules\nertc-electron-sdk\build\Release\nertc-electron-sdk.node: Error: The specified module could not be found.

答:由于 nertc-electron-sdk.node 使用 C++ 语言编写,集成了 NERTC Electron SDK 的应用需要有 C++ 运行时库才能正常运行,因此上述错误提示一般为系统缺少 C++ 运行时库 导致。您需要为系统安装 Visual Studio 2017 对应的运行时库。

5. 使用 electron-builder 打包应用,Electron 控制台提示 Uncaught Error: The specified module could not be found ...\nertc-electron-sdk.node

例如:

Uncaught Error:  The specified module could not be found modules\nertc-electron-sdk\build\Release\nertc-electron-sdk.node

答:Electron 应用未找到 nertc-electron-sdk.node 文件,您需要在项目的 package.json 文件中添加 electron-builder 配置。

 "build": {
   "productName": "xxx",
   "appId": "xxx",
   "asarUnpack": [
      "node_modules/nertc-electron-sdk/build/Release"
   ],
   "directories": {
     "output": "build"
   }
   "win": {
     "extraFiles": [
       {
         "from": "node_modules/nertc-electron-sdk/build/Release/",
         "to": "./resources",
         "filter": ["**/*"]
       }
     ]
   },
   "mac": {
     "extraFiles": [
       { 
         "from": "node_modules/nertc-electron-sdk/build/Release/", 
         "to": "./Resources" 
       }
     ]
   }
},

6. 如何使用 Mac M1 arm64 架构设备集成 NERTC Electron SDK。

答:NERTC SDK 底层没有编译 arm64 的能力,需要使用 x64 版本架构。您需要指定安装 x64 架构 npm 包和NERTC 包,命令如下。

npm install --target_arch=x64 --arch=x64 --npm_config_arch=x64

7. 如何在系统为 Windows-64 bit 的设备上使用 32 位的 NERTC Electron SDK 开发 32 位的应用程序。

答:有以下两种方案供您选择:

  • 方案一:安装 32 位的 node.js,然后正常执行 npm install 即可。

  • 方案二:安装 64 位的 node.js,然后通过如下命令行进行安装。

    npm install --target_arch=ia32 --arch=ia32 --npm_config_arch=ia32
    

功能相关

8. 调用 initialize 接口进行初始化时返回 30005 错误码。

答:一般为设置的日志路径不存在导致。您可以使用 Electron 原生 api 获取 exe 目录作为日志目录。

//Electron 主进程
import { app, BrowserWindow, ipcMain } from 'electron'
ipcMain.on('logPath', (event, arg) => {
  event.returnValue = app.getPath('exe')
})
//Electron 渲染进程
const {ipcRenderer } = require('electron')
let logPath = ipcRenderer.sendSync('logPath', '')

9. 调用 startVideoPreview 开启视频画面预览时无画面。

答:请在加入房间前调用 startVideoPreview,并且调用此接口前需先调用 setVideoDevice 设置视频设备 id。

10. 自 Electron 17.0.0 版本起使用 desktopCapturer 模块获取应用 id 只能在主进程进行,如何在渲染进程中获取应用 id。

答:利用进程间通信方式。渲染进程发起请求,主进程中调用 desktopCapturer 模块,并将结果返回至渲染进程。

//Electron 主进程
import { desktopCapturer, app, BrowserWindow, ipcMain } from 'electron'
ipcMain.on('desktopCapturer', (event, arg) => {
  desktopCapturer.getSources({ types: ['window', 'screen'], thumbnailSize: { width: 320, height: 180 }, fetchWindowIcons: true }).then(async sources => {
    if (sources.length > 0) {
      console.log(sources)
      event.returnValue = sources
    }
  })
})
//Electron 渲染进程
const { ipcRenderer} = require('electron')
let windowsList = ipcRenderer.sendSync('desktopCapturer', '')
console.log(windowsList)
此文档是否对你有帮助?
有帮助
去反馈
  • 接入相关
  • 功能相关