websocket如何实现实时对讲机效果？
网友回复
要实现websocket对讲机功能，首先要编写一个html，代码如下：
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
<title>test</title>
</head>
<body>
<div>
<button id="intercomBegin">开始对讲</button>
<button id="intercomEnd">关闭对讲</button>
<audio id="playsoud"></audio>
</div>
</body>
<script>
var begin = document.getElementById('intercomBegin');
var end = document.getElementById('intercomEnd');
var audo = document.getElementById('playsoud');
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
var ws = null;//实现WebSocket
var record=null;//多媒体对象，用来处理音频
var timeInte = null;//定义一个定时器
begin.onclick = function() {
console.log('开始对讲')
}
end.onclick = function() {
console.log('关闭对讲')
if(ws) {
ws.close();
record.stop();
clearInterval(timeInte);
}
}
function init(rec){
record = rec;
}
if (!navigator.getUserMedia) {
alert('浏览器不支持音频输入');
}else{
navigator.getUserMedia(
{ audio: true },
function (mediaStream) {
init(new Recorder(mediaStream));
},function(error){
console.log(error)
}
)
}
//录音对象
var Recorder = function(stream) {
var sampleBits = 16;//输出采样数位 8, 16
var sampleRate = 8000;//输出采样率
var context = new AudioContext();
var audioInput = context.createMediaStreamSource(stream);
var recorder = context.createScriptProcessor(4096, 1, 1);
var audioData = {
size: 0 //录音文件长度
, buffer: [] //录音缓存
, inputSampleRate: 48000 //输入采样率
, inputSampleBits: 16 //输入采样数位 8, 16
, outputSampleRate: sampleRate
, oututSampleBits: sampleBits
, clear: function() {
this.buffer = [];
this.size = 0;
}
, input: function (data) {
this.buffer.push(new Float32Array(data));
this.size += data.length;
}
, compress: function () { //合并压缩
//合并
var data = new Float32Array(this.size);
var offset = 0;
for (var i = 0; i < this.buffer.length; i++) {
data.set(this.buffer[i], offset);
offset += this.buffer[i].length;
}
//压缩
var compression = parseInt(this.inputSampleRate / this.outputSampleRate);
var length = data.length / compression;
var result = new Float32Array(length);
var index = 0, j = 0;
while (index < length) {
result[index] = data[j];
j += compression;
index++;
}
return result;
}, encodePCM: function(){//这里不对采集到的数据进行其他格式处理，如有需要均交给服务器端处理。
var sampleRate = Math.min(this.inputSampleRate, this.outputSampleRate);
var sampleBits = Math.min(this.inputSampleBits, this.oututSampleBits);
var bytes = this.compress();
var dataLength = bytes.length * (sampleBits / 8);
var buffer = new ArrayBuffer(dataLength);
var data = new DataView(buffer);
var offset = 0;
for (var i = 0; i < bytes.length; i++, offset += 2) {
var s = Math.max(-1,...点击查看剩余70%
by thinkfuture
我知道答案，我要回答
私活外包
最新提问
阿里云ESA、cloudflare worker、腾讯云EdgeOne网站代理托管哪家更好？
剪映能打开.fcpxml格式的文件吗？
增量式编码器与绝对式编码器的区别是啥？
有没有开源的单张照片或者序列帧图片或视频就能重建4d场景动画项目？
chrome网页突然报错：错误代码：RESULT_CODE_KILLED_BAD_MESSAGE
openai的codex如何全程无需手动确认自动修改文件？
阿里云oss前端上传文件直传如何限制文件类型？
阿里云oss前端获取policy签名直传oss上传文件回调如何传？
如何将根据三维物体通过提示词变成可交互的4d场景动画？
浏览器中实时摄像头离线视觉ai模型有吗？
