When I try to do the following:
var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
// now I try to invoke it with some parameters:
getUserMedia(...) // not working!
It throws an error "Illegal Invocation" in Chrome.
But if I do:
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
// now invoke it with the navigator
navigator.getUserMedia(..) // Works
I've tried searching a bit, and I read it's a context issue. But I still couldn't understand what's the meaning of that. In the first example, the getUserMedia variable ends up getting a reference to the function which is not undefiend (i.e, in case of chrome, it's webkitGetUserMedia), so why cannot I invoke it using this variable?
(This is actually a general JavaScript question, not specific to WebRTC.)
Apparently, it needs the context to be the
navigator
object, for whatever reason. I've noticed the same thing withconsole.log
- it needs theconsole
context.When you do
navigator.getUserMedia
, the context is automatically set tonavigator
, as with any other time you invoke a method on an object. If you just dogetUserMedia
though, the context (by default) is global, and so it throws an Illegal Invocation error.If you still want to save it as a variable, you can call it with the correct context at runtime:
You could also use
bind
to save the context with the variable, so that you don't have to call it each time: