I'm on a new project that requires to stream audio files (mp3) and record voice messages.. of course my first option was to use flash. But the problem is that the customer wants the website to be iPhone friendly.
Is there any technologie that allows me to play and record voice messages just with javascript/php/xhtml?
And of course, the website should be fully compatible with firefox, safari, internet explorer, etc.
I googled it and everything I found was flash-based.
but if you have any clue about it, please let me know.
No. Not even the new-ish HTML5 has any features to record audio. You'd need to go through Flash or Java - but that would rule out iPhone.
if you want to record sound you should do it with the new HTML5's api's, you can read more about it on
https://labs.ericsson.com/developer-community/blog/beyond-html5-audio-capture-web-browsers
However, this is theory, in reality no browsers support it and there is no way to do it. So in short: you cannot do what you ask.
What you could do is create an iPhone native app for those who want to use iPhone, and a flash website for those who want to access it with a regular browser.
Related
I was searching for some solution to record audio inside of the browser and send for a webservice. I have found some solutions, but they only work for Chrome or Firefox. So, I wanna know:
Is there someway to record audio in SAFARI?
PS: I don't wanna use the tag video
What you are looking for is the getUserMedia API from WebRTC to access the user's microphone without any plugins. You can check out what browsers currently support the webrtc functionalities here: http://iswebrtcreadyyet.com/
At the moment it is not ready for safari.
The best support for webrtc is given by google because they are pushing this standard a lot.
I'm trying to implement audio recording in a website. Basically the user should be able to press a button and speak something into the microphone. The recorded audio should then be sent to the server for further processing. I realise that you can do this with Flash, but for now I'm trying to avoid that.
I found several resources on the internet about it (i.e. link) but as it seems, this functionality is not widly supported yet. I experienced differences betweet the used browser and between the used operating system. For instance, the Chrome Browser doesn't seem to access any microphone on Linux correctly. So i was wondering if anyone knows a good resource to dive into this. Or maybe someone tried to set up something like this himself, and can help with some suggestions about where the limitations of HTML5 and the JavaScript Web Audio API are right now.
Thanks!
As of Chrome Version 27.0.1453.56 beta Mac, audio recording works with this demo application https://github.com/mattdiamond/Recorderjs
This app returns back a WAV file for the user which can be uploaded to the server.
If you want a truly robust solution that works on most desktop web browsers, you may need to resort to Flash.
This article covers up pretty well the current state of audio video capture possibilites using HTML5:
http://hdfvr.com/html5-video-recording
Also for just audio capture, here's a gitHub project that records audio to mp3 directly from the browser:
https://github.com/nusofthq/Recordmp3js
Question:
Is it possible, with some sort of technology, to integrate voice recording into a mobile web application?
Some background:
I have been working on a mobile web application just for my own enjoyment and research. Everything seemed to be working pretty slick with HTML5/CSS and JavaScript for the client application, although it looks like I need a third party technology for voice recording. I had a pretty good solution working with Flash, but after testing it with my IPhone, I had remembered that they don't seem to support flash which is disappointing because I had a pretty good solution going.
Voice Recording Requirements:
1. Must work with both iOS and Android.
2. Must work in most current versions of Firefox, Google Chrome, Internet Explorer, Opera, and Safari.
3. Must work within the framework of a mobile web application.
4. Must be able to record without being actively connected to the internet.
5. The client application shouldn't require the user to alter their phone OS.
I tried to be as specific as possible to assist in allowing you to answer this question accurately. If anything is unclear, just let me know in a comment below, and I will further clarify.
Check this http://www.html5rocks.com/en/tutorials/getusermedia/intro/
HTML Media Capture <input type="file">
Work for most of the mobile browsers, but it works not well because it will require native recording app and needs to active manually.
getUserMedia() and WebRTC
So far, only the Chromium support it well in mobile.
So, I gave up the web app. Hybrid app is the solution.
If you want to try the hybrid app for recording, you can check the Cordova Plugin https://github.com/emj365/cordova-plugin-audio-recorder-api that I created for recording task in the hybrid app.
It looks like in the years since asking this question a solution has surfaced. This solution has come in the form of MediaStreamConstraints dictionary audio property.
The Web API docs from Mozilla have a very nice example shown below:
document.getElementById("startButton").addEventListener("click", function() {
navigator.mediaDevices.getUserMedia({
audio: true
}).then(stream => audioElement.srcObject = stream)
.catch(err => log(err.name + ": " + err.message));
}, false);
Resources
https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamConstraints/audio
If you want to record it as an audio, I think you can only make it for Chrome dev, Chrome canary, Opera next, and some mobile browser.
Using the WebRTC getUserMedia() API then make the blob URL of the audio data URL to save it.
If you want to record it as text maybe you can use <input -x-webkit-speech/> for webkit browsers. Make an event that make every-time it stop recording it'll add the currently recorded speech to an element and start recording again. Finally, make a blob URL to save it as a text file.
I'd like to write a web version of Talking Tom, which would record what you say and play them again.
But I can't find api for record sound in browser.... is it possible?
I'd like to write a Chrome App, so no need to worry about other browsers.
FLASH has support for microphone - its about your only option as far as I know.
I'm building a simulator that runs in the browser and needs to be deployed to the iPad. I've run into an issue where I need to be able to play a .wav file on a button click.
I know that the ipad supports the HTML5 audio tag, but this application will run on PC's, Mac's and the iPad and all browsers do not support the HTML5 audio tag yet. So I really need a solution that will work on the ipad, as well as the desktop.
Thanks in advance for any help with this issue.
I know it's not best practice to play audio in web pages, but it's what the client ordered, and he's the one paying the bills.
The JavaScript would be:
var audio = new Audio("noise.mp3");
audio.play();
I've heard, however, that iOS devices (iPad, iPhone, iPod) disable autoplay and the JavaScript .play() method at start up and will only play a noise in response to a explicit user action.
Google "HTML5 audio" to find out more details (and there are lots of detail.)
<object type="audio/mpeg" data="muzak.mp3">Your browser doesn't seem to like MP3s</object>
that should fire up whatever plugin's registered for mpeg audio, or display the alternate text.
You're better off embedding an mp3, because support for that is very widespread. A .wav, by comparison, can be anything. Wav is a container format and can use any number of different codecs, most of which are probably NOT supported by your average pc/browser.