We are building a mobile barcode-scanner using QuaggaJS that reads barcodes directly from the device's camera stream. Works fine on desktop/Android, but doesn't work at all on iOS.
From initial research, I've found that iOS simply does not support WebRTC/getUserMedia through Safari or iOS Chrome (related links below), which is what QuaggaJS uses to read the camera stream.
I've also seen this question about capturing a still image on iOS, but the answer provided is only for capturing a still image, not for reading the stream real-time.
My question - is there any other way to grab the stream from an iOS camera? Perhaps an alternate library other than QuaggaJS that does not use getUserMedia? I am not well-versed in Javascript, so I am not sure if there even is a possible way to access the camera stream other than getUserMedia.
A "no" is an acceptable answer here; I'm simply looking for someone more experienced to provide guidance.
Appendix/related links:
navigator.getUserMedia alternative API for iOS safari mobile browser?
https://www.quora.com/Why-is-navigator-getUserMedia-not-supported-in-Safari
https://bloggeek.me/webrtc-apple-or-microsoft/
HTML5: getUserMedia iOS issue?
2017 update: Apple just announced that getUserMedia will finally be supported in iOS11.
Aug 2019 update: ONLY works in Safari, not in a WebView of any kind. Thanks #Klathmon for the comment.
The quaggaJS page has a feature compatibility matrix which answers your question:
getusermedia is not supported on iOS safari.
As per the quaggaJS documentation (https://github.com/serratus/quaggaJS#browser-support)
Quagga makes use of many modern Web-APIs which are not implemented by all browsers yet. There are two modes in which Quagga operates:
analyzing static images and
using a camera to decode the images from a live-stream. The latter requires the presence of the MediaDevices API. You can track the compatibility of the used Web-APIs for each mode:
Static Images
Live Stream
I would suggest that you use static image mode on iOS as live stream mode is not supported.
Related
I'm building an application in React in which I need to record the users' webcam video and audio. Thus far it works in Chrome and Firefox (as expected), but I'm currently trying to find a fallback or a polyfill for Edge and Safari, since I want to be able to support those browsers as well.
Have any been made available? I have not been able to find any information whatsoever in regards to this.
I am trying to build screensharing over the browser. I am trying to find the best native implementation and did some initial online research
MediaDevices.getUserMedia() - available in FF. In chrome its a little weird
WebRTC Tab Content Capture - I see its in proposal stage
Screensharing a browser tab in HTML5 - A blog explaining other methods
Researching above everything seems to be around 2012 time frame and I want to know what is the latest?
Question: Which current technologies/javascript API can i use and what is its support across browsers
Screensharing is alive and kicking in Firefox, but atm requires the user modifying about:config. See my answer to another question for how. I believe they're working on removing that obstacle.
Chrome is similar but not quite the same, and AFAIK requires the user to install an extension.
I don't believe other browsers support this natively yet.
You can save html document onto <canvas> or <foreignObject> of <svg> element, then send data URL, ArrayBuffer or Blob of <canvas> or <svg>; or alternatively, send html document as encoded string.
I want to stream some video file and i've found interesting the DASH adaptive streaming capabilities, but i'cant find anything else but "dash.js" (which seems to work only for Chrome browsers) to implement client-side playback (integrated with html5 "video" tag). I know that dash.js works with chrome's mediasource APIs, but -if i'm not wrong- they should be standardized by W3C. Firefox says that MSE APIs are already avaliable on the recent versions, but dashif.org example video doesn't work, while an alert says that i should retry with chrome. So, what can a poor student at first experience with web development do to adaptive-stream video with html5???
Indeed, Firefox supports the standardized Media Source Extensions, but you also need to confirm that the content you are trying to play is supported in terms of video and audio codecs.
You can find the supported codecs for Firefox here. So, the key for cross-browser compatibility is to use the audio and video codecs supported by all browsers.
Also, there is a much newer version of the DASH.js player currently available, perhaps you want to give it a try: DASH.js 1.1.2
You can test the MSE implementation of Firefox already with the developer version of Firefox 36/37. Please not that you have to enable it via about:config. Currently it is planned to release it in version 37, to the best of my knowledge. Also the nightly build allows MSE testing.
According to your player request, I can recommend the player from www.dash-player.com. I tested it already on IE 11 (Win 8), Safari 8, Firefox 36 and Chrome (Windows, Linux, Android) of course. They have also an automatic fallback solution using Flash. And, perfectly for students - it's free.
Im trying to develop an javascript based audio editor. It should be possible to record, play and edit an audio file with. Its especially important to visualize the recording audio (realtime) and the selected/uploaded audio file (both of them).
I red alot about the Web-Audio-API and saw a few examples as well, but there are some problems - it only works in chrome/safari so far, it should be run on firefox as well, but it doesnt. So what Im looking for is an crossbrowser API or javascript/jquery libary which provides the called features.
Here are some examples to show u what I mean:
http://plucked.de/ (great tool, but there are many bugs as well)
http://www.stud.fit.vutbr.cz/~xmyler00/audiee/ (as u can see web audio API doesnt work on firefox)
The Web-Audio-API is a fairly new standard and is steadily being adopted by the major browsers with varying levels of support. Currently Chrome and Safari have the best support and Firefox support is in it's draft stage. For the sort of application, with cross browser support, that you're wanting you will need to go to third party plugins/extensions/addons for the support you're after.
Welcome to the bleeding edge. :)
We need to capture voice in a web portal. Our contractor developed the whole web portal without using Java Applications, only client-side code, and claims there is no way to capture voice using JavaScript today.
I'm not a Java guy, so I don't have the skills to discuss this, but I'll appreciate any help our folks here in SO can give: if you guys say it can not be done with today technology, so be it...
PS: the solution MUST attend IE, Chrome, Firefox and Safari, for end users, so Canary is out of question for now.
Currently there's no way reliable way to record audio using only HTML5 and JavaScript across browsers.
The only cross browser solution for non Flash recording on desktop browsers in the foreseeable future is the Media Recorder API. It's a recent standard proposal for a JS API who's purpose is to make audio and video recording in the browser very simple. Today it works only in Firefox 27 and only for audio. This article covers the standard in more detail.
If audio recording is important for you today I recommend you check out proven flash solutions like FLVAR or Audior. They work on all browsers, they are reliable and supported. Flash just works and major sites like YouTube and Netflix continue to use it.
The javascript's getUserMedia (getUserMedia on MDN) is a simple way to do this. I suggest you addyosmani's polyfill that has a flash fallback in case the browser doesn't yet support it.