Préparez d’abord la connexion et la distribution des rappels. Le rappel est traité dans myContactCenter ; le site n’a pas besoin de rester ouvert comme un chat pour l’appel téléphonique ultérieur.
Cet exemple de base demande un rappel à l’heure actuelle du serveur. Il nécessite un client ASP.NET Core SignalR hébergé localement. Remplacez l’adresse du hub, la compétence et la langue.
<form id="callbackForm">
<label>Nom <input id="callbackName" maxlength="120" required></label>
<label>Numéro de téléphone <input id="callbackNumber" type="tel" required></label>
<label><input id="recordingPermission" type="checkbox">
Autoriser l’enregistrement du rappel</label>
<button id="requestCallback" type="submit">Demander un rappel</button>
</form>
<p id="callbackStatus" role="status"></p>
<script src="/js/signalr.min.js"></script>
<script type="module">
const form = document.getElementById("callbackForm");
const button = document.getElementById("requestCallback");
const status = document.getElementById("callbackStatus");
const callback = new signalR.HubConnectionBuilder()
.withUrl("https://kontakt.example.org/callbackHub")
.build();
callback.on("OnStateChangedAsync", (oldState, newState) => {
console.log("Demande de rappel", oldState, newState);
});
callback.on("OnPositionChangedAsync", (position) => {
console.log("Position communiquée", position);
});
form.addEventListener("submit", async (event) => {
event.preventDefault();
if (button.disabled || !form.reportValidity()) return;
button.disabled = true;
let connected = false;
try {
await callback.start();
connected = true;
const accepted = await callback.invoke("RegisterAsync",
document.getElementById("callbackNumber").value.trim(),
document.getElementById("callbackName").value.trim(),
"Support", "de-DE",
document.getElementById("recordingPermission").checked,
null);
status.textContent = accepted
? "Demande de rappel transmise. Le traitement a lieu dans le Contact Center."
: "Le service ne confirme pas la demande. Veuillez nous contacter.";
} catch (error) {
status.textContent = connected
? "La transmission ne peut pas être confirmée. Contactez-nous avant de demander à nouveau."
: "Aucune connexion au service de rappel. Veuillez réessayer plus tard.";
if (!connected) button.disabled = false;
}
});
</script>
Le formulaire empêche un nouvel envoi après la transmission. Si la connexion est interrompue pendant l’appel, il est impossible de savoir si la demande a déjà été traitée. Ne la répétez pas automatiquement.
Proposer une heure de rappel
Pour un rappel ultérieur, remplacez le dernier argument null par une
heure ISO validée, par exemple 2026-10-15T14:30:00+02:00. Définissez
clairement le fuseau horaire dans lequel le client choisit l’heure.
Un champ datetime-local ne contient pas lui-même de décalage de fuseau
horaire. Validez la date avant de la convertir et de l’envoyer.
Consultez la référence callbackHub : la réponse du hub ne confirme pas un rappel effectué. Avant de publier le site, vérifiez que la demande arrive réellement dans le Contact Center.