getUserMedia() broken in latest versions of ionic and crosswalk?


#1

I use getUserMedia() in my app, and it recently broke. When I try it using ionic serve in chrome it works great. When I load it to an android phone the function getUserMedia() exists, but when I call it I get back an error that is just an empty object. Note that this is different than permission errors, which I got when I first coded it, but figured out easily enough.

I reverted back to a git version where it worked for sure before, but it still fails in the same way. This leads me to think that it has to do with the versions of all the packages that aren’t controlled by git.

I even started a fresh project, loading only what I needed to get it to work. It works great in the browser using Ionic serve, but then when I load to my android phone, it again fails and gives no error. That environment is
Cordova CLI: 6.2.0
Gulp version: CLI version 3.9.0
Gulp local:
Ionic Framework Version: 1.3.1
Ionic CLI Version: 1.7.16
Ionic App Lib Version: 0.7.3
OS:
Node Version: v4.2.2

also, the plugins I have installed are:
cordova-plugin-console 1.0.3 "Console"
cordova-plugin-crosswalk-webview 1.8.0 "Crosswalk WebView Engine"
cordova-plugin-device 1.1.2 "Device"
cordova-plugin-splashscreen 3.2.2 "Splashscreen"
cordova-plugin-statusbar 2.1.3 "StatusBar"
cordova-plugin-whitelist 1.2.2 "Whitelist"
ionic-plugin-keyboard 2.2.1 “Keyboard”

I just pushed the sample app code, in case anyone is up for looking at it and telling me what I am doing wrong. https://github.com/scottmahr/test-getusermedia

I am pulling my hair out trying to figure this out, does anything have any suggestions of what could be wrong, or what to try next? I recently had some issues with ionic-deploy, which solved themselves after I updated ionic and cordova. I am wondering if that could have been what broke getUserMedia.

Thanks very much to anyone that has any ideas,

Scott


getUserMedia example for Android and IOS
#2

Hi,

I’m using getUserMedia in our Webrtc app and it works fine with the latest ionic and crosswalk version(beta), Its a long shot, but you could try updating crosswalk to version 13.42.319.6. you are currently using crosswalk version 12.41.296.5, the command to install a specific version of crosswalk is "ionic browser add crosswalk@version_number " . One more unlikely cause is your phone’s camera is not working properly which can easily be checked by opening the camera app and seeing if your front camera works.

Tip: if you change your crosswalk version, uninstall the previous apk and then install the new apk.

Best,
Akil.


#3

@akilud, thanks for the reply. I updated to the 13.42.319.6 version of crosswalk, after removing the old version, I still get the same issue.

When I add crosswalk, I get an error that about multiple dex files. I suspect this is from conflicting versions of android in different plugins I use. The answer in this stack overflow fixed it by adding
configurations { all*.exclude group: 'com.android.support', module: 'support-v4' }
to the build.gradle file.

I know my cameras work because I am able to do the webrtc demos from here and they work great.

Would there be any reason that this could cause issues?

Any other ideas of things to try next to get getUserMedia() to work?

Do you know of any ionic apps in the app store that use getUserMedia() that I could try, just to make sure my hardware is fine?

Thanks,

Scott


#4

If you open the device’s camera app and can see the front camera stream, then it is not a hardware issue, getUserMedia uses the front camera by default unless another camera is specified in the constraints.


#5

I have the exact same problem. After some research, I found this StackOverflow thread where they suggested to use pure Cordova. I tried using a previous, minimal Cordova project I had, using the exact same code form getUserMedia, and it worked perfectly.
I also am able to get WebRTC MediaStreams from elsewhere, just not use getUserMedia. Actually, getUserMedia does not generate any error, and gives an audio MediaTrack with readyState “live” and a video MediaTrack with readyState “ended”. Despite the fact the audio track is “live”, no audio is actually played.
I am checking permissions in the AndroidManifest.xml, but so far I have made no progress on that.


#6

I have a Android 6.0.1, I have to go into the settings for the application
and give it access to the camera. I thought that I had permission in the
manifest file, but it didn’t seem to grant it for me.

Scott


#7

Hey Scott, thank you for your answer! That was EXACTLY the issue! I solved it by giving the permissions in the app settings.
But the permissions should be given with the AndroidManifest.xml, right? Is that an issue with Ionic permission generation? And the fact that no errors are thrown is unsettling, but that’s likely an issue with WebRTC itself.


#8

I got a definitive solution for the issue. Turns out that in Android 6, the API level 23 requires that “dangerous” permissions such as CAMERA and RECORD_AUDIO need to be requested at runtime. So, in order to have the permissions you must set them in the config.xml or use a plugin like cordova-opentok-android-permissions, and ask for them at runtime with cordova.plugins.diagnostic. This way the users will not need to go to Settings and enable the permissions manually.


#9

@scottmahr @ghapereira nice find! I spent a while scratching my head about this one …

Gaetan Siry


#10

can you share me how did you implement webrtc in ionic?