如何在JavaScript
问题描述:
我写简单的JavaScript类中使用浏览器 的AudioRecorder功能我有内部initAudio范围变量mediaRecorder功能范围之外访问变量,我想访问它 内的另一个功能的startRecording如何在JavaScript
我怎么能做它?
navigator.getUserMedia = (navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia);
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var analyser = audioCtx.createAnalyser();
var scriptProcessor = audioCtx.createScriptProcessor(2048, 1, 1);
var chunks = [ ], input = null;
var mediaRecorder;
analyser.smoothingTimeConstant = 0.3;
analyser.fftSize = 1024;
var AudioRecorder = function(element) {
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia({ audio: true }, function(stream) {
initAudio(stream);
}, function(err) {
console.log('usermedia error', err);
});
var initAudio = function(stream) {
input = audioCtx.createMediaStreamSource(stream);
mediaRecorder = new MediaRecorder(stream);
mediaRecorder.ondataavailable = function(e) {
chunks.push(e.data);
};
mediaRecorder.onstop = function(e) {
console.log("data available after MediaRecorder.stop() called.");
var blob = new Blob(chunks, { 'type': 'audio/ogg; codecs=opus' });
chunks = [ ];
var audioURL = window.URL.createObjectURL(blob);
document.getElementById('blo').href = audioURL;
console.log(audioURL);
};
};
this.startRecording = function() {
console.log(mediaRecorder);
mediaRecorder.start();
console.log(mediaRecorder.state);
console.log("recorder started");
this.isRecording = true;
};
this.stopRecording = function() {
mediaRecorder.stop();
console.log(mediaRecorder.state);
console.log("recorder stopped");
};
};
var element = document.getElementById('mediaPlayer');
var record = new AudioRecorder(element);
record.startRecording();
答
我检查了你的代码,这看起来没问题。
麻烦不是范围变量问题。我认为你的init()函数不会被执行,因为不存在流向网页的流。
我做了一些修改来解释这一点。
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var analyser = audioCtx.createAnalyser();
var scriptProcessor = audioCtx.createScriptProcessor(2048, 1, 1);
var chunks = [ ], input = null;
var mediaRecorder = null;
analyser.smoothingTimeConstant = 0.3;
analyser.fftSize = 1024;
var AudioRecorder = function(element) {
/***navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia({ audio: true }, function(stream) {
initAudio(stream);
}, function(err) {
console.log('usermedia error', err);
});***/
// First get User Media
var md = navigator.mediaDevices.getUserMedia({ video: true, audio: true });
md.then(function(mediaStream) {
console.log('Media function');
this.initAudio(stream);
});
md.catch(function(err) { console.log('usermedia error', err); }); // always check for errors at the end
var initAudio = function(stream) {
input = audioCtx.createMediaStreamSource(stream);
mediaRecorder = new MediaRecorder(stream);
mediaRecorder.ondataavailable = function(e) {
chunks.push(e.data);
};
mediaRecorder.onstop = function(e) {
console.log("data available after MediaRecorder.stop() called.");
var blob = new Blob(chunks, { 'type': 'audio/ogg; codecs=opus' });
chunks = [ ];
var audioURL = window.URL.createObjectURL(blob);
document.getElementById('blo').href = audioURL;
console.log(audioURL);
};
};
this.startRecording = function() {
console.log(mediaRecorder);
mediaRecorder.start();
console.log(mediaRecorder.state);
console.log("recorder started");
this.isRecording = true;
};
this.stopRecording = function() {
mediaRecorder.stop();
console.log(mediaRecorder.state);
console.log("recorder stopped");
};
};
var element = document.getElementById('mediaPlayer');
var record = new AudioRecorder(element);
record.startRecording();
此引用可以对你有用:
答
就是这样。
function foo() {
...
return {
startRecording: function() { ... },
stopRecording: function() { ... }
}
}
+0
我重写了我的问题,请尝试回答 –
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/类 – Slime
我在录音的特殊情况下遇到问题@AmericanSlime –
https://scotch.io/bar-talk/4-javascript-design-patterns-you-should-know – mhodges