websocket探索其语音、图片的能力_html/css_WEB-ITnose

var http = require('http');

var io = require('socket.io');

var server = http.createServer(function(req, res) {

res.writeHeader(200, {'content-type': 'text/html;charset="utf-8"'});

res.end();

}).listen(8888);

var socket =.io.listen(server);

socket.sockets.on('connection', function(socket) {

socket.emit('xxx', {options});

socket.on('xxx', function(data) {

// do someting

});

});

Chrome

Supported in version 4+

Firefox

Supported in version 4+

Internet Explorer

Supported in version 10+

Opera

Supported in version 10+

Safari

Supported in version 5+

var http = require(‘http’);

var server = http.createServer();

server.on(‘upgrade’, function(req) {

console.log(req.headers);

});

server.listen(8888);

ws = new WebSocket("ws://127.0.0.1:8888");

var crypto = require('crypto');

var WS = '258EAFA5-E914-47DA-95CA-C5AB0DC85B11';

require('net').createServer(function(o) {

var key;

o.on('data',function(e) {

if(!key) {

// 获取发送过来的KEY

key = e.toString().match(/Sec-WebSocket-Key: (.+)/)[1];

// 连接上WS这个字符串，并做一次sha1运算，最后转换成Base64

key = crypto.createHash('sha1').update(key+WS).digest('base64');

// 输出返回给客户端的数据，这些字段都是必须的

o.write('HTTP/1.1 101 Switching Protocols\r\n');

o.write('Upgrade: websocket\r\n');

o.write('Connection: Upgrade\r\n');

// 这个字段带上服务器处理后的KEY

o.write('Sec-WebSocket-Accept: '+key+'\r\n');

// 输出空行，使HTTP头结束

o.write('\r\n');

}

});

}).listen(8888);

function decodeDataFrame(e) {

var i = 0,

j,s,

frame = {

FIN: e[i] >> 7,

Opcode: e[i++] & 15,

Mask: e[i] >> 7,

PayloadLength: e[i++] & 0x7F

};

if(frame.PayloadLength === 126) {

frame.PayloadLength = (e[i++] << 8) + e[i++];

}

if(frame.PayloadLength === 127) {

i += 4;

frame.PayloadLength = (e[i++] << 24) + (e[i++] << 16) + (e[i++] << 8) + e[i++];

}

if(frame.Mask) {

frame.MaskingKey = [e[i++], e[i++], e[i++], e[i++]];

for(j = 0, s = []; j < frame.PayloadLength; j++) {

s.push(e[i+j] ^ frame.MaskingKey[j%4]);

}

} else {

s = e.slice(i, i+frame.PayloadLength);

}

s = new Buffer(s);

if(frame.Opcode === 1) {

s = s.toString();

}

frame.PayloadData = s;

return frame;

}

function encodeDataFrame(e) {

var s = [],

o = new Buffer(e.PayloadData),

l = o.length;

s.push((e.FIN << 7) + e.Opcode);

if(l < 126) {

s.push(l);

} else if(l < 0x10000) {

s.push(126, (l&0xFF00) >> 8, l&0xFF);

} else {

s.push(127, 0, 0, 0, 0, (l&0xFF000000) >> 24, (l&0xFF0000) >> 16, (l&0xFF00) >> 8, l&0xFF);

}

return Buffer.concat([new Buffer(s), o]);

}

var ws = new WebSocket("ws://xxx.xxx.xxx.xxx:8888");

ws.onopen = function(){

console.log("握手成功");

};

ws.onmessage = function(e) {

var reader = new FileReader();

reader.onload = function(event) {

var contents = event.target.result;

var a = new Image();

a.src = contents;

document.body.appendChild(a);

}

reader.readAsDataURL(e.data);

};

fs.readdir("skyland", function(err, files) {

if(err) {

throw err;

}

for(var i = 0; i < files.length; i++) {

fs.readFile('skyland/' + files[i], function(err, data) {

if(err) {

throw err;

}

o.write(encodeImgFrame(data));

});

}

});

function encodeImgFrame(buf) {

var s = [],

l = buf.length,

ret = [];

s.push((1 << 7) + 2);

if(l < 126) {

s.push(l);

} else if(l < 0x10000) {

s.push(126, (l&0xFF00) >> 8, l&0xFF);

} else {

s.push(127, 0, 0, 0, 0, (l&0xFF000000) >> 24, (l&0xFF0000) >> 16, (l&0xFF00) >> 8, l&0xFF);

}

return Buffer.concat([new Buffer(s), buf]);

}

if (navigator.getUserMedia) {

navigator.getUserMedia(

{ audio: true },

function (stream) {

var rec = new SRecorder(stream);

recorder = rec;

})

}

var SRecorder = function(stream) {

……

var context = new AudioContext();

var audioInput = context.createMediaStreamSource(stream);

var recorder = context.createScriptProcessor(4096, 1, 1);

……

}

audioInput.connect(recorder);

recorder.connect(context.destination);

recorder.onaudioprocess = function (e) {

audioData.input(e.inputBuffer.getChannelData(0));

}

var https = require('https');

var fs = require('fs');

var ws = require('ws');

var userMap = Object.create(null);

var options = {

key: fs.readFileSync('./privatekey.pem'),

cert: fs.readFileSync('./certificate.pem')

};

