So implementieren Sie Voice-Chat im Knoten

So implementieren Sie Voice-Chat in Node: 1. Verwenden Sie das NodeJS-Modul Express, um einen Webserver zu erstellen. 2. Erstellen Sie eine https-Verbindung. 3. Echtzeitkommunikation zwischen dem Client und dem Server über „socket.io“.

Die Betriebsumgebung dieses Tutorials: Windows 10-System, Node-v16.18.0-Version, DELL G3-Computer

Wie implementiert Node Voice-Chat?

Voice-Chat basierend auf nodejs

Beschreibung

Das Programm nutzt webRTC-Technologie basierend auf der Gruppenchat-Funktion von iamshaunjp und fügt eine Sprachgruppen-Chat-Funktion hinzu, wenn andere Personen auf der Tastatur tippen , es wird eine WeChat-ähnliche Nachricht angezeigt, während die andere Partei tippt.

• Demo: https://www.php.cn/link/b2fc614266ad3627dca4dc5d37885d58
• Quellcode: https://www.php.cn/link/12a8193db4825679dc9baf49305efe92

Das verwendete NodeJS-Modul

• express: Erstellen Sie einen Webserver express：创建一个web服务器
• https：创建https连接（局域网或者外网webRTC需要https连接，具体见tutoril）
• socket.io：客户端与服务端实时通信

js文件

• chat.js：实现按钮事件的注册、文本数据的发送等
• record.js：实现语音消息的录取、播放、发送等

结构图和流程图

文本通信

详情见public/js/chat.js注释

发送数据

• 进入页面进行与服务器的socket连接
• 客户端输入文本数据
• 客户点击sent按钮，触发click事件，并产生chat事件准备想服务器emit
• soket连接发送给服务器chat事件和客户端产生的数据

接收数据

• socket接受到服务器发送来的data和服务器发送来的chat事件
• 提取data文本
• js在index.html添加文本数据，完成接收数据并显示

语音通信

详情见public/js/record.js注释

• 接受和发送语音数据类似与文本数据的通信
• 利用webRTC获取到用户的视频或者音频转换为blob格式数据，并发送给服务器数据。
• 接受消息时，数据类型是blob格式，对blob数据解析，利用html5的audio标签进行播放

服务器转发数据

客户端发送给服务器数据，服务器触发chat

https: Erstellen Sie eine https-Verbindung (LAN oder externes webRTC erfordert eine https-Verbindung, siehe tutoril

)socket.io: Echtzeitkommunikation zwischen Client und Server

js-Datei

• chat.js : Realisiert die Registrierung von Schaltflächenereignissen, das Senden von Textdaten usw.

record.js: Realisiert das Aufzeichnen, Abspielen und Senden von Sprachnachrichten usw.

Strukturdiagramme und Flussdiagramme

🎜🎜🎜🎜🎜Textkommunikation🎜🎜🎜Weitere Informationen finden Sie in der Anmerkung public/js/chat.js🎜🎜🎜🎜Daten senden🎜🎜🎜🎜Geben Sie die Seite ein Mit dem Server kommunizieren socketVerbinden 🎜🎜Der Client gibt Textdaten ein🎜🎜Der Kunde klickt auf die Schaltfläche gesendet, löst das click-Ereignis aus und generiert das chat-Ereignis zur Vorbereitung für den Serveremit🎜🎜soketDie Verbindung sendet Chat-Ereignisse an den Server und die vom Client generierten Daten🎜🎜 🎜🎜Empfangen von Daten🎜🎜🎜🎜socketEmpfangen und senden an den Server Die eingehenden Daten und das vom Server gesendete Chat-Ereignis🎜🎜Extrahieren Sie den Datentext🎜🎜js fügt Textdaten im index hinzu .html schließt den Empfang und die Anzeige der Daten ab🎜🎜🎜🎜 Sprachkommunikation🎜🎜🎜Weitere Informationen finden Sie im Kommentar public/js/record.js🎜 🎜🎜🎜Das Akzeptieren und Senden von Sprachdaten ähnelt der Textdatenkommunikation. 🎜🎜Mit webRTC erhalten Sie Video- oder Audiodaten des Benutzers, die in Daten im blob-Format konvertiert und an den Server gesendet werden . 🎜🎜Beim Empfang einer Nachricht ist der Datentyp das blob-Format. Die blob-Daten werden mit dem Audio-Tag von html5 analysiert und abgespielt.🎜🎜🎜🎜 Der Server leitet Daten weiter🎜🎜Der Client sendet Daten an den Server, und der Server löst das chat-Ereignis aus und sendet die vom Client gesendeten Daten in Form einer Übertragung an jeden Client, um den Vorgang abzuschließen Gruppenchat-Funktion. 🎜🎜🎜🎜Erstellen Sie ein https-Zertifikat🎜🎜Die Verwendung von webRTC auf localhost erfordert nicht die Verwendung von https, aber wenn webRTC in einem lokalen Netzwerk oder einem externen Netzwerk verwendet wird, muss webRTC zwingend verwendet werden Zum Testen finden Sie die spezifische Generierungsmethode und die Methode zum Festlegen von https : 🎜🎜

 openssl req -x509 -newkey rsa:2048 -keyout key.pem -out cert.pem -days 365

empfiehlt das Lernen: „🎜node.js Video-Tutorial🎜“ 🎜

Das obige ist der detaillierte Inhalt vonSo implementieren Sie Voice-Chat im Knoten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!