您好,登錄后才能下訂單哦!
本篇內(nèi)容主要講解“node如何實(shí)現(xiàn)語(yǔ)音聊天”,感興趣的朋友不妨來(lái)看看。本文介紹的方法操作簡(jiǎn)單快捷,實(shí)用性強(qiáng)。下面就讓小編來(lái)帶大家學(xué)習(xí)“node如何實(shí)現(xiàn)語(yǔ)音聊天”吧!
node實(shí)現(xiàn)語(yǔ)音聊天的方法:1、使用nodejs模塊express創(chuàng)建一個(gè)web服務(wù)器;2、創(chuàng)建https連接;3、通過(guò)“socket.io”實(shí)現(xiàn)客戶端與服務(wù)端實(shí)時(shí)通信即可。
基于nodejs的語(yǔ)音聊天
程序在 iamshaunjp 的群聊功能基礎(chǔ)上利用webRTC技術(shù),添加了語(yǔ)音群聊功能,在其他人鍵盤輸入時(shí),會(huì)出現(xiàn)類似微信的對(duì)方正在輸入字樣。
使用的nodejs模塊
express
:創(chuàng)建一個(gè)web服務(wù)器
https
:創(chuàng)建https連接(局域網(wǎng)或者外網(wǎng)webRTC需要https連接,具體見tutoril)
socket.io
:客戶端與服務(wù)端實(shí)時(shí)通信
js文件
chat.js
:實(shí)現(xiàn)按鈕事件的注冊(cè)、文本數(shù)據(jù)的發(fā)送等
record.js
:實(shí)現(xiàn)語(yǔ)音消息的錄取、播放、發(fā)送等
詳情見public/js/chat.js
注釋
發(fā)送數(shù)據(jù)
進(jìn)入頁(yè)面進(jìn)行與服務(wù)器的socket
連接
客戶端輸入文本數(shù)據(jù)
客戶點(diǎn)擊sent
按鈕,觸發(fā)click
事件,并產(chǎn)生chat
事件準(zhǔn)備想服務(wù)器emit
soket
連接發(fā)送給服務(wù)器chat事件和客戶端產(chǎn)生的數(shù)據(jù)
接收數(shù)據(jù)
socket
接受到服務(wù)器發(fā)送來(lái)的data和服務(wù)器發(fā)送來(lái)的chat事件
提取data文本
js在index.html
添加文本數(shù)據(jù),完成接收數(shù)據(jù)并顯示
詳情見public/js/record.js
注釋
接受和發(fā)送語(yǔ)音數(shù)據(jù)類似與文本數(shù)據(jù)的通信
利用webRTC
獲取到用戶的視頻或者音頻轉(zhuǎn)換為blob
格式數(shù)據(jù),并發(fā)送給服務(wù)器數(shù)據(jù)。
接受消息時(shí),數(shù)據(jù)類型是blob
格式,對(duì)blob
數(shù)據(jù)解析,利用html5的audio標(biāo)簽進(jìn)行播放
客戶端發(fā)送給服務(wù)器數(shù)據(jù),服務(wù)器觸發(fā)chat
事件,將客戶端發(fā)送來(lái)的數(shù)據(jù)以廣播的形式發(fā)送到每一個(gè)客戶端,完成群聊的功能。
在localhost中使用webRTC不需要使用https,但是在局域網(wǎng)或者外網(wǎng)使用webRTC,必須強(qiáng)制使用webRTC,這里采用自己生成證書供測(cè)試使用,具體生成方法和設(shè)置https方法參考博客:
生成自己簽名的證書(有效期365天)
openssl req -x509 -newkey rsa:2048 -keyout key.pem -out cert.pem -days 365
使用https連接的express,例子如下:
var fs = require('fs'),
https = require('https'),
express = require('express'),
app = express();
https.createServer({
key: fs.readFileSync('key.pem'),
cert: fs.readFileSync('cert.pem')
}, app).listen(55555);
app.get('/', function (req, res) {
res.header('Content-type', 'text/html');
return res.end('<h2>Hello, Secure World!</h2>');
});
到此,相信大家對(duì)“node如何實(shí)現(xiàn)語(yǔ)音聊天”有了更深的了解,不妨來(lái)實(shí)際操作一番吧!這里是億速云網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。