tencent cloud

文档反馈

最后更新时间:2024-11-04 16:57:57
    本文将介绍如何快速实现聊天功能演示。您将在10分钟内完成以下关键步骤,并最终获得一个具有全面用户界面的聊天功能。在此之前,您可以直接体验下方聊天功能或 体验沙箱
    

    环境要求

    Node.js version 16+
    npm (use a version that matches the Node version in use)

    跑通 demo

    步骤1:下载源码

    MacOS
    Windows
    # Run the code in CLI
    git clone https://github.com/TencentCloud/chat-uikit-react
    # Go to the project
    cd chat-uikit-react/examples/sample-chat
    # Install dependencies of the demo
    npm install
    # Run the code in CLI
    git clone https://github.com/TencentCloud/chat-uikit-react
    # Go to the project
    cd chat-uikit-react/examples/sample-chat
    # Install dependencies of the demo
    npm install

    步骤2:配置 demo

    说明:
    为尊重表情设计版权,IM Demo/TUIKit 工程中不包含大表情元素切图,正式上线商用前请您替换为自己设计或拥有版权的其他表情包。下图所示默认的小黄脸表情包版权归腾讯云所有,可有偿授权使用,如需获得授权可 提交工单 联系我们。
    
    
    
    1. 打开examples/sample-chat项目,通过路径./examples/sample-chat/src/debug/GenerateTestUserSig.js找到GenerateTestUserSig.js文件。
    2. GenerateTestUserSig.js文件中设置 SDKAPPIDSECRETKEY ,其值可以在 Chat Console 中获取。 点击目标应用卡片,进入其配置页面。
    
    
    3. 将密钥信息复制并保存到 /examples/sample-chat/src/debug/GenerateTestUserSig.js 文件中。
    
    注意:
    本文提到的生成 UserSig 的方案是在客户端代码中配置 SECRETKEY,该方法中 SECRETKEY 很容易被反编译逆向破解,一旦您的密钥泄露,攻击者就可以盗用您的腾讯云流量,因此该方法仅适合本地跑通 Demo 和功能调试。
    正确的 UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端,并提供面向 App 的接口,在需要 UserSig 时由您的 App 向业务服务器发起请求获取动态 UserSig。更多详情请参见 服务端生成 UserSig

    步骤3:启动项目

    # Launch the project
    npm run start

    步骤4:发送您的第一条消息

    在输入框中输入您的消息,然后按 Enter 发送。
    

    集成 chat-uikit-react

    如果您想将 chat-uikit-react 集成到您的项目中,请跳转至 集成 chat-uikit-react

    交流与反馈

    加入 Telegram 技术交流群组WhatsApp 交流群,享有专业工程师的支持,解决您的难题。
    
    联系我们

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

    技术支持

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

    7x24 电话支持