Azure Communication Chat-clientbibliotheek voor JavaScript - versie 1.5.0
met Azure Communication Services voor chat kunnen ontwikkelaars chatmogelijkheden toevoegen aan hun app. Gebruik deze clientbibliotheek om chatthreads en hun gebruikers te beheren en chatberichten te verzenden en te ontvangen.
Lees hier meer over Azure Communication Services
Aan de slag
Vereisten
- Een Azure-abonnement.
- Een bestaande Communication Services-resource. Als u de resource moet maken, kunt u azure portal, de Azure PowerShell of de Azure CLI gebruiken.
- Node.js
Installeren
npm install @azure/communication-chat
Browserondersteuning
JavaScript-bundel
Als u deze clientbibliotheek in de browser wilt gebruiken, moet u eerst een bundler gebruiken. Raadpleeg onze bundeldocumentatie voor meer informatie over hoe u dit doet.
Voeg rollup.config.js
in de volgende aangepaste naamexports toe in cjs
de invoegtoepassing.
cjs({
namedExports: {
events: ["EventEmitter"],
"@azure/communication-signaling": ["CommunicationSignalingClient", "SignalingClient"],
"@opentelemetry/api": ["CanonicalCode", "SpanKind", "TraceFlags"]
}
})
Belangrijkste concepten
Een chatgesprek wordt vertegenwoordigd door een thread. Elke gebruiker in de thread wordt een chatdeelnemer genoemd. Chatdeelnemers kunnen privé met elkaar chatten in een 1:1-chat of in een 1:N-groepschat. Gebruikers krijgen ook bijna realtime updates voor wanneer anderen typen en wanneer ze de berichten hebben gelezen.
ChatClient
ChatClient
is de primaire interface voor ontwikkelaars die deze clientbibliotheek gebruiken. Het biedt asynchrone methoden voor het maken en verwijderen van een thread.
ChatThreadClient
ChatThreadClient
biedt asynchrone methoden voor het uitvoeren van de bewerkingen van bericht- en chatdeelnemers binnen de chat-thread.
Voorbeelden
ChatClient initialiseren
Gebruik resource-URL en gebruikerstoegangstoken om de chatclient te initialiseren.
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);
Een gesprek met twee gebruikers maken
Gebruik de methode createThread
om een chat-thread te maken.
createChatThreadRequest
wordt gebruikt om de thread-aanvraag te beschrijven:
- Gebruik
topic
om een threadonderwerp te geven;
createChatThreadOptions
wordt gebruikt om de optionele params in te stellen om de thread te maken:
- Gebruik
participants
om de chatdeelnemers weer te geven die aan de thread moeten worden toegevoegd; - Gebruik
idempotencyToken
om een herhaalbare aanvraag op te geven
createChatThreadResult
is het resultaat dat wordt geretourneerd door het maken van een thread. Het bevat een chatThread
die de thread is die is gemaakt, evenals een errors
eigenschap die informatie bevat over ongeldige deelnemers als ze niet aan de thread kunnen worden toegevoegd.
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;
Een ChatThreadClient maken
Met De ChatThreadClient kunt u bewerkingen uitvoeren die specifiek zijn voor een chatgesprek, zoals het onderwerp van de chatthread bijwerken, een bericht verzenden, deelnemers toevoegen aan de chatthread, enzovoort.
U kunt een nieuwe ChatThreadClient initialiseren met behulp van de getChatThreadClient
methode van de ChatClient met een bestaande thread-id:
const chatThreadClient = chatClient.getChatThreadClient(threadId);
Een bericht naar een gesprek verzenden
Gebruik sendMessage
de methode om een bericht te verzenden naar een thread die wordt geïdentificeerd door threadId.
sendMessageRequest
wordt gebruikt om de berichtaanvraag te beschrijven:
- Gebruik
content
om de inhoud van het chatbericht op te geven;
sendMessageOptions
wordt gebruikt om de optionele bewerkingsparameters te beschrijven:
- Gebruik
senderDisplayName
om de weergavenaam van de afzender op te geven. - Gebruik
type
om het berichttype op te geven, zoals 'tekst' of 'html';
sendChatMessageResult
is het resultaat dat wordt geretourneerd door het verzenden van een bericht, het bevat een id, de unieke id van het bericht.
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;
Berichten van een gesprek ontvangen
Met realtime signalering kunt u zich abonneren om te luisteren naar nieuwe inkomende berichten en de huidige berichten dienovereenkomstig bij te werken in het geheugen.
// open notifications channel
await chatClient.startRealtimeNotifications();
// subscribe to new notification
chatClient.on("chatMessageReceived", (e) => {
console.log("Notification chatMessageReceived!");
// your code here
});
U kunt chatberichten ook ophalen door de methode listMessages
op opgegeven intervallen te pollen.
for await (const chatMessage of chatThreadClient.listMessages()) {
// your code here
}
Gebruikers toevoegen aan een thread
Zodra een thread is gemaakt, kunt u gebruikers toevoegen aan en verwijderen uit die thread. Door gebruikers toe te voegen, geeft u ze toegang om berichten naar de thread te kunnen verzenden. U moet beginnen met het ophalen van een nieuw toegangstoken en een nieuwe identiteit voor die gebruiker. De gebruiker heeft dat toegangstoken nodig om zijn chat-client te initialiseren. Meer informatie over tokens: Verifiëren bij Azure Communication Services
const addParticipantsRequest =
{
participants: [
{
id: { communicationUserId: '<NEW_PARTICIPANT_USER_ID>' },
displayName: 'Jane'
}
]
};
await chatThreadClient.addParticipants(addParticipantsRequest);
Gebruikers verwijderen uit een gesprek
Net als hierboven kunt u ook gebruikers uit een thread verwijderen. Als u wilt verwijderen, moet u de id's bijhouden van de deelnemers die u hebt toegevoegd.
await chatThreadClient.removeParticipant({ communicationUserId: '<MEMBER_ID>' });
Abonneren op de verbindingsstatus van realtime meldingen
Abonnement op gebeurtenissen realTimeNotificationConnected
en realTimeNotificationDisconnected
stelt u in staat om te weten wanneer de verbinding met de oproepserver actief is.
// 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
});
Problemen oplossen
Volgende stappen
In deze quickstart hebt u de volgende zaken geleerd:
- Een chatruimte maken
- Een thread maken met 2 gebruikers
- Een bericht naar een gesprek verzenden
- Berichten van een gesprek ontvangen
- Gebruikers verwijderen uit een gesprek
Bijdragen
Als u een bijdrage wilt leveren aan deze bibliotheek, leest u de handleiding voor bijdragen voor meer informatie over het bouwen en testen van de code.
Azure SDK for JavaScript
Feedback
https://aka.ms/ContentUserFeedback.
Binnenkort beschikbaar: In de loop van 2024 zullen we GitHub-problemen geleidelijk uitfaseren als het feedbackmechanisme voor inhoud en deze vervangen door een nieuw feedbacksysteem. Zie voor meer informatie:Feedback verzenden en weergeven voor