Quick introduction to Electron: Web-based Cross-platform Desktop Implementation – Instant Messaging
Electron knowledge popularization
At present, most of the communication software on the market supports a variety of platforms, such as Android, iOS, PC, Web, small program, etc. Due to the high cost of traditional PC development. So today I recommend using Electron for PC.
Electron is able to build cross-platform desktop applications using HTML, CSS, and JavaScript by merging Chromium and Node.js into the same runtime environment.
Electron can package developed programs into Mac, Windows, and Linux systems.
The Electron’s official website https://www.electronjs.org/
Reasons for developing Electron on PC
-
Using Web technology for development, development cost is low, scalability is strong;
-
Cross-platform, one set of code can be packaged into Windows, Linux and Mac software.
-
Can be directly extended on existing Web applications;
-
Provide capabilities that browsers don’t have;
Instant messaging
Most of the traditional Web communication is implemented by Websock or long polling. At present, there are also a lot of instant messaging parties on the market, such as Rongyun, netease Cloud and so on. I chose Rongyun.
Rongyun provides a desktop solution that is implemented using Electron. However, I think that version is a little low, but I tried it.
Download the Demo to start, the Demo is very simple but the basic function is still there, the address in the Demo into my own address is more convenient.
Some implementation process is omitted here. Electron uses Demo provided by Rongyun, and the web site is the previously integrated Web SDK of Rongyun. If you want to look at the documentation, I won’t show you again because there are many other modules in the project.
The document address docs. Rongcloud. Cn/v4 / views/im…
Since our scene is a single group chat, the core interface used is as follows.
-
Initializes the connection docs. Rongcloud. Cn/v4 / views/im…
-
Set up to monitor the docs. Rongcloud. Cn/v4 / views/im…
-
Connect melting cloud docs. Rongcloud. Cn/v4 / views/im…
-
Message docs. Rongcloud. Cn/v4 / views/im…
The code snippet directly used in the quick integration was modified during the test. It’s still very convenient. You can check it out if you want.
