tencent cloud

文档反馈

React Native

最后更新时间:2024-12-13 11:21:15
    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替换为您的即时通信 IM 应用的 SDKAppID
    };
    
    // 创建 SDK 实例
    // `TencentCloudChat.create()` 方法对于同一个 `SDKAppID` 只会返回同一份实例
    // SDK 实例通常用 chat 表示
    let chat = TencentCloudChat.create(options);
    
    // 设置 SDK 日志级别
    // 0: 普通级别,日志量较多,接入时建议使用
    // 1: release 级别,SDK 输出关键信息,生产环境时建议使用
    chat.setLogLevel(0);
    // chat.setLogLevel(1);
    
    // 注册腾讯云即时通信 IM 上传插件
    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 的具体细节。
    
    联系我们

    联系我们,为您的业务提供专属服务。

    技术支持

    如果你想寻求进一步的帮助,通过工单与我们进行联络。我们提供7x24的工单服务。

    7x24 电话支持