腾讯云视立方Electron 相关问题

news2024/11/22 6:18:54

安装相关

trtc-electron-sdk 是否兼容官方 Electron v12.0.1 版本?

兼容的,trtc-electron-sdk 没有特别依赖 elecron 自身的 SDK,所以没有相关的版本依赖。

Electron 下载慢甚至卡住不动?

当开始下载tmp-3320-1-SHASUMS256.txt-6.1.9文件或其它文件时,可能会特别慢,甚至在辛苦等待了很长时间后,等到的却是 npm 的 Timeout 错误:

 

Downloading tmp-3320-1-SHASUMS256.txt-6.1.9

[=> ] 1.0% of 5.56 kB (0 B/s)

解决方案 A:如果您是在家中办公,可以切换到国内的 npm 镜像。

 

# 指定 npm 国内镜像

$ npm config set registry=https://registry.npm.taobao.org/

# 指定 Electron 的国内镜像地址

$ npm config set ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron/

$ npm install

解决方案 B:如果您是在公司办公,那么您公司的网络管理员可能已经设置了代理,需要确认 npm 的 proxy 配置是否指向了公司的代理服务器,以及是否配置了环境变量ELECTRON_GET_USE_PROXY,如均无配置,请按以下步骤执行。

1.1 设置 npm 代理 :npm config set all_proxy=[您的代理地址]

1.2 配置ELECTRON_GET_USE_PROXY环境变量,这样 Electron 的安装脚本就会通过 npm 的代理下载。

解决方案 C:如果您是 Mac 环境。

 

$ export ELECTRON_GET_USE_PROXY=true

解决方案 D:如果您是 Windows 环境。

1.1 右键单击计算机 > 属性 > 高级系统设置 > 环境变量

1.2 按下图操作设置环境变量 ELECTRON_GET_USE_PROXY ,然后执行npm installnpm install --proxy=[您的代理地址]

下载 Electron 时出现 404 错误?

在终端中输入如下指令:

 

$ npm config set electron_custom_dir 8.1.1 # 根据版本号来决定

运行相关

Windows 32 系统运行报错Error:resource\trtc_electron_sdk.node is not a valid Win32 application, 提示需要 32 位的 trtc_electron_sdk.node?

解决方法

1. 进入到工程目录下的 trtc-electron-sdk 库目录下(xxx/node_modules/trtc-electron-sdk)。 执行:

 

npm run install -- arch=ia32

2. 下载完 32 位的trtc_electron_sdk.node后,重新对项目进行打包。

vscode terminal 启动 Electron Demo,进入房间后白屏?

vscode 需有摄像头权限, 可采用如下方式进行权限添加。

 

cd ~/Library/Application\ Support/com.apple.TCC/

cp TCC.db TCC.db.bak

sqlite3 TCC.db # sqlite> prompt appears.

# for Mojave, Catalina

INSERT into access VALUES('kTCCServiceCamera',"com.microsoft.VSCode",0,1,1,NULL,NULL,NULL,'UNUSED',NULL,0,1541440109);

# for BigSur

INSERT into access VALUES('kTCCServiceCamera',"com.microsoft.VSCode",0,1,1,1,NULL,NULL,NULL,'UNUSED',NULL,0,1541440109);

跑 Demo 抛出空指针未定义的错误:“cannot read property 'dlopen' of undefined”

解决方法: Electron 12 版本上下文隔离默认启用,可设置 contextIsolation 为 false。

 

let win = new BrowserWindow({

width: 1366,

height: 1024,

minWidth: 800,

minHeight: 600,

webPreferences: {

nodeIntegration: true,

contextIsolation: false

},

});

Electron 多次出现重新进房问题?

需要具体 case 进行分析,大致原因如下:

客户端网络状态不好(断网会触发重进房)。

连着发两次进房信令也会重进房的。

有可能是设备负载过高,导致解码失败的重进房。

同一个 UID 多端登录互踢导致的重进房。

终端出现提示“Electron failed to install correctly”?

当看似安装完成,运行项目时,终端上出现以下错误:

 

Error: Electron failed to install correctly, please delete node_modules/electron and try installing again

按照如下三个步骤进行手动下载

1. 执行npm config get cache查看缓存目录。

2. 手动下载 Electron ,并放到缓存目录中。

3. 重新执行npm install

调用摄像头或麦克风时直接崩溃?

