Using the Demo đâ
We strongly recommend running our framework-specific DEMO first. This will not only give you a hands-on experience of OpenIMSDK's features, but also help you quickly identify and resolve issues during actual integration.
Important Notes âī¸â
-
Starting from version
v3.8.3-patch.10, the package name changed fromopen-im-sdk-rnto@openim/rn-client-sdk. -
Starting from version
v3.8.3-patch.10.2, theoperationIDparameter is optional (if not provided, the SDK will auto-generate one). In earlier versions, this parameter was required and had to be passed explicitly. (operationID is used for backend log queries) -
Starting from version
v3.8.3-patch.10.2, you can useOpenIMSDK.on()to listen for events. In earlier versions, you had to use theOpenIMEmitterobject. The latest version supports both methods, butOpenIMSDK.on()is recommended as it provides better TypeScript type hints. -
v3.5.1contains significant breaking changes. If upgrading, please verify input parameters and return data.
Integration Steps (React Native CLI)â
1. Add Dependencyâ
yarn add @openim/rn-client-sdk
2. Initialize SDKâ
import OpenIMSDK from '@openim/rn-client-sdk';
import RNFS from 'react-native-fs';
RNFS.mkdir(RNFS.DocumentDirectoryPath + '/tmp');
OpenIMSDK.initSDK({
platformID: 2, // 1: iOS, 2: Android
apiAddr: 'http://your-server-ip:10002',
wsAddr: 'ws://your-server-ip:10001',
dataDir: RNFS.DocumentDirectoryPath + '/tmp',
logFilePath: RNFS.DocumentDirectoryPath + '/tmp',
logLevel: 5,
isLogStandardOutput: true,
});
3. Login & Set Listenersâ
import OpenIMSDK from '@openim/rn-client-sdk';
OpenIMSDK.login({
userID: 'IM user ID',
token: 'IM user token',
});
OpenIMSDK.on('onConnecting', () => {
console.log('onConnecting');
});
OpenIMSDK.on('onConnectSuccess', () => {
console.log('onConnectSuccess');
});
OpenIMSDK.on('onConnectFailed', ({ errCode, errMsg }) => {
console.log('onConnectFailed', errCode, errMsg);
});
For versions prior to v3.8.3-patch.10.2, use the following code:
import OpenIMSDKRN, { OpenIMEmitter } from '@openim/rn-client-sdk';
OpenIMSDKRN.login({
userID: 'IM user ID',
token: 'IM user token',
}, 'opid');
OpenIMEmitter.addListener('onConnecting', () => {
console.log('onConnecting');
});
OpenIMEmitter.addListener('onConnectSuccess', () => {
console.log('onConnectSuccess');
});
OpenIMEmitter.addListener('onConnectFailed', ({ errCode, errMsg }) => {
console.log('onConnectFailed', errCode, errMsg);
});
4. Send & Receive Messagesâ
import OpenIMSDK from '@openim/rn-client-sdk';
import type { MessageItem } from '@openim/rn-client-sdk';
OpenIMSDK.on('onRecvNewMessages', (messages: MessageItem[]) => {
console.log('onRecvNewMessages', messages);
});
const message = await OpenIMSDK.createTextMessage('hello openim');
OpenIMSDK.sendMessage({
recvID: 'recipient user ID',
groupID: '',
message,
})
.then(() => {
// Message sent successfully âī¸
})
.catch(err => {
// Failed to send message â
console.log(err);
});
For versions prior to v3.8.3-patch.10.2, use the following code:
import OpenIMSDKRN, { OpenIMEmitter } from '@openim/rn-client-sdk';
OpenIMEmitter.addListener('onRecvNewMessages', (messages) => {
console.log('onRecvNewMessages', messages);
});
const message = await OpenIMSDKRN.createTextMessage('hello openim', 'opid');
OpenIMSDKRN.sendMessage({
recvID: 'recipient user ID',
groupID: '',
message,
}, 'opid')
.then(() => {
// Message sent successfully âī¸
})
.catch(err => {
// Failed to send message â
console.log(err);
});