For a WebRTC stream, how can I get the devices that streams it?
For each stream there's getAudio/VideoTracks() and for each track there's getCapabilities().deviceId, but getCapabilities() doesn't seem to be implemented.
I tested in Firefox and Chrome.
You are right, getCapabilities has not been implemented yet.
In the meantime use track.label and track.kind and compare it against the device label and kind you get from enumerateDevices. Works in Chrome and Firefox 46 (Firefox Developer Edition).
Related
I want to know how to identify webrtc decoding type of safari browser？For example, H264, H265 etc...
Chrome has a webrtc tool "chrome://webrtc-internals/", while it didn't work in Safari. I also add debug menu to Safari, while I still can't run the webrtc log. Is there any solution to know the webrtc decoder of Safari browser on Mac and ios?
chrome's webrtc-internals page uses the RTCPeerConncetion.getStats() API and provides (roughly) the same data. You can get the codecId
https://w3c.github.io/webrtc-stats/#dom-rtcrtpstreamstats-codecid
from the inbound-rtp statistics and then look up the codec statistics in the getStats result.
https://webrtc.github.io/samples/src/content/peerconnection/change-codecs/ shows a sample for the outbound codec.
I am trying to use mediaRecorder API and make it run on maximum of browsers
video/webm;codecs=vp8,opus : that works fine on chrome and Firefox.. but not on Safari
video/mp4;codecs:h264 : works on Safari and Chrome.. but not on Firefox
It looks like Safari is now able to play webm.
What would be the mime type to use to make it run on both 3 browsers ?
I've been attempting the same thing and it is painful to say the least.
I'm able to use MediaRecorder to record video across Chrome, Firefox, Edge, and Safari. BUT the resulting videos do not playback on all browsers.
Safari - records in mp4 and mp4 will playback on all browsers
Chrome & Edge - I'm recording with mimeType: "video/webm;codecs=vp9", which will playback on Chrome, Firefox, and Edge, but not Safari.
Firefox - I'm using the default. It will playback on Chrome, Firefox, and Edge, but not Safari.
Supposedly Safari will playback webm with macOS Big Sur 11.3. I need to upgrade to test this.
Unfortunately webm is still not supported by iOS, so I'm looking into the Cloudconvert API to convert webm videos to mp4 before storing in S3.
Other suggestions welcome.
You'll need to use the MediaRecorder.isMediaTypeSupported API to find out what the browser you are using supports. See this open PR for details.
That does not help with playback however.
You've stumbled into an electropolitical food fight.
Sad to say, there's no commonality of codecs between browsers. You won't be able to find a common codec. Apple (Safari) is firmly in the H.264 / AAC world, the world of MP4.
Chrome, but not open-source Chromium, supports H.264 (which carries a patent burden). The fully open source Chromium browser does not. Firefox, via an automatically installed plugin from OpenH264.org, does, but it only supports H.264's constrained baseline version, not the fancier versions. Use MIME type video/webm; codecs="avc1.42E01F" and you'll be fine in Firefox and Chrome.
Microsoft new Edge supports the same stuff as Chrome.
WebRTC is rigged to allow endpoints to negotiate codecs with each other. In my opinion this is a kludgey way to patch this electropolitical squabble.
This is not a good situation. But it's Q1CY2021 reality.
as a simple answer that I found since it's not simply out there. Use a library like below to record in mp3. It's not supported by browser MediaRecorder natively, but libraries make it easy to encode to mp3
and then you have a blob or file that can be played in any browser and even mobile devices like ios
https://github.com/closeio/mic-recorder-to-mp3
I am trying to make an online examination portal. When students start the exam, their webcam will start automatically and record the stream live and store in the server. Invigilators will either watch the students live or they can watch the saved live streams later.
I researched about this and found WebRTC as a possible solution along with a gateway server like Kurento. But later found out that WebRTC is not supported in Safari, which is a setback! My application should run successfully in web portal in any modern browsers which includes safari and also in android or iphone.
So can anyone suggest a possible solution to my problem? Which technology should I use that can support all browsers and OS?
Also, it would be helpful if you can provide links to good documentation or tutorials.
Note from the future (2020): This answer really isn't accurate anymore.
WebRTC is one problem... capture from the camera with getUserMedia is another. Safari doesn't support either.
There is no video capture API in Safari currently. The only thing you can do is make a native app for iOS.
Worse yet, because of Apple's restrictive policies, alternative browsers, such as Chrome, are crippled on iOS as they aren't allowed to use their own browser engines.
Use standards based technologies like getUserMedia and WebRTC for your primary web-based application. If you decide that the economics of your situation enable it, you can make an iOS app to work alongside until Apple decides to participate in modern browser standards like everyone else.
You can use Mediadevices.getUserMedia (https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia) to capture webcam stream on browser (chrome and firefox).
To play with webcam stream on safari, you would have to use a pollyfill - https://github.com/Temasys/AdapterJS
To record the video/audio stream, you can make use of Media recorder api https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder (Note : recording stream is still a challenge in Safari as there is no support/pollyfill. However, it works perfectly on Chrome and Firefox latest versions).
Helpful demonstrations :
https://webrtc.github.io/samples/
https://mozdevs.github.io/MediaRecorder-examples/index.html
https://codepen.io/collection/XjkNbN/
https://hacks.mozilla.org/2016/04/record-almost-everything-in-the-browser-with-mediarecorder/
I am trying to setup up video calling in my webapp using Sinch. The application works well on my Chrome (50.0.2661.102 64 bit) but a friend using windows (same version chrome but 32 bit) gets a NavigatorUserMediaError with a reason : DevicesNotFoundError.
I tried using mozilla, vivaldi and IE but non of them works. The error is in the sinch.min.js file and I am using the latest version from their repository : https://cdn.sinch.com/latest/sinch.min.js
Can someone please help me fix these issues?
Also, are there any javascript libraries to help prevent cross-browser compatibility issues while using webRTC.
Thanks
Only WebRTC browsers work with sinch
The NavigatorUserMediaError error with err.name=DevicesNotFoundError is a Chrome specific error and it's quite common. It happens when:
you’re requesting a video track through constraints but the user does not have a webcam
you request an audio track but there is no attached recording device or it's disabled at the OS level (possible in Windows and some drivers do it automatically if there's no microphone inserted in the mic jack)
DevicesNotFoundError will be replaced by the spec compliant NotFoundError in Chrome 64.
Source: Common getUserMedia() Errors
I want to let WebRTC encoded and play h264(NAL) stream(local file).
In the WebRTC tutorial, getUserMedia is use for get local camera connecting to the system, I don`t know if the getUserMedia function support
capture the local stream file like h264 stream.
If it doesn't work that way, may be I should modify WebRTC source code(I'm studying it).
Here is the question, If i change WebRTC code, how can i integration the new code into browser? Made it a plugin?
Firefox supports an extension to the <video> element that you can use to do this.
First, set the source of a video element:
v1.src = "file:///...";
Then you can call the (currently prefixed) mozCaptureStream or mozCaptureStreamUntilEnded function to get a MediaStream.
stream = v1.mozCaptureStream();
The proposed specification.
Note however that you need to ensure that the file is same origin with respect to the page. The same origin rules for file:/// are probably going to cause issues. Otherwise your MediaStream isn't going to be accessible to you. One way to ensure that is not to set the location directly, but to load the file using an <input type="file"> element.
As noted in other answers, Firefox currently only supports the baseline profile of H.264.
First, you are right getusermedia will not work for you. However, there are a couple of options.
Hack a stream together using RTCDataChannel. Breaking up the media stream and delivering each packet and then handling it on the client side.
Take a look at this demo for precorded media streams. I do not believe that H264 is addressed but it could help you on your way(probably for Firefox only)
Use some sort of webrtc breaker/endpoint that is native to stream the file. I know specifically that others(including myself) have streamed H264 to Firefox through the Janus-Gateway
Couple of asides:
Firefox only supports Baseline profiles in streaming h264 for a webrtc peerconnection
Chrome does not support h264 for webrtc at all
Are you trying to have getUserMedia return a h.264 encoded stream?
In which case, today it will only be possible with Firefox today, under some specific environment (cisco 264 plugin installed) and only for the base profile.
Chrome promised in november to add this capacity, but there is no timeline that I know of Expect at least Q2 2015.
Using our (temasys) commercial plugin you will soon be able to do that in IE and Safari.
Those are the only options on client side I can think of. On server side you can use whatever you want to transcode, including janus, kurento, powermedia, licode/lynkia, ....
Note: using other means like Datachannel or WebSocket are ok to transfer files, but would greatly reduce the user experience as you would not have all the added recovery (and security) mechanisms included in SRTP, DTLS, and would also not have specific mistreated media enhancements that are in webRTC like jitter, buffers, netQ, ect ...