Twilio in chrome extension - user denied access to microphone

Question

I am new to chrome extension. Is there a possibility of providing a microphone access permission to chrome extension by manual (javascript) or using manifest configurations.

I have included twilio successfully by downloading the twilio.js and changed the protocol to "https" for using in background.html of chrome extension.

Manifest.js fields are follows :

 "permissions":["http://*/*", "https://*/*", "*://mail.google.com/*", "storage", "unlimitedStorage", "contextMenus", "cookies", "tabs", "notifications", "activeTab", "background","identity", "*://*.twilio.com/*"],

"content_security_policy": "script-src 'self' 'unsafe-eval' https://apis.google.com https://*.twilio.com; object-src 'self' https://*.twilio.com",

Now,when extension made/receive a call using twilio and accepts the connection. It throws error from Twilio.Device.error method as follows

   error.message is **User denied access to microphone**.

Could anyone please help me to resolve this error ?

Answer 1

I have found an work-around way to enable twilio in the chrome extension's background page.

First time, when we install the extension into chrome app. Just create a new tab with dummy html from the extension directory as below code snippet and make a test call.

    chrome.tabs.create({'url': chrome.extension.getURL('/telephony.html')}, function(tab) {
        console.debug("Telephony Tab details are - ",tab);
    });

It will prompt the user for microphone access and provide allow permission. Once call connected, send a message to background page and setup the Twilio in background. Form the next time you can able to receive the calls in the background.

Answer 2

I'm a developer evangelist for Twilio.

I haven't tried anything in Chrome extensions with Twilio Client just yet, but I took a look at the permissions. It looks to me like you need to include the audioCapture permission in order to get access to the microphone via getUserMedia , which is what Client uses.

I was looking up the available permissions here: https://developer.chrome.com/apps/declare_permissions

I hope that helps, let me know if I can help any further.

UPDATE:

As discussed, that is the page for Chrome packaged apps, not extensions.

The top answer to this question suggests making a call to getUserMedia in an options page for the extension. Otherwise, there is a bug on Chrome open to add these permissions to extensions .

Answer 3

finally I successfully use microphone with Chrome extension in a tricky way and with some error message but the Twilio functions still work(callout & recieve call).

Here is my experience, due to the Twilio js library will load external library which chrome extension not allowed, so I download the two library manually

1. Twilio.js from https://static.twilio.com/libs/twiliojs/1.2/twilio.js
2. second lib from https://static.twilio.com/libs/twiliojs/refs/3716fe1/twilio.js (I named it as twilio-lib.js)

save these two js file to your project and load it in manifest by contentscript:

"content_scripts": [
    {
      ****
      "js": [...,"lib/twilio.js","lib/twilio-lib.js",...],
      ***
    }
  ],

then edit the first twilio.js; comment the line62, line66 which intend to load a lib(the second, twilio-lib.js, we already include it, so it's useless)

then you can use Twilio.Device object in chrome extension, it will show many .mp3 not found message but doesn't block you use Twilio client functions

and I also try to load the js in background page, but the microphone always shutdown even I get the permission.