Rongyun IMKit web terminal is online, taking you to experience the uneven development efficiency

The prevalence of object-oriented programming has brought us to a magical world of encapsulation. By hiding some methods and execution steps of the program, we can achieve access and capability calls through the API. Follow [Rongyun Global Internet Communication Cloud] to learn more

Perhaps because of this, we also forget that behind some applications that we use every day and are accustomed to, there are actually very complex technologies. For example, IM instant messaging.

A while ago, one of the details of the "a company's technical director ripped off the boss on the company account" was that the technical team was outraged by the boss's request to launch the instant messaging function for a week. Instant messaging is so common that people almost forget that it is actually one of the most technically difficult functions in Internet applications, and it takes at least two months to complete.

Behind such ridiculous demands, in addition to lack of understanding of technology, there are also mixed experiences brought about by implementation methods.

With the help of third-party services, this process can be greatly reduced.

How a message in a single chat goes from the sender to the server, and then distributed to the receiver; how a message in a group chat is delivered to all group members; how to judge the user's online status, how to design offline push notification logic, and how to implement message pull fetch and message state synchronization.

All the complexity does not need to be considered, the implementation method and execution steps of the program are all hidden, and only one Rongyun IM SDK is needed, and developers can obtain complete capabilities through simple access. That's the power of encapsulation.

The packaging of products and services by Rongyun is still approaching the target state of the developer's business infinitely, making the access process simpler and the results closer to expectations. Recently, Rongyun IMKit Web SDK was launched . Web users click online experience 👈

So far, IMKit SDK has completed the coverage of Android, iOS, and Web key platforms, including single group chat, system notification capabilities, including high-quality UI , providing text, emoticons, pictures, GIF, voice, video, quotes, files, locations , etc. A built-in message type , and supports custom messages to meet customers' personalized message sending and display needs.

For developers, the IMKit SDK implements functions closer to the market with stronger productized performance, allowing developers to experience an overall improvement in productivity.

---

Full IM function & good UI quality

Full coverage of frequently used conversation list functions

UI encapsulation is carried out for common conversation list functions such as unread processing of conversation messages, conversation sticking to the top, conversation do not disturb, and global message content search. The functions are complete and the degree of productization is high.

Single group chat session interface out of the box

Provides a standardized one-to-one, multi-person group UI chat interface, encapsulating complex message input, content display logic, etc., developers do not need to carry out secondary development, out of the box.

Conversation message list

Group chat interface

Message Type Complete Encapsulation

Built-in text, emoticons, pictures, voice, location, GIF, small video, files and other message types and UI display processing logic, and can also achieve special message sending and display needs through the custom message function.

Support UI customization

Provide high-quality UI and interactive experience, and support high customization in addition to standardized UI, and flexibly set UI display style according to the application UI style.

Support multiple language switching

It supports multi-language switching function, and currently provides Chinese, English, and Arabic, providing a better user experience for customers who need to go overseas.

Support one-click access to audio and video

It perfectly undertakes the one-to-one, many-to-many audio and video calling capabilities of Rongyun, the minimalist audio and video function access process, and provides audio and video calling capabilities for single chat and group chat sessions.

---

Application scenarios

social private message

Interest group chat

office group

system notification

---

Low learning cost and fast integration

High degree of productization, complete functions, and out-of-the-box; only a few lines of code are needed to complete the integration quickly.

The code implementation is clear and standard IMKit layer interface documentation is provided. The web-side interface documentation is used as an example to show the following.

① Dependent installation

Integrate the IMKit SDK into your web project via NPM.

 npm install @rongcloud/imlib-next --save
npm install @rongcloud/imkit --save

② Import SDK

After the dependency installation is complete, import the IMKit core module.

 // imkit 为核心模块
import { defineCustomElements, imkit } from '@rongcloud/imkit'

defineCustomElements()

③ Initialize SDK

To initialize IMKit, you need to pass two mandatory parameters service and libOption

 // 初始化
imkit.init({
  service: custom_service,
  libOption: libOption,
});

④ Connect to Rongyun

Token represents the unique identity of a user in Rongyun. Every time you connect to the Rongyun server, you need to submit a Token to Rongyun for identity verification.

 POST /user/getToken.json HTTP/1.1
Host: api-cn.ronghub.com
App-Key: uwd1c0sxdlx2
Nonce: 14314
Timestamp: 1408710653491
Signature: 45beb7cc7307889a8e711219a47b7cf6a5b000e8
Content-Type: application/x-www-form-urlencoded

userId=jlk456j5&name=Ironman&portraitUri=http%3A%2F%2Fabc.com%2Fmyportrait.jpg

After getting the Token, you can call the connect method in main.js to connect to Rongyun.

 /**
 * 请替换 'token' 为上一步拿到的测试 token
*/
imkit.connect('当前用户 TOKEN').then((res) => {
  console.info('连接结果打印：', res);
  // 加载会话列表 CoreEvent 可通过 import { CoreEvent } from '@rongcloud/imkit' 获取
  imkit.emit(CoreEvent.CONVERSATION, true);
})