Biblioteca de cliente do Azure Communication Chat para JavaScript - versão 1.5.2
Os Serviços de Comunicação do Azure para Chat permitem que os programadores adicionem capacidades de chat às respetivas aplicações. Use esta biblioteca de cliente para gerenciar threads de bate-papo e seus usuários, além de enviar e receber mensagens de bate-papo.
Leia mais sobre os Serviços de Comunicação do Azure aqui
Primeiros passos
Pré-requisitos
- Uma assinatura do Azure.
- Um recurso de Serviços de Comunicação existente. Se precisar criar o recurso, você pode usar odo Portal do
Azure, odo Azure PowerShell ou oda CLI do Azure. - Node.js
Instalação
npm install @azure/communication-chat
Suporte do navegador
Pacote JavaScript
Para usar essa biblioteca de cliente no navegador, primeiro você precisa usar um bundler. Para obter detalhes sobre como fazer isso, consulte nossa documentação de agregação de .
No rollup.config.js
, adicione as seguintes exportações de nomes personalizados em cjs
plug-in.
cjs({
namedExports: {
events: ["EventEmitter"],
"@azure/communication-signaling": ["CommunicationSignalingClient", "SignalingClient"],
"@opentelemetry/api": ["CanonicalCode", "SpanKind", "TraceFlags"]
}
})
Conceitos-chave
Uma conversa de bate-papo é representada por um tópico. Cada usuário no tópico é chamado de participante do bate-papo. Os participantes do bate-papo podem conversar uns com os outros em particular em um bate-papo 1:1 ou se amontoar em um bate-papo em grupo 1:N. Os usuários também recebem atualizações quase em tempo real para quando os outros estão digitando e quando leram as mensagens.
ChatClient
ChatClient
é a interface principal para desenvolvedores que usam essa biblioteca de cliente. Ele fornece métodos assíncronos para criar e excluir um thread.
ChatThreadClient
ChatThreadClient
fornece métodos assíncronos para fazer as operações de mensagem e participantes do bate-papo dentro do thread de chat.
Exemplos
Inicializar o ChatClient
Use a URL do recurso e o token de acesso do usuário para inicializar o cliente de chat.
import { ChatClient } from '@azure/communication-chat';
import { AzureCommunicationTokenCredential } from "@azure/communication-common";
// Your unique Azure Communication service endpoint
const endpointUrl = '<ENDPOINT>';
const userAccessToken = '<USER_ACCESS_TOKEN>';
const tokenCredential = new AzureCommunicationTokenCredential(userAccessToken);
const chatClient = new ChatClient(endpointUrl, tokenCredential);
Criar um thread com dois usuários
Use o método createThread
para criar um thread de chat.
createChatThreadRequest
é usado para descrever a solicitação de thread:
- Use
topic
para dar um tópico de tópico;
createChatThreadOptions
é usado para definir os parâmetros opcionais para criar o thread:
- Use
participants
para listar os participantes do bate-papo a serem adicionados ao tópico; - Use
idempotencyToken
para especificar uma solicitação repetível
createChatThreadResult
é o resultado retornado da criação de um thread. Ele contém um chatThread
que é o thread que foi criado, bem como uma propriedade errors
que conterá informações sobre participantes inválidos se eles não puderem ser adicionados ao thread.
const createChatThreadRequest = {
topic: "Hello, World!"
};
const createChatThreadOptions = {
participants: [
{
id: { communicationUserId: '<USER_ID>' },
displayName: '<USER_DISPLAY_NAME>'
}
]
};
const createChatThreadResult = await chatClient.createChatThread(
createChatThreadRequest,
createChatThreadOptions
);
const threadId = createChatThreadResult.chatThread.id;
Criar um ChatThreadClient
O ChatThreadClient permitirá que você execute operações específicas para um tópico de bate-papo, como atualizar o tópico do tópico do bate-papo, enviar uma mensagem, adicionar participantes ao tópico do bate-papo, etc.
Você pode inicializar um novo ChatThreadClient usando o método getChatThreadClient
do ChatClient com uma ID de thread existente:
const chatThreadClient = chatClient.getChatThreadClient(threadId);
Enviar uma mensagem para o tópico
Use sendMessage
método para enviar uma mensagem para um thread identificado por threadId.
sendMessageRequest
é usado para descrever a solicitação de mensagem:
- Use
content
para fornecer o conteúdo da mensagem de chat;
sendMessageOptions
é usado para descrever os parâmetros opcionais de operação:
- Use
senderDisplayName
para especificar o nome de exibição do remetente; - Use
type
para especificar o tipo de mensagem, como 'texto' ou 'html';
sendChatMessageResult
é o resultado retornado do envio de uma mensagem, ele contém um ID, que é o ID exclusivo da mensagem.
const sendMessageRequest =
{
content: 'Hello Geeta! Can you share the deck for the conference?'
};
const sendMessageOptions:SendMessageOptions = {
senderDisplayName: "Jack",
type: "text"
};
const sendChatMessageResult = await chatThreadClient.sendMessage(sendMessageRequest, sendMessageOptions);
const messageId = sendChatMessageResult.id;
Receber mensagens de um thread
Com sinalização em tempo real, você pode se inscrever para ouvir novas mensagens recebidas e atualizar as mensagens atuais na memória de acordo.
// open notifications channel
await chatClient.startRealtimeNotifications();
// subscribe to new notification
chatClient.on("chatMessageReceived", (e) => {
console.log("Notification chatMessageReceived!");
// your code here
});
Como alternativa, você pode recuperar mensagens de bate-papo pesquisando o método listMessages
em intervalos especificados.
for await (const chatMessage of chatThreadClient.listMessages()) {
// your code here
}
Adicionar usuários a um thread
Depois que um thread é criado, você pode adicionar e remover usuários desse thread. Ao adicionar usuários, você dá a eles acesso para poder enviar mensagens para o thread. Você precisará começar obtendo um novo token de acesso e identidade para esse usuário. O usuário precisará desse token de acesso para inicializar seu cliente de chat. Mais informações sobre tokens aqui: Autenticar nos Serviços de Comunicação do Azure
const addParticipantsRequest =
{
participants: [
{
id: { communicationUserId: '<NEW_PARTICIPANT_USER_ID>' },
displayName: 'Jane'
}
]
};
await chatThreadClient.addParticipants(addParticipantsRequest);
Remover usuários de um thread
Semelhante ao acima, você também pode remover usuários de um thread. Para remover, você precisará rastrear os IDs dos participantes que você adicionou.
await chatThreadClient.removeParticipant({ communicationUserId: '<MEMBER_ID>' });
Subscrever o estado da ligação de notificações em tempo real
A subscrição de eventos realTimeNotificationConnected
e realTimeNotificationDisconnected
permite-lhe saber quando a ligação ao servidor de chamadas está ativa.
// subscribe to realTimeNotificationConnected event
chatClient.on('realTimeNotificationConnected', () => {
console.log("Real time notification is now connected!");
// your code here
});
// subscribe to realTimeNotificationDisconnected event
chatClient.on('realTimeNotificationDisconnected', () => {
console.log("Real time notification is now disconnected!");
// your code here
});
Solução de problemas
Próximos passos
Neste guia de início rápido, você aprendeu como:
- Criar um cliente de chat
- Criar um thread com 2 usuários
- Enviar uma mensagem para o tópico
- Receber mensagens de um thread
- Remover usuários de um thread
Contribuição
Se você quiser contribuir para esta biblioteca, leia o guia de contribuição para saber mais sobre como criar e testar o código.
Azure SDK for JavaScript