Barrymore, quel est le buzz autour de Voximplant? Sockets Web implémentés, monsieur

WebSocket est une norme progressive pour la communication en duplex intégral (bidirectionnelle) entre un client et un service tiers en temps réel. Les sockets Web sont utilisées pour organiser un échange de données continu sans demandes HTTP supplémentaires.

Et nous sommes heureux de vous informer que tout cela est devenu possible dans Voximplant grâce au nouveau module VoxEngine , qui s'appelle - surprise - WebSocket . Désormais, vous pourrez transférer du texte et de l'audio, en tirant pleinement parti des prises Web. Autrement dit, vous disposez d'un autre outil pour mettre à niveau votre application.

Dans cet article, vous apprendrez à créer une connexion WebSocket sortante, à transférer un flux audio via celui-ci et à le convertir en texte à l'aide de l' API Google Cloud Speech-to-Text .

Veuillez noter que Voximplant a une fonctionnalité intégrée pour convertir la parole en texte en temps réel sous le contrôle du module ASR . Ce module utilise des fonctions de Google, Yandex et Tinkoff, voir les détails ici .

L'article actuel décrit le cas où vous souhaitez utiliser un service tiers pour convertir la parole en texte et / ou dépenser de l'argent depuis son compte, et non depuis le compte Voximplant.

Notre module propose deux formats de travail:

• créer une connexion sortante;
• recevoir une connexion entrante et créer une prise Web pour celle-ci.

Sortant

La première chose que vous devez faire lors de la création d'une connexion sortante est d'exécuter le script VoxEngine. Appelez ensuite la méthode VoxEngine.createWebSocket , qui créera l'objet WebSocket . Cette méthode prend 2 paramètres: URL au format 'wss: // + domaine + chemin' et protocoles (facultatif). Voici à quoi cela ressemblerait dans le code:

