专为以下场景打造:REACT NATIVE

React Native
Chat SDK

使用 Tencent RTC React Native Chat SDK 构建移动消息功能。在 iOS 和 Android 之间共享聊天逻辑,同时保留您自己的界面和原生交互。

开发者资源

React Native Chat SDK 文档与示例

推动项目持续进展

将共享文件和团队讨论带入人们日常使用的移动工具。

REACT NATIVE 聊天功能

为您的产品构建消息通信基础

单聊对话

  • 一对一消息
  • 您自己的界面

群组消息

  • 共享会话
  • 成员管理 API

富消息

  • 文本与媒体
  • 自定义应用内容

会话状态

  • 历史记录和未读数量
  • 您的应用存储

用户身份

  • 您自己的用户 ID
  • UserSig 身份验证

应用集成

  • React Native APIs
  • 平台特定的生命周期

探索 React Native Chat APIs

从连接您的应用所需的 API 开始。

连接

一个消息层,两个平台

在连接用户之前,请先注册上传和网络插件。

阅读文档
chat.ts
import TencentCloudChat from '@tencentcloud/chat';
import NetInfo from '@react-native-community/netinfo';
import TIMUploadPlugin from 'tim-upload-plugin';

const chat = TencentCloudChat.create({ SDKAppID });
chat.registerPlugin({ 'chat-network-monitor': NetInfo });
chat.registerPlugin({ 'tim-upload-plugin': TIMUploadPlugin });

个性化定制

您的体验,由您定义。

围绕已连接的会话构建您自己的界面。

打造您自己的体验

将消息事件连接到产品所需的界面和交互。

阅读文档

开始使用

你的第一次对话从这里开始

  1. 01

    创建您的应用

    设置 Chat 应用和测试用户。

    打开 Chat 控制台
  2. 02

    添加 React Native Chat SDK

    按照平台指南连接您的项目。

    按照集成指南操作
  3. 03

    连接你的用户

    登录两个测试用户并发送第一条消息。

    连接您的用户
React Native Chat SDK
终端
npm install @tencentcloud/chat tim-upload-plugin @react-native-community/netinfo
chat.ts
import TencentCloudChat from '@tencentcloud/chat';
import NetInfo from '@react-native-community/netinfo';
import TIMUploadPlugin from 'tim-upload-plugin';

const chat = TencentCloudChat.create({ SDKAppID });
chat.registerPlugin({ 'chat-network-monitor': NetInfo });
chat.registerPlugin({ 'tim-upload-plugin': TIMUploadPlugin });

React Native Chat SDK 常见问题

SDK 是否会处理原生平台设置?

消息层可以共享,但原生模块、媒体权限、推送配置和设备构建仍需针对各平台进行设置。请按照 React Native SDK 指南使用受支持的软件包组合。

React Native Chat SDK 是否包含开箱即用的 UI?

SDK 提供消息 API 和事件。聊天界面由你的应用构建。插图展示了可能的应用体验。

如何对 React Native Chat SDK 的用户进行身份验证?

在后端生成生产环境 UserSig。将其传递给客户端用于身份验证,并将应用密钥保留在服务器上。

这些 React Native 代码片段能否构成一个完整的应用?

这些内容展示的是各个集成步骤。请按照完整指南完成导入、初始化、登录、错误处理和目标平台专属配置。发布前,请使用不同账户测试消息功能。

React Native Chat SDK 的使用量如何计费?

托管 Chat 服务的用量取决于您选择的套餐。请查看适用于您应用的内含功能和额度;可选插件和 Call 服务可能有单独的要求。

如何将 React Native 聊天 SDK 集成到 React Native 项目中?

安装文档所述的包和原生依赖,然后重新构建原生应用。核验权限、生命周期和原生回调,不应假设运行环境仅包含 JavaScript。

发布应用前如何测试 React Native 聊天 SDK?

检查登录、SDK 就绪、发送与接收事件,以及重连后的消息状态。

如何定制 React Native 聊天 SDK 的界面?

围绕文档中的 SDK 事件构建自己的会话列表、消息渲染和输入编辑器。

获取后续步骤所需的支持

构建你的下一次对话体验

使用 React Native Chat SDK 构建你的 app。