3

I have developped a google chrome extension.

I am trying now to integrate webRTC feature inside:

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
console.log("step1");
navigator.getUserMedia({audio: true, video: true}, function(stream){
    console.log("step2");
    $('#myVideo').prop('src', URL.createObjectURL(stream));
    window.localStream = stream;
    console.log("step3");

  }, function(error){ 
    console.log(error);
 });

I got an error:

step1
NavigatorUserMediaError {constraintName: "", message: "", name: "InvalidStateError"}

Any idea ?

Do I need any special permission to use webrtc inside my extension ? and is it possible to access webrtc in a extension ?

regards

Here is the screenshot of what I call the "popup" (extension = popup + background) Pop up window = chrome extension

yarek
  • 11,278
  • 30
  • 120
  • 219
  • How do you current permissions look like? It needs "videoCapture" [according to this](https://developer.chrome.com/apps/declare_permissions). But the doc is for apps, perhaps they differ from extensions. – wpp Mar 21 '15 at 06:57
  • video capture and audio capture are ONLY for applications, not extensions: I have ALREADY tested that ! – yarek Mar 21 '15 at 07:24

1 Answers1

7

In order to use WebRTC or the speech recognition API in the background page of a Chrome extension, you need to open a page from your extension in a tab, (popup) window or iframe (within a tab) (if you use an iframe, don't forget to list the page in web_accessible_resources). In this page, invoke navigator.webkitGetUserMedia to trigger the permission prompt. After the user approves the permission, your extension (in particular the background page) can request access to the microphone / camera again, and the request will automatically be approved.

Whether silent approval after a one-time prompt is desirable is debated, and this is also the reason that audioCapture and videoCapture permissions cannot be used in extensions yet. The audioCapture and videoCapture permissions will become available in the future though, so I recommend putting these permissions in your manifest file if your extension needs it, even when the current versions of Chrome do not recognize the permission for extensions.

Rob W
  • 341,306
  • 83
  • 791
  • 678
  • Hi: I did that: the popup invokes navigator.webkitGetUserMedia and .. This does not help. I tried both: in popup and in background with no success. – yarek Mar 21 '15 at 21:20
  • 1
    @yarek Not the [browser action](https://developer.chrome.com/extensions/browserAction) / [page action](https://developer.chrome.com/extensions/pageAction) popup, but a popup **window**. Like one that's created using `window.open` / `chrome.tabs.create` / `chrome.windows.create`. – Rob W Mar 21 '15 at 22:22
  • You mean a popup outside the plugin ? Not inside the plugin itself ? I success did it inside the options page. But is there a mean to do that inside the plugin popup inside ? – yarek Mar 22 '15 at 08:45
  • @yarek If by "popup", you mean one of the popups I referred to in my previous comment, then not directly. You can use [`chrome.tabs.executeScript`](https://developer.chrome.com/extensions/tabs#method-executeScript) to insert an iframe containing your a page from your extension (`yourframe.src = chrome.runtime.getURL('page.html');`) in the current tab that requests the access in order to see a permission request. – Rob W Mar 22 '15 at 09:41
  • I edited the question and have included a screenshot of what I call the popup (the content of the extension) – yarek Mar 22 '15 at 13:27
  • @yarek That's exactly what I was referring to (that's a browser action popup). Use `chrome.tabs.executeScript` as I said, or `chrome.tabs.create` if you cannot execute a script in the current tab. – Rob W Mar 22 '15 at 13:44
  • ok sorry I still don't understand (probably because I am french): So If I understand well, I cannot ask the authorization to webcam from the browser action popup, but I need to open a new tab (like the options tabs) and then I can grant the access to webcam: Am I right ? – yarek Mar 22 '15 at 13:54
  • 2
    @yarek Yes, or insert a frame that requests access to the web cam/mic. You only need to do this once, after that, any requests from your popup or background page will automatically be approved. – Rob W Mar 22 '15 at 13:55
  • by inserting a frame, you mean: I can insert a frame INSIDE the browser action popup ? That would be great ! If yes, this frame source must be external (http://) or local (included within the extension) ? – yarek Mar 22 '15 at 14:08
  • 2
    @yarek No, inside the current tab. The crucial parts of this idea are 1) the getUserMedia request has to originate from a (sub)frame within a tab (otherwise the permission bar/bubble won't appear) and 2) the permission request needs to be triggered from your chrome-`extension://[extensionid]` URL (because permissions are stored per origin). – Rob W Mar 22 '15 at 15:23