tencent cloud

即时通信 IM

动态与公告
产品动态
公告
产品简介
产品概述
基本概念
应用场景
功能介绍
账号系统
用户资料与关系链
消息管理
群组相关
公众号系统
音视频通话 Call
使用限制
购买指南
计费概述
价格说明
购买指引
续费指引
停服说明
退费说明
开发指引
Demo 专区
开通服务
体验 Demo
快速跑通
下载中心
SDK & Demo 源码
更新日志
聊天互动(含 UI)
TUIKit 组件介绍
快速开始
全功能接入
单功能接入
AI 集成
构建基础界面
更多特性
定义外观
国际化界面语言
推送服务(Push)
服务概述
名词解释
开通服务
快速跑通
厂商通道
数据统计
排查工具
客户端 API
服务端 API
推送回调
高级功能
更新日志
错误码
常见问题
智能客服
功能概述
快速入门
集成指引
管理员操作手册
客服操作手册
更多实践
直播间搭建
AI 聊天机器人方案
超大娱乐协作社群
Discord 实现指南
游戏内集成 Chat 指南
类 WhatsApp Channel 搭建方案
发送红包
Chat 应对防火墙限制相关
无 UI 集成
快速开始
集成 SDK
初始化
登录登出
消息相关
会话相关
群组相关
社群话题
用户管理
离线推送
云端搜索
本地搜索
公众号
客户端 API
JavaScript
Android
iOS & macOS
Swift
Flutter
Electron
Unity
React Native
C 接口
C++
服务端 API
生成 UserSig
REST API
第三方回调
控制台指南
新版控制台介绍
创建并升级应用
基本配置
功能配置
账号管理
群组管理
公众号管理
回调配置
用量统计
资源包查看指南
实时监控
开发辅助工具
访问管理
高级功能
常见问题
uni-app 常见问题
购买相关问题
SDK 相关问题
账号鉴权相关问题
用户资料与关系链相关问题
消息相关问题
群组相关问题
直播群相关问题
昵称头像相关问题
协议与认证
服务等级协议
安全合规认证
IM 政策
隐私政策
数据隐私和安全协议
平滑迁移方案
平滑迁移完整版
平滑迁移简化版
错误码
联系我们

React Native

PDF
聚焦模式
字号
最后更新时间: 2025-03-10 15:57:07
React Native SDK 是一个 npm 包,旨在将聊天功能无缝集成到您的应用程序中。它提供了一种与聊天 API 交互的简单方法,允许您执行发送消息、创建群组、置顶对话和更新个人头像等操作。它用原生 JavaScript 编写,与框架无关,这意味着它可以与任何前端框架一起使用,例如 Vue、React、React Native、uni-app、Angular 等。

在查看 Chat API 文档之前,我们建议您先查看可用的教程和示例应用程序。

本指南简要介绍了 腾讯云 Chat API,让您能够快速掌握其功能。该 API 非常灵活,可让您创建各种类型的聊天或消息传递应用程序。

Initialize

我们从初始化 chat 实例和监听事件开始。
import TencentCloudChat from '@tencentcloud/chat';
import TIMUploadPlugin from 'tim-upload-plugin';
import NetInfo from '@react-native-community/netinfo';

let options = {
SDKAppID: 0 // 接入时需要将0替换为您的即时通信 Chat 应用的 SDKAppID
};

// 创建 SDK 实例
// `TencentCloudChat.create()` 方法对于同一个 `SDKAppID` 只会返回同一份实例
// SDK 实例通常用 chat 表示
let chat = TencentCloudChat.create(options);

// 设置 SDK 日志级别
// 0: 普通级别,日志量较多,接入时建议使用
// 1: release 级别,SDK 输出关键信息,生产环境时建议使用
chat.setLogLevel(0);
// chat.setLogLevel(1);

// 注册腾讯云即时通信 Chat 上传插件
chat.registerPlugin({'tim-upload-plugin': TIMUploadPlugin});
// 注册网络信息插件
chat.registerPlugin({'chat-network-monitor': NetInfo});

let onMessageReceived = function(event) {
// event.name - TencentCloudChat.EVENT.MESSAGE_RECEIVED
// event.data - An array to store Messages - [Message]
};
chat.on(TencentCloudChat.EVENT.MESSAGE_RECEIVED, onMessageReceived);
然后,登录 Chat。
await chat.login({userID: 'your userID', userSig: 'your userSig'});

Messages

我们向“userB”发送第一条消息(假设“userB”已经登录 Chat)。

let message = chat.createTextMessage({
to: 'userB',
conversationType: TencentCloudChat.TYPES.CONV_C2C,
payload: {
text: 'Hello World!'
},
});

await chat.sendMessage(message);

Conversations

如果与“userB”的聊天对您很重要,并且您需要将其放在对话列表的顶部,则可以使用 pinConversation
await chat.pinConversation({ conversationID: 'C2CuserB', isPinned: true });

Profiles

如果您想更改您的头像,则可以使用 updateMyProfile
await chat.updateMyProfile({
avatar: 'http(s)://url/to/image.jpg',
});

Groups

如果您想创建一个群聊,比如和下属、同事讨论下个季度的销售计划,则可以使用 createGroup
await chat.createGroup({
type: TencentCloudChat.TYPES.GRP_WORK,
name: 'Sales Plan For The Next Quarter',
memberList: [{
userID: 'lindal',
}, {
userID: 'denny',
}] // If `memberList` is specified, `userID` must also be specified.
});

Following & Followers


现在直播、短视频很流行,如果您想关注某个达人主播,可以使用 followUser
await chat.followUser(['celebrity1', 'celebrity2', 'celebrity3']);

// 获取我的粉丝列表
await chat.getMyFollowersList();
想要观看直播时发表一些有趣的评论?您可以使用 joinGroup 加入直播组,然后使用 createTextMessage 创建消息,然后使用 sendMessage 发布它。
await chat.joinGroup({ groupID: 'group1' });

let message = chat.createTextMessage({
to: 'group1',
conversationType: TencentCloudChat.TYPES.CONV_GROUP,
payload: {
text: 'AMAZING!!!'
},
});

await chat.sendMessage(message);

结论

您现在已经掌握了全面运行聊天集成所需的基本组件,让我们继续阅读文档的 后续部分。在这些部分中,我们将更深入地探讨每个 API 的具体细节。


帮助和支持

本页内容是否解决了您的问题?

填写满意度调查问卷,共创更好文档体验。

文档反馈