Electron桌面应用下，在拍照、展示pdf等模块时，容易导致应用白屏

xiaobangsky2025-06-04 13:42

Electron 应用白屏问题分析与解决方案

Electron 应用中拍照、PDF展示等模块导致白屏的常见原因通常与内存泄漏、渲染进程崩溃或资源加载超时有关。以下是具体排查与解决方法：

检查内存泄漏

项目中，分析代码，高频操作或未释放的资源可能导致内存耗尽。监控内存使用情况，及时释放无用资源。

javascript 复制代码

// 示例：监控内存使用
process.on('memoryUsage', (usage) => {
  console.log(`内存使用: ${JSON.stringify(usage)}`);
  if (usage.heapUsed > 500 * 1024 * 1024) {
    console.warn('内存过高，建议清理资源');
  }
});

主要调整项目中的代码

就是进行资源释放

javascript 复制代码

clearWrapBox:function(){
	if(_.isFunction(pdfSignView.destroyView)){
		pdfSignView.destroyView()
	}

	if(window.isElectron){
		//对当前的 iframe进行销毁，可以释放资源
		this.imgClsData.$wrapBox.find('iframe').attr('src','');
		//清空当前dom，可以释放内存，但是这并不能完全释放内存
		//需要将dom中的click事件一并销毁，才能有效缓解内存不释放的问题。
		this.imgClsData.$wrapBox.off('click').empty();
	}else{
		this.imgClsData.$wrapBox[0].innerHTML = "";
	}
}