CODEWITHSUNDEEP
javascriptgoogle-chrome
SirTophamHatt
SirTophamHatt

Reputation: 1581

Detecting Chrome Media Settings in Javascript

Chrome has recently released an update to its media settings which prompts a user to grant permission to a site allowing access to his/her microphone and camera. Is there a way to detect these settings in Javascript?

I have a flash player (which will eventually be HTML5 based) with microphone functionality. The player is currently set up with a friendly tutorial on how to grant permission before starting the session. However, since Chrome released the update, the flash player and Chrome permissions are conflicting causing an error in the flash until the user has allowed/denied the Chrome settings prompt. What I'd like to do, until the player is moved to HTML5, is detect if the browser is Chrome (with appropriate version) and if the user's settings aren't set to then show additional tutorial screen.

Upvotes: 3

Views: 2475

Answers (2)

Adam Rabung
Adam Rabung

Reputation: 5224

i stumbled into an approach for this that works fairly well, and doesn't require cookies (people can change these settings out-of-band, so the cookie can become incorrect), or for Chrome to provide an ounce of help (it doesn't).

if (chrome) {
  var madeMicDecision = false;
  navigator.getUserMedia({whatever}, 
    function(stream) { 
      madeMicDecision = true;
      //close the stream, move to the next page
      //they have either just granted permission, or have in the past and it's remembered
    },
    function(error) {
      madeMicDecision = true;
      //go to error handling page 
      //the error handling page should describe going to chrome://settings/contentExceptions#media-stream
      //or how to allow the user media via clicking on the crossed out camera icon in the 'wonderbar'
    }
}

But we also want to show the tutorial screen - the above code will pop the chrome infobox if the permission setting isn't remembered. But without permission events from chrome, or an API to query permissions, how do we know when to show the chrome+infobox tutorial content?

My trick was to show the content automatically, but only after a delay. People who have accepted or denied permissions previously would never see this content, because our success/error handler would have moved them on before the delay. So, give the getUserMedia call a moment to detect/react - if the browser hasn't moved on, it's time to show the help content.

setTimeout(function() { 
    if (!madeMicDescision) {
      //display chrome/infobox/getUserMedia permissions help content
    }
}, 2000);

Not perfect (bizarre and sad really), but seems to work for the most common cases.

Upvotes: 0

Ryan
Ryan

Reputation: 5682

Couple things:

  • This is specific to Chromes implementation so you can not tell what permissions the user has granted unless Chrome supplies that information to your app. I.E. there is no API you can query for this info.
  • It's not even something that Chrome stores. If you look under the advanced settings tab on this page, you will see that its on a per app basis not a one time thing. Chrome will only remember what permission was granted for a specific application if that app asks for the permission over https. If it asks for it over http then it will forget what permissions were granted.

Your best bet (though by no means full-proof) is to sniff out the browser agent and version. For one of the better implementations of this see here.

You will want to specifically look for Chrome and any version >= 21. (21 was the version that introduced the getMediaApi). Then it's a simple if check:

if (version >= 21){
    //ask permission though the getMediaApi 
} else{
    //ask permission though flash
}

Upvotes: 2

Related Questions