使用 vscode 终端启动项目,当 trtc-electron-sdk 启动摄像头和麦克风时,程序直接崩溃:

解决方案 A:使用有授权的终端运行项目。

解决方案 B:给 vscode 授权:在系统偏好设置 > 安全与隐私 中允许 vscode 的授权。

解决方案 C:按以下步骤关闭保护机制:

1.1 重启系统,按住 command + r 键,直到系统进入保护模式。

1.2 打开 terminal 输入csrutil disable禁用保护机制。

1.3 重启,正常进入系统,此时就可以使用 vscode 的终端启动项目了。

1.4 如需重新启动保护机制,只需要在第二步中执行csrutil enable

Electron 在控制台中报错“xx is not defined”?

当运行项目时,Electron 在控制台中提示xx is not defined,其中xx指代 node 模块。例如:

 

Uncaught ReferenceError: require is not defined

在 Electron 的main.js文件中将nodeIntegration配置项改成 true:

 

let win = new BrowserWindow({

width: 1366,

height: 1024,

webPreferences: {

nodeIntegration: true, // 请将此项设置为 true

},

});

Mac 下,打包安装后,运行时白屏、崩溃问题

在 Mac OS 10.4 及以后版本,运行安装包时,如果获取不到 摄像头、麦克风、屏幕录制 权限,程序会因为没有这些硬件的访问权限,在进入 TRTC 房间后直接白屏或者崩溃。解决方法如下:

1. 添加 entitlements.mac.plist 文件,文件内容如下,相关配置的具体含义,请参见 苹果开发者网站。

 

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">

<plist version="1.0">

<dict>

<key>com.apple.security.cs.allow-unsigned-executable-memory</key>

<true></true>

<key>com.apple.security.cs.allow-jit</key>

<true></true>

<key>com.apple.security.cs.allow-dyld-environment-variables</key>

<true></true>

<key>com.apple.security.device.audio-input</key>

<true></true>

<key>com.apple.security.device.camera</key>

<true></true>

</dict>

</plist>

2. 使用 electron-builder 打包时,需要将 entitlements.mac.plist 文件路径配置到 electron-builder 打包配置中。参考代码如下,注意"entitlements""entitlementsInherit" 两个配置项,"hardenedRuntime"需要配置为 true,配置项含义请参见 electron-builder官网。

 

{

"build": {

"mac": {

"extraFiles": [

{

"from": "node_modules/trtc-electron-sdk/build/Release/trtc_electron_sdk.node",

"to": "./Resources"

}

],

"type": "distribution",

"hardenedRuntime": true,

"entitlements": "assets/entitlements.mac.plist",

"entitlementsInherit": "assets/entitlements.mac.plist",

"gatekeeperAssess": false,

"target": [

"dmg"

]

},

}

}

3. Mac OS 12.1 及以上版本,仅使用以上配置,已不足以申请 麦克风、摄像头权限,需要借助 Electron API 的 systemPreferences.askForMediaAccess() 接口,在主进程中,主动申请一次摄像头、麦克风权限。参考代码如下。systemPreferences.getMediaAccessStatus() 接口可以检测 麦克风、摄像头、屏幕录制权限,但 systemPreferences.askForMediaAccess() 接口只能申请 摄像头 和 麦克风权限。

 

async checkAndApplyDeviceAccessPrivilege() {

const cameraPrivilege = systemPreferences.getMediaAccessStatus('camera');

console.log(

`checkAndApplyDeviceAccessPrivilege before apply cameraPrivilege: ${cameraPrivilege}`

);

if (cameraPrivilege !== 'granted') {

await systemPreferences.askForMediaAccess('camera');

}

const micPrivilege = systemPreferences.getMediaAccessStatus('microphone');

console.log(

`checkAndApplyDeviceAccessPrivilege before apply micPrivilege: ${micPrivilege}`

);

if (micPrivilege !== 'granted') {

await systemPreferences.askForMediaAccess('microphone');

}

const screenPrivilege = systemPreferences.getMediaAccessStatus('screen');

console.log(

`checkAndApplyDeviceAccessPrivilege before apply screenPrivilege: ${screenPrivilege}`

);

}

4. 更多崩溃问题处理方法,请参阅 Electron 应用崩溃问题排查与解决方法。

打包相关

.node 模块的加载问题?

报错信息