var server = https.createServer(options, function(req, res) {

res.writeHead({

'Content-Type' : 'text/html'

});

fs.readFile('./testaudio.html', function(err, data) {

if(err) {

return ;

}

res.end(data);

});

});

var wss = new ws.Server({server: server});

wss.on('connection', function(o) {

o.on('message', function(message) {

if(message.indexOf('user') === 0) {

var user = message.split(':')[1];

userMap[user] = o;

} else {

for(var u in userMap) {

userMap[u].send(message);

}

}

});

});

server.listen(8888);

var a = document.getElementById('a');

var b = document.getElementById('b');

var c = document.getElementById('c');

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;

var gRecorder = null;

var audio = document.querySelector('audio');

var door = false;

var ws = null;

b.onclick = function() {

if(a.value === '') {

alert('请输入用户名');

return false;

}

if(!navigator.getUserMedia) {

alert('抱歉您的设备无法语音聊天');

return false;

}

SRecorder.get(function (rec) {

gRecorder = rec;

});

ws = new WebSocket("wss://x.x.x.x:8888");

ws.onopen = function() {

console.log('握手成功');

ws.send('user:' + a.value);

};

ws.onmessage = function(e) {

receive(e.data);

};

document.onkeydown = function(e) {

if(e.keyCode === 65) {

if(!door) {

gRecorder.start();

door = true;

}

}

};

document.onkeyup = function(e) {

if(e.keyCode === 65) {

if(door) {

ws.send(gRecorder.getBlob());

gRecorder.clear();

gRecorder.stop();

door = false;

}

}

}

}

c.onclick = function() {

if(ws) {

ws.close();

}

}

var SRecorder = function(stream) {

config = {};

config.sampleBits = config.smapleBits || 8;

config.sampleRate = config.sampleRate || (44100 / 6);

var context = new AudioContext();

var audioInput = context.createMediaStreamSource(stream);

var recorder = context.createScriptProcessor(4096, 1, 1);

var audioData = {

size: 0 //录音文件长度

, buffer: [] //录音缓存

, inputSampleRate: context.sampleRate //输入采样率

, inputSampleBits: 16 //输入采样数位 8, 16

, outputSampleRate: config.sampleRate //输出采样率

, oututSampleBits: config.sampleBits //输出采样数位 8, 16

, 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;

}

, encodeWAV: 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(44 + dataLength);

var data = new DataView(buffer);

var channelCount = 1;//单声道

var offset = 0;

var writeString = function (str) {

for (var i = 0; i < str.length; i++) {

data.setUint8(offset + i, str.charCodeAt(i));

}

};

// 资源交换文件标识符

writeString('RIFF'); offset += 4;

// 下个地址开始到文件尾总字节数,即文件大小-8

data.setUint32(offset, 36 + dataLength, true); offset += 4;

// WAV文件标志

writeString('WAVE'); offset += 4;

// 波形格式标志

writeString('fmt '); offset += 4;

// 过滤字节,一般为 0x10 = 16

data.setUint32(offset, 16, true); offset += 4;

// 格式类别 (PCM形式采样数据)

data.setUint16(offset, 1, true); offset += 2;

// 通道数

data.setUint16(offset, channelCount, true); offset += 2;

// 采样率,每秒样本数,表示每个通道的播放速度

data.setUint32(offset, sampleRate, true); offset += 4;

// 波形数据传输率 (每秒平均字节数) 单声道×每秒数据位数×每样本数据位/8

data.setUint32(offset, channelCount * sampleRate * (sampleBits / 8), true); offset += 4;

// 快数据调整数 采样一次占用字节数 单声道×每样本的数据位数/8

data.setUint16(offset, channelCount * (sampleBits / 8), true); offset += 2;

// 每样本数据位数

data.setUint16(offset, sampleBits, true); offset += 2;

// 数据标识符

writeString('data'); offset += 4;

// 采样数据总数,即数据总大小-44

data.setUint32(offset, dataLength, true); offset += 4;

// 写入采样数据

if (sampleBits === 8) {

for (var i = 0; i < bytes.length; i++, offset++) {

var s = Math.max(-1, Math.min(1, bytes[i]));

var val = s < 0 ? s * 0x8000 : s * 0x7FFF;

val = parseInt(255 / (65535 / (val + 32768)));

data.setInt8(offset, val, true);

}

} else {

for (var i = 0; i < bytes.length; i++, offset += 2) {

var s = Math.max(-1, Math.min(1, bytes[i]));

data.setInt16(offset, s < 0 ? s * 0x8000 : s * 0x7FFF, true);

}

}

return new Blob([data], { type: 'audio/wav' });

}

};

this.start = function () {

audioInput.connect(recorder);

recorder.connect(context.destination);

}

this.stop = function () {

recorder.disconnect();

}

this.getBlob = function () {

return audioData.encodeWAV();

}

this.clear = function() {

audioData.clear();

}

recorder.onaudioprocess = function (e) {

audioData.input(e.inputBuffer.getChannelData(0));

}

};

SRecorder.get = function (callback) {

if (callback) {

if (navigator.getUserMedia) {

navigator.getUserMedia(

{ audio: true },

function (stream) {

var rec = new SRecorder(stream);

callback(rec);

})

}

}

}

function receive(e) {

audio.src = window.URL.createObjectURL(e);

}