当前位置：首页 > news >正文

Electron Demo 的快速编译与启动

news 来源：原创 2025/7/27 18:27:00

前言
本文将带你从零开始，快速搭建并运行一个基于 OpenIMSDK 的 Electron 应用。本项目以 OpenIMSDK 开源版为基础，借助 @openim/electron-client-sdk 与 @openim/wasm-client-sdk，能够同时构建 Web 端及桌面端（Windows、macOS、Linux）的即时通讯应用。如果你想要替换 Twilio 或 Sendbird 等第三方云通信服务，借助 OpenIMSDK 可大幅减少部署成本，完全掌握数据安全与隐私。

背景介绍
OpenIMSDK 是一款开源的即时通讯 SDK，与市面上一些收费的云通信服务（如 Twilio、Sendbird）不同，OpenIMSDK 让开发者能够自行掌控服务端部署与数据，适合对安全性、可控性有较高要求的业务场景。基于 OpenIMSDK，可以轻松开发微信、Slack、Zoom 类似的即时通讯、语音视频通话等应用。

预览图

环境准备
系统要求：

Windows 10 及以上
macOS 10.15 及以上
Linux 22.04 及以上
开发依赖：

Node.js ≥ 16.x（官网下载或 nvm）
npm ≥ 6.x（随 Node.js 一起安装）
Git（代码版本管理）
请提前部署好最新版本的 OpenIM Server，确保本地可正常与服务端通信。

获取示例项目
首先，使用 Git 拉取示例项目代码：

git clone https://github.com/openimsdk/openim-electron-demo.git
cd openim-electron-demo

npm install

等待所有依赖安装完成。

配置环境变量
打开项目根目录下的 .env 文件，按需修改其中的主机地址或域名配置。

例如，如果你的服务器 IP 为 123.45.67.89 且没有修改过服务端端口，可以这样配置：

VITE_BASE_HOST=123.45.67.89

VITE_WS_URL=ws:// $VITE_BASE_HOST:10001 VITE_API_URL=http://$ VITE_BASE_HOST:10002
VITE_CHAT_URL=http://$VITE_BASE_HOST:10008

VITE_BASE_DOMAIN=your-server-domain

VITE_WS_URL=wss://$VITE_BASE_DOMAIN/msg_gateway

VITE_API_URL=https://$VITE_BASE_DOMAIN/api

VITE_CHAT_URL=https://$VITE_BASE_DOMAIN/chat

如果你使用域名和 HTTPS（需要 nginx 配置），则取消注释带有 VITE_BASE_DOMAIN 的部分，并将 VITE_BASE_DOMAIN 修改为你的域名。同时，根据部署情况，配置正确的 wss:// 和 https:// 地址。

本地启动
执行以下命令即可启动开发服务器和 Electron 应用：

npm run dev

如果你仅需要在浏览器访问，则可以在控制台看到本地服务地址（例如 http://localhost:5173）。同时，Electron 打包的桌面应用也会自动运行，方便你在桌面环境下进行调试。

音视频通话
开源版 OpenIM 默认支持一对一的音视频通话功能。要使用此功能，需要在服务端安装并配置音视频服务，详情可参考官方文档。如果你有多人音视频和视频会议需求，可以联系官方邮箱 contact@openim.io 获取更多支持。

注意 ⚠️：如果要在 Web 端调用音视频功能，需在 localhost 或 HTTPS 环境下进行，以确保满足浏览器安全策略的限制要求。

生产环境构建
8.1 构建 Web 版本
如需将 Web 版本部署到服务器，请执行：

npm run build

生成后的静态文件会位于 dist 目录下，然后将其上传到你的 Web 服务器或使用 nginx 等服务进行托管即可。

8.2 构建 Electron 版本
将 package_electron.json 文件内容替换到 package.json，这样可以去掉仅在 Web 环境需要的依赖包，减少桌面版本应用的体积。

执行以下命令进行对应平台的打包：

• macOS：

npm run build:mac

• Windows：

npm run build:win

• Linux：

npm run build:linux