打包编译出的程序在运行时,在控制台中看到类似的报错信息:

NodeRTCCloud is not a constructor

Cannot open xxx/trtc_electron_sdk.node或者The specified module could not be found

dlopen(xxx/trtc_electron_sdk.node, 1): image not found

解决方法

出现类似上述的信息,说明 trtc_electron_sdk.node 模块没有被正确的打包到程序中,可按照以下步骤进行处理。

1. 安装native-ext-loader

 

$ npm i native-ext-loader -D

2. 修改 webpack 配置。

2.1 使webpack.config.js在构建时可以接收名为--target_platform的命令行参数,以使代码构建过程按不同的目标平台特点正确打包,在 module.exports之前添加以下代码:

 

const os = require('os');

// 如果不传 target_platform 参数,程序会默认按当前平台类型进行打包

const targetPlatform = (function(){

let target = os.platform();

for (let i=0; i<process.argv.length; i++) {

if (process.argv[i].includes('--target_platform=')) {

target = process.argv[i].replace('--target_platform=', '');

break;

}

}

// win32 统一表示 Windows 平台,包含 32 位和 64 位。darwin 表示 Mac 平台

if (!['win32', 'darwin'].includes) target = os.platform();

return target;

})();

2.2 添加以下 rules 配置:

 

module: {

rules: [

{

test: /\.node$/,

loader: 'native-ext-loader',

options: {

rewritePath: targetPlatform === 'win32' ? './resources' : '../Resources'

}

},

]

}

注意:

使用 vue-cli 创建的项目,webpack 配置存放在 vue.config.js 文件中的 configureWebpack 选项中。

使用 create-react-app 创建的项目,webpack 配置文件为 [项目目录]/node_modules/react-scripts/config/webpack.config.js

3. 配置 packages.json 文件,添加打包配置和构建脚本。

3.1 添加electron-builder打包配置(注意大小写):

 

"build": {

"省略": "...",

"win": {

"extraFiles": [

{

"from": "node_modules/trtc-electron-sdk/build/Release/",

"to": "./resources",

"filter": ["**/*"]

}

]

},

"mac": {

"extraFiles": [

{

"from": "node_modules/trtc-electron-sdk/build/Release/trtc_electron_sdk.node",

"to": "./Resources"

}

]

},

"directories": {

"output": "./bin"

}

},

3.2 添加 scripts 构建、打包脚本create-react-app项目请参考以下配置:

 

"scripts": {

"build:mac": "react-scripts build --target_platform=darwin",

"build:win": "react-scripts build --target_platform=win32",

"compile:mac": "node_modules/.bin/electron-builder --mac",

"compile:win64": "node_modules/.bin/electron-builder --win --x64",

"pack:mac": "npm run build:mac && npm run compile:mac",

"pack:win64": "npm run build:win && npm run compile:win64"

}

3.3 vue-cli项目请参考以下配置:

 

"scripts": {

"build:mac": "vue-cli-service build --target_platform=darwin",

"build:win": "vue-cli-service build --target_platform=win32",

"compile:mac": "node_modules/.bin/electron-builder --mac",

"compile:win64": "node_modules/.bin/electron-builder --win --x64",

"pack:mac": "npm run build:mac && npm run compile:mac",

"pack:win64": "npm run build:win && npm run compile:win64"

}

找不到入口文件?

使用create-react-app创建的项目,使用electron-builder打包时可能会遇到此问题:

 

$ node_modules\.bin\electron-builder.cmd

• electron-builder version=22.6.0 os=6.1.7601

• loaded configuration file=package.json ("build" field)

• public/electron.js not found. Please see https://medium.com/@kitze/%EF%B8%8F-from-react-to-an-electron-app-ready-for-production-a0468ecb1da3

• loaded parent configuration preset=react-cra

其中public/electron.js not found指的就是无法找到入口文件。

解决方案

1. 移动并重命名入口文件:

 

$ cd [项目目录]

$ mv main.electron.js ./public/electron.js

2. 修改 pacakge.json 文件:

 

{

"main": "public/electron.js",

"省略": "..."

}

在执行打包时,出现 fs-extra 模块的语法错误?

 

