博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML WebRTC只摄像头和麦克风的调用
阅读量:6772 次
发布时间:2019-06-26

本文共 5068 字,大约阅读时间需要 16 分钟。

hot3.png

main.js

/* *  Copyright (c) 2014 The WebRTC project authors. All Rights Reserved. * *  Use of this source code is governed by a BSD-style license *  that can be found in the LICENSE file in the root of the source *  tree. */'use strict';var instantMeter = document.querySelector('#instant meter');var slowMeter = document.querySelector('#slow meter');var clipMeter = document.querySelector('#clip meter');var instantValueDisplay = document.querySelector('#instant .value');var slowValueDisplay = document.querySelector('#slow .value');var clipValueDisplay = document.querySelector('#clip .value');var videoElement = document.querySelector('video');var audioSelect = document.querySelector('select#audioSource');var videoSelect = document.querySelector('select#videoSource');navigator.getUserMedia = navigator.getUserMedia ||                         navigator.webkitGetUserMedia ||                          navigator.mozGetUserMedia;try {  window.AudioContext = window.AudioContext || window.webkitAudioContext;  window.audioContext = new AudioContext();} catch (e) {  alert('Web Audio API not supported.');}function gotSources(sourceInfos) {  for (var i = 0; i !== sourceInfos.length; ++i) {    var sourceInfo = sourceInfos[i];    var option = document.createElement('option');    option.value = sourceInfo.id;    if (sourceInfo.kind === 'audio') {      option.text = sourceInfo.label ||        'microphone ' + (audioSelect.length + 1);      audioSelect.appendChild(option);    } else if (sourceInfo.kind === 'video') {      option.text = sourceInfo.label || 'camera ' + (videoSelect.length + 1);      videoSelect.appendChild(option);    } else {      console.log('Some other kind of source: ', sourceInfo);    }  }}if (typeof MediaStreamTrack === 'undefined') {  alert('This browser does not support MediaStreamTrack.\n\nTry Chrome.');} else {  MediaStreamTrack.getSources(gotSources);}function successCallback(stream) {  var videoTracks = stream.getVideoTracks();  var audioTracks = stream.getAudioTracks();  if (audioTracks.length === 1 && videoTracks.length === 0) {    console.log('Got stream with constraints:', constraints);    console.log('Using audio device: ' + audioTracks[0].label);    stream.onended = function() {      console.log('Stream ended');    };  }  window.stream = stream; // make stream available to console  videoElement.src = window.URL.createObjectURL(stream);  var soundMeter = window.soundMeter = new SoundMeter(window.audioContext);  soundMeter.connectToSource(stream);  setInterval(function() {    instantMeter.value = instantValueDisplay.innerText =        soundMeter.instant.toFixed(2);    slowMeter.value = slowValueDisplay.innerText =        soundMeter.slow.toFixed(2);    clipMeter.value = clipValueDisplay.innerText =        soundMeter.clip;  }, 200);}function errorCallback(error) {  console.log('navigator.getUserMedia error: ', error);}function start() {  if (window.stream) {    videoElement.src = null;    window.stream.stop();  }  var audioSource = audioSelect.value;  var videoSource = videoSelect.value;  var constraints = {    audio: {      optional: [{        sourceId: audioSource      }]    },    video: {      optional: [{        sourceId: videoSource      }]    }  };  navigator.getUserMedia(constraints, successCallback, errorCallback);}audioSelect.onchange = start;videoSelect.onchange = start;start();

soundmeter.js--->音频显示

/* *  Copyright (c) 2014 The WebRTC project authors. All Rights Reserved. * *  Use of this source code is governed by a BSD-style license *  that can be found in the LICENSE file in the root of the source *  tree. */'use strict';// Meter class that generates a number correlated to audio volume.// The meter class itself displays nothing, but it makes the// instantaneous and time-decaying volumes available for inspection.// It also reports on the fraction of samples that were at or near// the top of the measurement range.function SoundMeter(context) {  this.context = context;  this.instant = 0.0;  this.slow = 0.0;  this.clip = 0.0;  this.script = context.createScriptProcessor(2048, 1, 1);  var that = this;  this.script.onaudioprocess = function(event) {    var input = event.inputBuffer.getChannelData(0);    var i;    var sum = 0.0;    var clipcount = 0;    for (i = 0; i < input.length; ++i) {      sum += input[i] * input[i];      if (Math.abs(input[i]) > 0.99) {        clipcount += 1;      }    }    that.instant = Math.sqrt(sum / input.length);    that.slow = 0.95 * that.slow + 0.05 * that.instant;    that.clip = clipcount / input.length;  };}SoundMeter.prototype.connectToSource = function(stream) {  console.log('SoundMeter connecting');  this.mic = this.context.createMediaStreamSource(stream);  this.mic.connect(this.script);  // necessary to make sample run, but should not be.  this.script.connect(this.context.destination);};SoundMeter.prototype.stop = function() {  this.mic.disconnect();  this.script.disconnect();};

---------------------------目前仍未完成本篇博客,后续会继续补充RTCPeerConnection方面的知识--------------------------------

转载于:https://my.oschina.net/ososchina/blog/410298

你可能感兴趣的文章