In this post, I would like to share some useful tutorial which you cant find it anywhere. Now a days all  web based application requires video and audio chat capabilities for real time communications.

WebRTC is an open framework for the web that enables Real Time Communications in the browser. It includes the fundamental building blocks for high-quality communications on the web, such as network, audio and video components used in voice and video chat applications.

These components, when implemented in a browser, can be accessed through a JavaScript API, enabling developers to easily implement their own RTC web app.

So before delivering real time communication to the user, we need to identify the user’s system components whether it supports WebRTC or not.

This tutorial is very useful to check system requirements in client side

 

webrtc - Detect System Components using Javascript

Below script is used to get all the datas required to implement real time communications like video chat, audio chat, white board interactions etc

Step 1:

Place the below javascript in the bottom of the page (above </body> tag)

<script src="https://cdn.webrtc-experiment.com/DetectRTC.js"> </script>

Step 2:

Use the below functions to get the required data

    DetectRTC.hasWebcam (has webcam device!)
    DetectRTC.hasMicrophone (has microphone device!)
    DetectRTC.hasSpeakers (has speakers!)
    DetectRTC.isAudioContextSupported
    DetectRTC.isWebRTCSupported

    DetectRTC.isMobileDevice

    DetectRTC.isWebsiteHasWebcamPermissions       
    DetectRTC.isWebsiteHasMicrophonePermissions 

    DetectRTC.audioInputDevices    // microphones
    DetectRTC.audioOutputDevices   // speakers
    DetectRTC.videoInputDevices    // cameras

    DetectRTC.osName
    DetectRTC.osVersion

    DetectRTC.browser.name === 'Edge' || 'Chrome' || 'Firefox'
    DetectRTC.browser.version
    DetectRTC.browser.isChrome
    DetectRTC.browser.isFirefox
    DetectRTC.browser.isOpera
    DetectRTC.browser.isIE
    DetectRTC.browser.isSafari
    DetectRTC.browser.isEdge

    DetectRTC.browser.isPrivateBrowsing // incognito or private modes

    DetectRTC.isCanvasSupportsStreamCapturing
    DetectRTC.isVideoSupportsStreamCapturing

I hope you like this article and Please like us in facebook or subscribe to my blog to get the latest updates

View Live Demo Download

 

This tutorial is very useful to check system requirements in client side

 

Credit – https://www.webrtc-experiment.com/DetectRTC

If you enjoyed this article, Get email updates (It’s Free)

How to detect Browser, OS, Screen Resolution, Speakers, Microphone & Webcam using Javascripthttp://w3lessons.info/wp-content/uploads/2017/03/webrtc.pnghttp://w3lessons.info/wp-content/uploads/2017/03/webrtc-150x150.pngKarthikeyan KFreebiesAPI,javascript,new techniques,system components,WebRTC
In this post, I would like to share some useful tutorial which you cant find it anywhere. Now a days all  web based application requires video and audio chat capabilities for real time communications.WebRTC is an open framework for the web that enables Real Time Communications in the browser....