[项目目录]\node_modules\electron-builder\node_modules\fs-extra\lib\empty\index.js:33

} catch {

^

SyntaxError: Unexpected token {

at new Script (vm.js:51:7)

可以升级到最新的 node ,具体请参见 Node.js 官方网站。

Mac 下如何构建 X64 和 ARM64 双架构包?

TRTC Electron SDK 从 10.6.403 版本开始,默认支持 Mac 下构建 X64 和 ARM64 双架构包,只需要修改一下 electron-builder 和构建工具 Webpack 或者 Vite 配置即可。详细配置请参见 TRTC Electron SDK: Mac 下构建双架构包。

支持双架构打包后,如果不修改配置,则默认构建单架构应用包,架构类型与构建机器 CPU 类型相同。

说明:

更多 Electron 相关问题请关注 Electron 常见问题收录 和 Electron 常见问题收录II,我们将持续更新。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2209825.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

考研C语言程序设计_语法相关习题(持续更新)

目录 一、语法题strlen转义字符内置数据类型字符串结束标志局部变量和全局变量名字冲突 局部优先switch语句中的关键字数组初始化是否正确注意define不是关键字C语言中不能用连等判断switch( )的括号里可以是什么类型? 二、程序阅读题有关static有关continue说明代码的功能for…

Postgresql JSON操作符

postgresql json数据 参考文章&#xff1a; JSON数据操作 操作符 1、-> 表示获取一个JSON数组元素&#xff0c;支持下标值(下标从0开始)、Key获取。 2、->> 表示获取一个JSON对象字符串。 3、#> 表示获取指定路径的一个JSON对象。 4、#>>表示获取指定路径…

脉冲目标检测网络模型SpikeYOLO——基于整值训练和脉冲驱动推理的高性能节能目标检测神经网络

最近看到目标检测领域又出新作&#xff0c;ECCV2024 满分Oral论文——《Integer-Valued Training and Spike-Driven Inference Spiking Neural Network for High-performance and Energy-efficient Object Detection》论文地址在这里&#xff0c;如下所示&#xff1a; 感兴趣的…

浪潮信息领航边缘计算,推动AI与各行业深度融合

在9月20日于安徽盛大召开的浪潮信息边缘计算合作伙伴大会上&#xff0c;浪潮信息指出&#xff0c;未来的计算领域将全面融入AI技术&#xff0c;特别是在企业边缘侧&#xff0c;智能应用特别是生成式人工智能应用正在迅速普及&#xff0c;这一趋势正引领边缘计算向边缘智算的方向…

R语言机器学习算法实战系列(三)lightGBM算法(Light Gradient Boosting Machine)

文章目录 介绍原理:应用方向:教程下载数据加载R包导入数据数据预处理数据描述数据切割设置数据对象调节参数训练模型预测测试数据评估模型模型准确性混淆矩阵模型评估指标ROC CurvePRC Curve特征的重要性模型SHAP值解释保存模型总结系统信息介绍 LightGBM(Light Gradient B…

QEMU与KVM架构

完整架构图&#xff0c;来自QEMU官网 QEMU与KVM架构总体上分为3部分。 VMX root模式的应用层&#xff08;左上&#xff09; VMX root模式的内核层&#xff08;左下&#xff09; 虚拟机的运行&#xff08;右上&#xff09; VMX root相对于VMX non-root模式&#xff0c;CPU引入了…

基于Arduino的自动浇灌系统

基于Arduino的自动浇灌系统 一、项目说明二、项目材料三、电路设计四、怎样工作五、怎样设置 一、项目说明 嘿&#xff0c;伙计们&#xff0c;在这篇教程中&#xff0c;我将向你们展示如何使用Arduino制作一个植物浇水系统&#xff0c;以一种简单的方式帮助你始终保持植物的水…

【MySQL】mysql导出数据WPS科学计数法解决方法

导出的长串数字 id 会导致科学计数法&#xff0c;修改 WPS 单元格格式可以解决 数字太长还是有问题&#xff0c;最后有个数字会变成 0 可以 直接用 python脚本转换一下 vim convert_txt_xlsx.py #!/usr/bin/env python3# 使用方法# 安装库 # pip3 install pandas openpyxl…

见微知著:OpenEuler系统启动流程

OpenEuler是一个开源的Linux发行版&#xff0c;它的启动流程涉及到多个阶段&#xff0c;包括固件初始化、引导加载程序、内核启动、初始化系统和服务管理器等。下面将详细介绍OpenEuler的启动流程。 一、启动流程 1. 固件初始化&#xff08;BIOS/UEFI&#xff09; 启动过程首…

跟踪用户状态,http协议无状态 Cookie HttpSession,Session和Cookie的关系

1.概念分析 跟踪用户状态指的是web应用能够分辨请求属于哪个用户&#xff0c;进而记录用户的状态&#xff0c;从而为用户提供连续的针对性的服务。比如有多个客户在同一个购物网站上购物&#xff0c;每一个用户都会有一个虚拟的购物车。当某个客户发送请求将商品添加到购物车时…

部署 Docker harbor (httphttps)及使用

部署 Docker harbor (http/https)及使用 官网下载docker harbor 和docker-compose 下载最新版本即可 https://github.com/goharbor/harbor https://github.com/docker/compose/releases 一.Docker harbor 配置http使用 1.解压harbor.tar # 解压至指定目录 [rootdocker ~]…

线程池 jvm web

线程池 分类 newCachedThreadPool 可进行缓存重复利用的线程池 newFxiedThreadPool 可重复利用的固定数目的线程池 newSingelThreadPool 单个work线程 newSingelThreadScheduledExecutor 单线程定时执行程序 newWorkStealingPool 带并行级别的线程池 核心参数 …

【OpenCV】(二)—— 图片读取展示和保存

上一小节中我们成功安装了opencv&#xff0c;我们这次学习使用opencv最基础的功能&#xff0c;读取和展示图片&#xff0c;首先准备一张用于实验的样例图片【cat.jpg】如下&#xff1a; 然后就是创建一个python项目并导入相关依赖 import cv2读取图片 读取图片使用imread方法…

Flythings学习(二)控件相关

文章目录 1 前言2 通用属性2.1 控件ID值2.2 控件位置2.3 背景色2.4 背景图2.5 显示与隐藏2.6 控件状态2.7 蜂鸣器控制 3 文本类TextView4 按键类 Button4.1 系统按键4.2 处理按钮长按事件4.3 处理按键触摸事件 5 复选框CheckBox6 单选组 RadioGroup7 进度条&#xff0c;滑块7.1…

vscode如何通过ssh远程链接其它电脑

客户端&#xff08;本机&#xff09;linux系统中vscode通过ssh插件远程连接服务器&#xff0c;其操作步骤如下&#xff1a; 配置服务器的配置文件 首先在~/.ssh/config文件中输入服务器的配置信息&#xff0c;如果没有这个文件就新建一个&#xff0c;其内容如下&#xff1a; …

线性系统性能分析方法2——根轨迹法

反馈控制系统的性质取决于闭环传递函数&#xff0c;只要求解出闭环系统的特征根&#xff0c;便能得到系统响应的变化规律。但对于3阶以上的系统求根比较困难。如果系统中有一个可变参数时&#xff0c;求根就更困难了。 1948年&#xff0c;伊凡思提出了一种确定系统闭环特征根的…

ENSP搭建基础网络拓扑图

一、ENSP的基本操作 1、配置网关 进入系统视图与退出 <Huawei>system-view [Huawei]quit 进入G0/0/0接口后配置ip [R1]interface GigabitEthernet 0/0/0 [R1-GigabitEthernet0/0/0]ip address 192.168.1.1 24查询所有接口的ip配置 [R1]display ip interface brief…

02 django管理系统 - base.html模板的搭建

下面&#xff0c;我们正式开始XX市第X医院员工信息管理系统的开发 首先&#xff0c;我们项目的目录结构如下&#xff1a; 然后&#xff0c;先把模板【base.html】界面的框架搭起来 {% load static %}<!DOCTYPE html> <html lang"en"><head><m…

使用最小二乘法画噪声数据的近似曲线

文章目录 问题MATLAB代码验证数据1验证数据2 问题 已知有系列含有噪声的数据&#xff08;x , y&#xff09;用最小二乘法计算m和b。(ymxb) MATLAB代码 disp(This promgram perform a leastsquares fit of an); disp(input data set to a straight line.); n_points input(E…

minio储存应用部署

一、minio简介 MinIO 是一个高性能的对象存储系统&#xff0c;设计用于存储大量的非结构化数据&#xff0c;如图片、视频、日志文件等。它完全兼容 Amazon S3 API&#xff0c;这意味着你可以使用与 S3 相同的工具和接口来管理和访问 MinIO 中的数据。 二、主要特性 1. S3 兼…