您的位置: 首页  >  技术问答  >  如何使用Javascript / PHP录制用户的声音？ [关闭]

如何使用Javascript / PHP录制用户的声音？ [关闭]

分类: 技术问答 • 2022-03-17 11:45:25

如何使用Javascript / PHP录制用户的声音？ [关闭]

问题描述：

I am currently trying to make a test site that allows users to record voice-notes and save it to their account. What is the best way to do this using either PHP or JavaScript?

The steps that I am looking to have for this process are:

1) User clicking the record button. 2) Initiation of the recording sequence. 3) Stopping the sequence. 4) Naming of the file and sending it over to the server.

My main query is focused on the 2nd step, where I'd need some mechanism that would interact with the user's mic to record the voice. I am still new to web dev per se and I do not know how I can invoke voice recording using JavaScript.

Upon searching in Google, I found some links in StackOverflow which addressed similar issues but the answers were not helpful. A lot of solutions pointed to Flash but I would like to avoid that as much as possible. So my question does boil down to "Is it possible to record voice using JavaScript? If yes, how?"

Thanks in advance.

我目前正在尝试创建一个允许用户录制语音备注并将其保存到其帐户的测试站点。 使用PHP或JavaScript执行此操作的最佳方法是什么？ p>

我希望此过程的步骤如下： p>

1 ）用户单击录制按钮。 2）启动录制序列。 strong> 3）停止序列。 4）命名文件并将其发送到服务器。 p>

我的主要查询主要集中在第二步 strong>，我需要一些机制与用户的麦克风进行交互以录制语音。 我仍然是Web开发人员的新手，我不知道如何使用JavaScript调用录音。 p>

在谷歌搜索时，我在StackOverflow中找到了一些解决类似问题的链接，但答案没有帮助。 许多解决方案都指向Flash，但我希望尽可能避免这种情况。 所以我的问题归结为“是否有可能使用JavaScript录制语音？如果是，怎么做？” p>

提前致谢。 p> div>

答

The HTML5 Audio API is not widely supported in browsers, I think it works in Chrome and Firefox has had it recently added to its nightlies... Browser prefixes are required at this stage but the general API is...

navigator.getUserMedia({audio: true}, function(stream) { /* do stuff */ });

So that would be webkitGetUserMedia for Chrome and mozGetUserMedia for Firefox.

Your more consistent options right now are via browser plugins such as Flash or Java or to create a desktop client that the user would need to install.

Resources of interest regarding getUserMedia:

The following question may assist you further:

tutorial on using flash or java servlet to upload microphone data from browser to server?

答

You are now able to record from a microphone by creating an audio graph that connects your local MediaStream to a ScriptProcessingNode:

navigator.webkitGetUserMedia({video: true, audio: true}, function(stream) {
    var audioContext = new webkitAudioContext,
        mediaStreamSource = context.createMediaStreamSource(stream),
        processor = context.createJavaScriptNode(4096, 2, 2);

    processor.onaudioprocess = function(e) {
        // Process the audio data found in e.inputBuffer
    };

    mediaStreamSource.connect(processor);
    processor.connect(context.destination);
});

(Using Chrome vendor prefixes)

You can hook this up to Websockets or even plain XHR to send the chunks to your server, which can process it into an audio file. You'll need to convert each channel from

non-interleaved IEEE 32-bit linear PCM with a nominal range of -1 -> +1

into the format of your choice.

A similar example of recording audio, encoding it into a wav file, and saving it (all client-side) can be found here:

https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC

More details on AudioContext:

http://docs.webplatform.org/wiki/apis/webaudio/AudioContext

答

Until HTML5 audio recording arrives, you really need to hobble together a solution that combines Flash and on mobile devices, file upload. On mobile devices the file upload screen usually has an audio or video recorder, so users can record direct from their device.

If the device doesn't have an audio recorder on the file upload, you should use the video recorder and then convert the video to MP3 on the server. That is how we do it over it at recordmp3online.com .

相关推荐