注意 ⚠️：在 macOS 上可以打包 Windows 和 Linux 版本应用程序，但在 Windows 和 Linux系统下只能打包对应系统的应用程序。

打包完成后，生成的安装包/可执行文件会位于 release 目录下。

常见问题与解决方案
Q1：正式部署发布到 Web 端时，出现报错：WASM: TypeError: Failed to execute ‘compile’ on ‘WebAssembly’: Incorrect response MIME type. Expected ‘application/wasm’
A：参考官方 nginx配置文件，重点在于default_type application/wasm。

Q2：正式部署发布到 Web 端时，wasm 加载过慢怎么办？
A：建议采用 gzip 或其他压缩方式优化 wasm 文件的体积，同时可以将其托管至 CDN，以获得更快的加载速度。

Q3：CKEditorError: ckeditor-duplicated-modules
A：通常是依赖冲突导致，可尝试运行 npm dedupe 整理依赖后再次启动或构建。

结语
通过本篇博客的指引，你应该已经能够在本地快速运行 OpenIMSDK 的 Electron 示例项目，并且对 Web 与 Electron 两种构建方式都能有一定认识。OpenIMSDK 为你提供了灵活度与可控性，希望能为你的项目带来更安全、可靠和低成本的实时通信解决方案。

如果你在使用或部署的过程中遇到问题，欢迎在 GitHub Issues 中与社区交流，或者直接联系官方获取更多支持。

Electron Demo 的快速编译与启动

前言本文将带你从零开始，快速搭建并运行一个基于 OpenIMSDK 的 Electron 应用。本项目以 OpenIMSDK 开源版为基础，借助 openim/electron-client-sdk 与 openim/wasm-client-sdk，能够同时构建 Web 端及桌面端（Windows、macOS、Lin…...

编程日记 2025/7/27 18:27:00

Web3核心技术解析：从区块链到C++实践

Web3作为下一代互联网的核心架构，正在通过区块链、智能合约、分布式存储等技术的融合，重塑数字世界的信任与协作模式。本文将从技术原理、应用场景及C实践案例三个维度，深入解析Web3的核心技术体系。一、Web3的核心技术栈 1. 区块链&#x…...

编程日记 2025/7/27 17:59:05

Elasticsearch中的_source字段讲解