VoxEngine.addEventListener(AppEvents.CallAlerting, function(e) { const webSocket = VoxEngine.createWebSocket( /*url*/ "wss://your_link/"); //       }); 

Si tout fonctionne, la méthode call.sendMediaTo enverra le flux audio au socket, et WebSocket.send , à son tour, enverra le flux audio décodé au format JSON à travers elle. En conséquence, vous recevrez des messages du service qui traite les demandes.

La méthode WebSocket.close est nécessaire pour fermer la connexion. Veuillez noter que la connexion peut être fermée à la fois côté client et côté serveur.

Boîte de réception

Afin de permettre les connexions entrantes, il est nécessaire de signaler cela via VoxEngine.allowWebSocketConnections , ainsi que de vous abonner à l'événement AppEvents.WebSocket . Il sera alors possible d'accepter la connexion entrante et d'obtenir l'objet WebSocket: event.WebSocket. Voir le code ci-dessous:

 VoxEngine.allowWebSocketConnections(); VoxEngine.addEventListener(AppEvents.WebSocket, function(e) { //       }); 

Pour créer une socket Web entrante, vous avez besoin du contrôle accessSecureURL. Il peut être extrait de l'événement AppEvents.Started ou de la réponse à la demande HTTP qui a démarré la session. Notez que «https» doit être remplacé par «wss» dans l'URL.

Les étapes restantes sont identiques à celles présentées dans le schéma de connexion sortante.

Vous aurez besoin

Pour implémenter la technologie WebSocket et la reconnaissance vocale dans votre application, vous aurez besoin de:

• Compte Voximplant. Si vous ne l'avez pas, n'hésitez pas à vous inscrire ici ;
• Application Voximplant, ainsi qu'un script, une règle et un seul utilisateur. Tout cela sera créé dans ce tutoriel;
• backend simple (nous allons démarrer le serveur sur node.js) avec la bibliothèque cliente Cloud connectée pour l'API Speech-to-Text;
• client Web pour passer un appel (nous utiliserons le téléphone Web sur phone.voximplant.com ).

1. Paramètres VOXIMPLANT

Pour commencer, connectez-vous à votre compte à l' adresse manage.voximplant.com/auth . Dans le menu de gauche, cliquez sur "Applications", créez-en un nouveau et nommez-le websocket. Allez dans votre application, passez à l'onglet Scripts, créez un script et collez-y le code suivant:

 require(Modules.WebSocket); VoxEngine.addEventListener(AppEvents.CallAlerting, function(e) { call = e.call; call.answer(); const webSocket = VoxEngine.createWebSocket( /*url*/ "wss://your_ngrok_link/"); webSocket.addEventListener(WebSocketEvents.ERROR, function(e) { Logger.write("LOG OUTGOING: WebSocketEvents.ERROR"); call.sendMessage("LOG OUTGOING: WebSocketEvents.ERROR"); }); webSocket.addEventListener(WebSocketEvents.CLOSE, function(e) { Logger.write("LOG OUTGOING: WebSocketEvents.CLOSE: " + e.reason); call.sendMessage("LOG OUTGOING: WebSocketEvents.CLOSE: " + e.reason); }); webSocket.addEventListener(WebSocketEvents.OPEN, function(e) { Logger.write("LOG OUTGOING: WebSocketEvents.OPEN"); Logger.write(JSON.stringify(e)) call.sendMessage("LOG OUTGOING: WebSocketEvents.OPEN"); }); webSocket.addEventListener(WebSocketEvents.MESSAGE, function(e) { Logger.write("LOG OUTGOING: WebSocketEvents.MESSAGE: " + e.text); call.sendMessage("LOG OUTGOING: WebSocketEvents.MESSAGE: " + e.text); if (e.text == "Hi there, I am a WebSocket server") { call.sendMediaTo(webSocket, { encoding: WebSocketAudioEncoding.ULAW, "tag": "MyAudioStream", "customParameters": { "param1": "12345" } }); } }); call.addEventListener(CallEvents.Disconnected, function(e) { Logger.write("LOG OUTGOING: terminating in 1 sec"); webSocket.close(); setTimeout(VoxEngine.terminate, 1000); }); }); 

Ce script VoxEngine envoie un flux audio à WebSocket et suit également ses événements (ERREUR, FERMER, OUVRIR, MESSAGE). Nous pouvons nous plonger dans les détails du script un peu plus tard.

Maintenant, allons dans l'onglet «Routage», cliquez sur la «Nouvelle règle» et appelons-la socketRule. Maintenant, il ne reste plus qu'à sélectionner votre script, et laisser le masque par défaut (. *).


La dernière chose que vous devez faire à ce stade est de créer un utilisateur. Basculez vers l'onglet «Utilisateurs», cliquez sur «Créer un utilisateur», spécifiez un nom (par exemple, socketUser) et un mot de passe, puis cliquez sur «Créer». Nous aurons besoin de cette paire nom d'utilisateur / mot de passe pour l'authentification dans le client Web à la dernière étape.


La configuration est terminée, mais avant de commencer à créer le serveur, regardons comment fonctionne le module WebSocket dans notre scénario.

2. Détails du script

Le module WebSocket permet aux développeurs d'ouvrir une connexion stable et d'envoyer des données via celle-ci. Pour utiliser ce module, nous devons le connecter au tout début du script:

 require(Modules.WebSocket); 

Grâce à la méthode createWebSocket, nous déterminons l'URL et les protocoles (facultatif). Vous pouvez apprendre comment obtenir l'URL de WebSocket dans la section suivante.

 const webSocket = VoxEngine.createWebSocket( /*url*/ "wss://your_ngrok_link/"); 

Après avoir créé l'objet WebSocket, nous continuons à gérer l'appel à l'intérieur du gestionnaire. À savoir, nous envoyons le média à l'objet WebSocket à l'aide de la méthode call.sendMediaTo.

Ici, vous pouvez définir le format d'encodage préféré, la balise et certains paramètres personnalisés. Si vous ne définissez pas l'encodage, PCM8 sera utilisé par défaut.

Cette méthode est appelée lorsqu'un message de connexion réussi est reçu . Dans notre scénario, le code d'appel ressemble à ceci:

 call.sendMediaTo(webSocket, { encoding: WebSocketAudioEncoding.ULAW, "tag": "MyAudioStream", "customParameters": { "param1": "12345" } }); 

Tous les autres événements WebSocket que vous voyez dans le code sont destinés au débogage; ils envoient des informations au journal de la session Voximplant. Vous pouvez les supprimer si vous le souhaitez.

Enfin, nous ajoutons le gestionnaire de fin de transfert de données correct. Dans notre cas, la session Voximplant mettra fin à son travail 1 seconde après la fin de l'appel établi ( Déconnecté ):

 call.addEventListener(CallEvents.Disconnected, function(e) { Logger.write("LOG OUTGOING: terminating in 1 sec"); webSocket.close(); setTimeout(VoxEngine.terminate, 1000); }); 

Maintenant que la logique du script est claire, il est temps de passer à la partie suivante, très importante de notre exemple.

3. Backend

Tout d'abord, assurez-vous que Node.js. est installé sur votre ordinateur. Vous pouvez le télécharger sur le site principal de Node.js. Exécutez ensuite les commandes suivantes dans la fenêtre du terminal, l'une après l'autre, pour configurer l'environnement de travail:

 npm install express npm install ws npm install @google-cloud/speech 

Et lorsque cela est fait, créez un fichier JS vide et placez-y le code suivant (les nuances du code seront mises en évidence ci-dessous):

 const app = require('express')(); const http = require('http').createServer(app); const WebSocket = require('ws'); const fs = require('fs'); const wss = new WebSocket.Server({ server: http }); //     Google Cloud const speech = require('@google-cloud/speech'); //    const client = new speech.SpeechClient(); const config = { encoding: 'MULAW', sampleRateHertz: 8000, languageCode: 'ru-RU', }; const request = { config, interimResults: true, }; let audioInput = []; let recognizeStream = null; process.env["NODE_TLS_REJECT_UNAUTHORIZED"] = 0; app.get('/', function(req, res) { res.send('<h1>Hello world</h1>'); }); wss.on('connection', (ws) => { //  ,       var wstream = fs.createWriteStream('myBinaryFile'); //   audioInput audioInput = []; //    recognizeStream = client .streamingRecognize(request) .on('error', err => { ws.close(); }) .on('data', data => { ws.send(data.results[0].alternatives[0].transcript) process.stdout.write( data.results[0] && data.results[0].alternatives[0] ? `Transcription: ${data.results[0].alternatives[0].transcript}\n` : `\n\nError occurred, press Ctrl+C\n` ) }); ws.on('close', (message) => { console.log('The time limit for speech recognition has been reached. Please disconnect and call again.'); wstream.end(); }) //  ,     message ws.on('message', (message) => { //     base64  recognizeStream try { let data = JSON.parse(message) if (data.event == "media") { let b64data = data.media.payload; let buff = new Buffer.from(b64data, 'base64'); recognizeStream.write(buff); wstream.write(buff); } } catch (err) { console.log(message) } }); //      ws.send('Hi there, I am a WebSocket server'); }); http.listen(3000, function() { console.log('listening on *:3000'); }); 

Maintenant que le serveur est configuré, il nous aidera à effectuer la reconnaissance vocale. Testez votre solution localement en créant un tunnel sur localhost 3000 à l'aide de ngrok.

Pour ce faire, procédez comme suit:

1. Installez ngrok en suivant les instructions sur son site Web .
2. Spécifiez votre authtoken pour ngrok pour lier le client à ce compte.
3. Exécutez la node your_file_name.js pour démarrer votre serveur sur localhost: 3000.
4. Accédez au dossier ngrok sur votre ordinateur et exécutez la commande ./ngrok http 3000 pour créer un tunnel entre le serveur local en cours d'exécution et l'URL publique.

Faites attention à l'URL publique générée, nous l'utilisons comme URL WebSocket avec le préfixe «wss» dans le script:

4. Reconnaissance vocale

Vous avez probablement remarqué que notre code principal contient des lignes liées à Google Cloud.

La bibliothèque elle-même est importée comme suit:

 const speech = require('@google-cloud/speech'); 

Vous devez maintenant spécifier comment traiter la demande de reconnaissance vocale. Pour ce faire, sélectionnez encoding, sampleRateHertz et languageCode dans la configuration générée:

 const config = { encoding: 'MULAW', sampleRateHertz: 8000, languageCode: 'en-US', }; 

Ensuite, créez un flux d'écriture qui vous permet d'enregistrer les données transférées dans un fichier:

 var wstream = fs.createWriteStream('myBinaryFile'); 

Lorsque tout est configuré, vous devez analyser le message et mettre les données audio au format base64 dans reconnaissentStream:

 let data = JSON.parse(message) if (data.event == "media") { b64data = data.media.payload; let buff = new Buffer.from(b64data, 'base64'); recognizeStream.write(buff); wstream.write(buff); } 

Immédiatement après cela, une demande de reconnaissance sera lancée et le traitement de cette demande commencera:

 recognizeStream = client .streamingRecognize(request) .on('data', data => { ws.send(data.results[0].alternatives[0].transcript) }); 

Enfin, fournissez les informations d'identification de votre compte de service pour connecter la bibliothèque Google à son backend. Pour ce faire, accédez à la page d'authentification Google et suivez toutes les étapes qui y sont répertoriées. Exécutez ensuite la commande d'exportation dans le même espace de travail (dans le même onglet «Terminal») que le node your_file_name.js:

 export GOOGLE_APPLICATION_CREDENTIALS="/home/user/Downloads/[FILE_NAME].json" 

Lancer les sockets

Ouvrez phone.voximplant.com , remplissez le formulaire et cliquez sur Connexion. Le nom d'utilisateur et le mot de passe font référence à l'utilisateur créé à l'étape 1:


Une fois l'autorisation réussie, cliquez sur Appeler et commencez à parler. Le nuage de synthèse vocale convertira votre discours en texte en temps réel, et vous pouvez voir ce texte dans la fenêtre du terminal.

Vous l'avez fait, félicitations! Nous espérons que vous avez aimé l'article et vous souhaitons plus d'intégration et de nouveaux défis.