npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@tencentcloud/chat-uikit-engine

v2.3.2

Published

Tencent Cloud TUIChatEngine SDK for Chat TUIKit

Downloads

2,441

Readme

关于 chat-uikit-engine

chat-uikit-engine 是腾讯云 Chat TUIKit 的基础库,它同时支持 Web、H5、uni-app、小程序,并且与框架(vuejs, react, react-native, angular等)无关。基于我们精心设计的 Chat TUIKit,您可以快速构建界面优美的、跨平台的、可靠的、可扩展的 Chat 应用。

chat-uikit-engine 由 service、model 和 store 三大模块组成,其作用如下:

  • service 提供了一系列简化的聊天服务接口,包括切换会话、发送消息等。

  • model 提供了一系列数据模型,如 ConversationModel、MessageModel 等。这些模型类用来管理聊天数据。

  • store 提供了一系列状态管理模块,如会话状态管理、消息状态管理等,帮助开发者更加方便地管理聊天数据。

【安装】

npm install @tencentcloud/chat-uikit-engine

【集成】

import TUIChatEngine from '@tencentcloud/chat-uikit-engine';

// login to Tencent Cloud Chat
TUIChatEngine.login({
 SDKAppID: 0, // 将0替换为您的云通信应用的 SDKAppID,类型为 Number
 userID: 'your userID',
 userSig: 'your userSig',
 // 如果您需要发送图片、语音、视频、文件等富媒体消息,请设置为 true
 useUploadPlugin: true,
});

【发送第一条消息】

步骤 1:创建并打开会话

import { TUIConversationService } from '@tencentcloud/chat-uikit-engine';

TUIConversationService.switchConversation("C2Cuser1")
  .then() => {
    console.warn("success");
  })
  .catch((error) => {
    console.log(error);
  });

步骤 2:监听 messageList

import {
  TUIStore,
  StoreName,
  IMessageModel,
} from '@tencentcloud/chat-uikit-engine';

// 收到新消息、发送消息、删除消息等操作都会导致 messageList 发生变更
// watch messageList,开发者可及时获取到变更后的最新的 messageList
TUIStore.watch(StoreName.CHAT, {
  messageList: (list: Array<IMessageModel>) => {
    console.log("messageList", list); // messageList<IMessageModel>
  },
});

步骤 3:发送第一条消息

发送第一条消息后,开发者可以通过 步骤2 获取更新后的消息列表。

import { TUIChatService } from '@tencentcloud/chat-uikit-engine';

TUIChatService.sendTextMessage({
  payload: {
    text: "Hello world!",
  },
}).catch((error) => {
  console.log(error);
});

相关资源

常见问题

1. 什么是 UserSig?

UserSig 是用户登录即时通信 IM 的密钥,其本质是对 UserID 等信息加密后得到的密文。

2. 如何生成 UserSig?

UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端,并提供面向项目的接口,在需要 UserSig 时由您的项目向业务服务器发起请求获取动态 UserSig。更多详情请参见 服务端生成 UserSig

本文示例代码采用的获取 UserSig 的方案是在客户端代码中配置 SECRETKEY,该方法中 SECRETKEY 很容易被反编译逆向破解,一旦您的密钥泄露,攻击者就可以盗用您的腾讯云流量,因此该方法仅适合本地跑通功能调试。 正确的 UserSig 签发方式请参见上文。