_source 在 Elasticsearch 查询中用于限制返回的字段，类似于 SQL 中的 SELECT 指定列。代码示例： esSearchResults = es_service.search_documents({"query": {"terms": {"file_id":...

编程日记 2025/7/25 17:36:11

LlamaIndex 生成的本地索引文件和文件夹详解

LlamaIndex 生成的本地索引文件和文件夹详解 LlamaIndex 在生成本地索引时会创建一个 storage 文件夹，并在其中生成多个 JSON 文件。以下是每个文件的详细解释： 1. storage 文件夹结构 1.1 docstore.json 功能：存储文档内容及其相关信息。…...

编程日记 2025/7/26 12:18:52

笔记：react中父组件怎么获取子组件中的属性或方法

在子组件中我们可以使用下面两个方法去暴露你所要放行的属性或方法👇 1.useImperativeHandle 2.orwardRef 搭配使用例子 import React, { useState, forwardRef, useImperativeHandle } from "react"function Son(props, ref) {const [data] useStat…...

编程日记 2025/7/26 13:51:00

Python+CoppeliaSim+ZMQ remote API控制机器人跳舞

这是一个使用Python和CoppeliaSim（V-REP）控制ASTI人型机器人进行舞蹈动作的演示项目。项目描述本项目展示了如何使用Python通过ZeroMQ远程API与CoppeliaSim仿真环境进行交互，控制ASTI人型机器人执行预定义的舞蹈动作序列。项目包含完整的机…...

编程日记 2025/7/26 13:50:58

oracle rac时区问题导致远程查询时间不准

远程工具SQLDev工具和应用出来的时间都要慢12个小时检查操作系统和硬件时间 # date Fri Apr 18 15:54:11 CST 2025 date -R Fri, 18 Apr 2025 16:06:24 0800 # hwclock -r Fri 18 Apr 2025 04:08:38 PM CST -0.313786 seconds 都是没有问题，时间和时区都是…...

编程日记 2025/7/26 13:50:55

LPO 光模块：下一代数据中心网络的节能高效新选择

一、LPO 光模块的定义与核心原理 LPO（Linear Pluggable Optics，线性可插拔光模块）是光通信领域针对高速率、低功耗需求推出的创新解决方案。其核心突破在于摒弃传统光模块中的 DSP（数字信号处理）芯片，采用线…...

编程日记 2025/7/26 13:50:52

MCP Server Java 开发框架的体验比较（spring ai mcp 和 solon ai mcp）

目前已知的两个 mcp-server java 应用开发框架（ID类的，封装后体验都比较简洁）： spring-ai-mcp，支持 java17 或以上solon-ai-mcp，支持 java8 或以上（也支持集成到 springboot2, jfinal, vert.x …...

编程日记 2025/7/26 13:50:50

OpenCV 图形API（45）颜色空间转换-----将图像从 BGR 色彩空间转换为 YUV 色彩空间函数BGR2YUV()

操作系统：ubuntu22.04 OpenCV版本：OpenCV4.9 IDE:Visual Studio Code 编程语言：C11 算法描述将图像从BGR色彩空间转换为YUV色彩空间。该函数将输入图像从BGR色彩空间转换为YUV。B、G和R通道值的常规范围是0到255。输出图像必须是8位无符…...

编程日记 2025/7/27 15:23:58

C++入门语法

C入门首先第一点，C中可以混用C语言中的语法。但是C语言是不兼容C的。C主要是为了改进C语言而创建的一门语言，就是有人用C语言用不爽了，改出来个C。命名空间 c语言中会有如下这样的问题： 那么C为了解决这个问题就整出了一个命名…...

编程日记 2025/7/26 8:54:37

个性化的配置AndroidStudio

Android Studio 提供诸多向导和模板，可用于验证 Java 开发套件 (JDK) 和可用 RAM 等系统要求，以及配置默认设置，例如经过优化的默认 Android 虚拟设备 (AVD) 模拟和更新的系统映像。本文档介绍了可用于自定义 Android Studio 使用方式的其他配…...

编程日记 2025/7/25 10:52:27

Python-24：小R的随机播放顺序

问题描述小R有一个特殊的随机播放规则。他首先播放歌单中的第一首歌，播放后将其从歌单中移除。如果歌单中还有歌曲，则会将当前第一首歌移到最后一首。这个过程会一直重复，直到歌单中没有任何歌曲。例如，给定歌单 [5, 3, 2, 1,…...

编程日记 2025/7/26 13:50:46

JavaScript — 总结

介绍 JavaScript是一种广泛应用于Web开发的高级脚本语言，主要用于为网页添加交互功能。作为前端开发的三大核心技术之一，它与HTML（结构）和CSS（样式）协同工作，通过操作DOM元素实现动态内容更新、…...

编程日记 2025/7/26 13:50:44

解决 Ubuntu 下 VTune 无法收集 CPU 硬件时间计数数据的问题

解决 Ubuntu 下 VTune 无法收集 CPU 硬件时间计数数据的问题在 Ubuntu 上使用 Intel VTune Profiler 时遇到无法收集 CPU 硬件性能计数器数据的问题，通常是由于权限和系统配置问题导致的。以下是解决方案： 1. 检查并加载性能监控模块首先确保 Linux…...

编程日记 2025/7/26 13:50:42

MySQL《事务》

文章目录前言一、什么是事务？二、事务的ACID特性三、如何使用事务？3.1 查看支持事务的存储引擎3.2 语法3.3 开启一个事务，执行修改后回滚3.4 开启一个事务，执行修改后提交3.5 保存点3.6 自动/手动提交事务四、事务的隔离性和隔离…...

编程日记 2025/7/26 16:32:04

微服务划分的思考

为什么微服务不是十全十美的，不是银弹，是什么原因导致必须要做微服务划分，是否有足够的动机支撑，是项目需要，还是领导的想法，公司层面是否有相应的规划。拆分后的服务谁来维护，研发同学是否愿意参与为什么，思考清楚了，接下来看还需要考虑怎么做单体应用的不足…...

编程日记 2025/7/26 16:32:03

介绍XML

XML（Extensible Markup Language，可扩展标记语言）是一种用于存储、传输和交换数据的标记语言，由万维网联盟（W3C）在1998年制定。它通过自定义标签描述数据结构，具有平台无关性、自描述性和结构化…...

编程日记 2025/7/26 16:32:01

从0开始配置spark-local模式

安装Spark的过程就是下载和解压的过程。接下来的操作，我们把它上传到集群中的节点，并解压运行。 1.启动虚拟机 2.通过finalshell连接虚拟机，并上传安装文件到 /opt/software下 3.解压spark安装文件到/opt/module下 tar -zxvf spark-3.3.1-…...

编程日记 2025/7/26 16:31:59

CSS基础-即学即用 -- 笔记1

目录前言CSS 基础1. 层叠样式表来源理解优先级源码顺序经验法则继承inherit 关键字initial 关键字 2. 相对单位em 和 rem响应式面板视口的相对单位使用vw定义字号使用calc()定义字号自定义属性（即CSS变量） 3. 盒模型调整盒模型前言只需一分钟就能学会…...

编程日记 2025/7/26 13:21:09

日志文件太大，如何分卷压缩便于传输

在IT系统维护和开发工作中，日志文件的作用举足轻重，它不仅记录了系统运行过程中的详细信息，还能帮助技术人员诊断问题、追踪事件和分析性能。然而，随着系统的长期运行，日志文件可能会迅速膨胀，特别是在高…...

编程日记 2025/7/26 16:31:55

【Django】设置让局域网内的人访问

操作步骤 1. 命令行窗口下查询【本机ip】 ipconfig2. Django项目的全局设置【settings.py】中进行如下设置 ALLOWED_HOSTS ["本机ip"]3. 启动Django项目：命令行下执行如下命令 python manage.py runserver 0.0.0.0:80004. 测试效果：浏览器…...

编程日记 2025/7/26 16:31:53

智慧教室电子班牌-智能管理系统源码，‌后端‌基于Spring Boot框架，前端‌使用Vue.js框架进行组件化开发

智慧班牌系统是一种集成了多种功能的电子班牌，包括校园信息发布、综合素质评价、考勤管理、家校互通、教务管理、考场管理和成绩分析等。它为班级和学校提供了一个多层次、多内容的信息发布平台，同时也为教师、家长和学生提供了一个安全、快捷、全面的互…...

编程日记 2025/7/26 16:31:52

[密码学实战]密评考试训练系统v1.0程序及密评参考题库（获取路径在文末）

[密码学实战]密评考试训练系统v1.0程序及密评参考题库引言：密评考试的重要性与挑战商用密码应用安全性评估（简称"密评"）作为我国密码领域的重要认证体系，已成为信息安全从业者的必备技能。根据国家密码管理局最新数据，截至2024年6月，全国仅有3000余人持有…...

编程日记 2025/7/26 16:31:50

Vue如何获取Dom

在Vue中获取DOM元素可以通过几种方法：1、使用模板引用（ref），2、使用事件绑定，3、使用生命周期钩子。这些方法各有优缺点，适用于不同的场景。本文将详细介绍这些方法的使用方式及其适用场景，帮助…...

编程日记 2025/7/26 16:31:48

AI大模型 —— 国产大模型 —— 华为大模型

有这么一句话，那就是AI大模型分两种，一种是大模型；另一种是华为大模型。如果从技术角度来分析，华为的技术不论是在软件还是硬件都比国外的大公司差距极大，甚至有些技术评论者认为华为的软硬件技术至少落后2.5代&#…...

编程日记 2025/7/26 16:31:46

LX4-数据手册相关

数据手册相关一如何获取数据手册 ST官网：www.st.com 中文社区网： https://www.stmcu.com.cn/Designresource/list/STM32F1/document/datasheet 淘宝的商品详情页二如何阅读数据手册芯片手册定义：由芯片制造商提供，详细…...

编程日记 2025/7/26 16:31:44

华为VRP系统知识总结及案例试题

目录 🧠 华为VRP系统优化整合笔记（完整版）一、VRP系统概述📌 什么是VRP（Versatile Routing Platform）？🚀 VRP系统发展历程二、设备文件系统与存储结构📂 常见文件类型&…...

编程日记 2025/7/26 16:31:43

深度解析云计算：概念、优势与分类全览

以下是对云计算概念、优点和分类更详细的介绍： 一、云计算的概念云计算是一种通过互联网提供计算服务的模式，它基于虚拟化、分布式计算、网络存储等一系列先进技术，将计算资源进行整合和管理，形成一个庞大的资源池。这些资源包…...

编程日记 2025/7/26 11:45:03

剑指offer经典题目（五）

目录栈相关二叉树相关栈相关题目一：定义栈的数据结构，请在该类型中实现一个能够得到栈中所含最小元素的 min 函数，输入操作时保证 pop、top 和 min 函数操作时，栈中一定有元素。OJ地址图示如下。主要思想：我们…...

编程日记 2025/7/26 16:31:39

Coze平台创建AI智能体的详细步骤指南

一、创建智能体的基础流程注册与登录访问Coze官网（www.coze.cn），使用邮箱或手机号注册账号并登录。创建智能体在控制台点击左侧“”按钮，选择“创建智能体”，输入名称（如“职场鼓励师”&…...

编程日记 2025/7/26 16:31:38

电商数据自动化采集方案：淘宝商品详情 API 接入与数据处理技巧

在电商行业高速发展的今天，数据已成为企业决策和竞争的核心要素。通过自动化采集淘宝商品详情数据，企业能够实时掌握市场动态、优化商品策略、提升用户体验。本文将详细介绍基于淘宝商品详情 API 的自动化采集方案，涵盖 API 接入流程、数据采…...

编程日记 2025/7/26 16:31:36

高并发内存池项目

高并发内存池项目一、项目介绍二、什么是内存池2.1池化技术2.2内存池2.3内存池主要解决的问题2.3.1外部碎片2.3.2内部碎片 2.4malloc的了解三、定长内存池的实现3.1 通过类型模板参数表示定长内存池3.2定长内存池的实现原理四、高并发内存池的框架设计4.1ThreadCache的实现4…...

编程日记 2025/7/26 16:31:34

你学会了些什么211201？--http基础知识

概念 HTTP–Hyper Text Transfer Protocol，超文本传输协议；是一种建立在TCP上的无状态连接（短连接）。整个基本的工作流程是：客户端发送一个HTTP请求（Request ），这个请求说明了客户端…...

编程日记 2025/7/26 16:31:32

储能集装箱电池簇安装支架结构设计（大纲）

储能集装箱电池簇安装支架结构设计第一章绪论 1.1 研究背景与意义储能技术在能源转型中的战略地位电池簇在储能系统中的核心作用支架结构对电池安全稳定运行的重要性研究电池簇安装支架的工程价值与应用前景 1.2 国内外研究现状国际先进储能集装箱支架设计技术概述国内…...

编程日记 2025/7/26 16:31:31

解决Chrome浏览器访问https提示“您的连接不是私密连接”的问题

如何绕过Chrome的“您的连接不是私密连接”证书警告页面在使用Chrome浏览器访问一些自签名或测试用的HTTPS网站时，常常会遇到这样一个拦截页面： “您的连接不是私密连接” 虽然这是Chrome出于安全考虑的设计，但对于开发者或测试人员来说&am…...

编程日记 2025/7/26 16:31:29

前端笔记-AJAX

什么是AJAX？ AJAX（Asynchronous JavaScript and XML）就是异步的JS和XML， 是一种无需刷新页面即可与服务器交换数据并更新部分网页内容的技术。它的核心是通过 JavaScript 在后台发送 HTTP 请求，接收服务器返回的…...

编程日记 2025/7/26 16:31:27

单片机可以用来做机器人吗？

不少同学心里都有个疑问：学了单片机到底能不能用来制作机器人呢？答案是毋庸置疑的，能！但具体该如何操作，又得掌握哪些知识呢？今天，咱们就用通俗易懂的话语，详细地为大家一步步剖析清楚。一、单片机 —— 机器人的 “智慧大脑” 单片机就如同机器人的大脑一般，通过编…...

编程日记 2025/7/26 16:31:26

VS Code + GitHub：高效开发工作流指南

目录一、安装 & 基本配置 1.下载 VS Code 2.安装推荐插件（打开侧边栏 Extensions） 3.设置中文界面（可选）二、使用 VS Code 操作 Git/GitHub 1.基本 Git 操作（不输命令行！） 2.连接 GitHub（第一次使用）三、克隆远程仓库到 VS Code 方法一（推荐）：方…...

编程日记 2025/7/26 16:31:24

Linux系统编程 day7、8 信号(周日划水了)

信号相关概念信号这章难就难在其抽象。信号共性：简单、不能携带大量数据、满足条件才发送。信号的特质：信号是软件层面上的“中断”，一旦信号产生，无论程序执行到什么位置，必须立即停止，处理信号&…...

编程日记 2025/7/26 16:31:23

.NET WPF 三维模型

文章目录 .NET WPF 三维模型1 Viewport3D1.1 3D 坐标系1.2 核心组件1.2.1 相机 (Camera)1.2.2 光源 (Light)1.2.3 3D 模型（Model3D） 1.3 模型纹理（Material）1.4 完整示例：创建坐标轴与立方体1.5 转换模型1.6 性能1.6.1…...

编程日记 2025/7/26 23:40:19

iOS 中的虚拟内存 (理解为什么需要虚拟内存)

什么叫“虚拟地址空间”？ 一句话：它是 CPU 看得见、App 以为自己独享，但实际上会被内核和硬件（MMU）动态翻译到真实物理内存的一整块“虚拟地图”。 1. 背景：为什么要“虚拟”？ 需求虚拟地址空…...

编程日记 2025/7/26 16:31:19

算法之动态规划

动态规划动态规划1. 核心思想2. 基本步骤3. 关键概念3.1 基本概念3.2 优化技巧 4. 常见应用场景5. 典型案例5.1 斐波那契数列5.2 背包问题5.2.1 0-1背包问题5.2.2 完全背包问题 5.3 最短路径——Floyd算法5.4 最长公共子序列（LCS）5.5 最长递增子序列&am…...

编程日记 2025/7/25 23:29:30

leetcode0130. 被围绕的区域- medium

1 题目：被围绕的区域官方标定难度：中给你一个 m x n 的矩阵 board ，由若干字符 ‘X’ 和 ‘O’ 组成，捕获所有被围绕的区域： 连接：一个单元格与水平或垂直方向上相邻的单元格连接。区域&#xff1a…...

编程日记 2025/7/26 16:31:16

衡石科技ChatBI--飞书数据问答机器人配置详解（附具体操作路径和截图）

先决条件需要在衡石系统认证方式中配置好飞书认证方式，具体步骤详见认证方式中关于飞书的部分。先完成这部分配置后，再进行以下步骤。飞书中创建机器人应用 1. 创建飞书应用在飞书企业自建应用管理中创建应用，设置logo&#xff…...

编程日记 2025/7/26 16:31:14

25.解决中医知识问答删除历史对话功能后端处理请求时抛出异常

ChatTest.vue:176 DELETE http://localhost:8080/api/chat/conversations/20 500 (Internal Server Error) deleteConversation ChatTest.vue:176 onClick ChatTest.vue:22 ChatTest.vue:185 删除失败 AxiosError {message: Request failed with status code 500, name: Axio…...

编程日记 2025/7/26 16:31:13

VITE_BASE_DOMAIN=your-server-domain

VITE_WS_URL=wss://$VITE_BASE_DOMAIN/msg_gateway

VITE_API_URL=https://$VITE_BASE_DOMAIN/api

VITE_CHAT_URL=https://$VITE_BASE_DOMAIN/chat

相关文章：