Implementing WebRTC on WebView with Codename One - codenameone

I'm developing an app which I need to include WebRTC using the WebView of Android. According to this article: [https://developer.chrome.com/multidevice/webview/overview] it is fully supported since WebView v36. (I'm testing on an Android 5.1.1 / Chrome 54 / Mobile Safari 537.36. And I confirm that it works on the standalone Chrome browser).
As of now, viewing of WebRTC works.
However, broadcasting (capturing video from the camera and sending it to the server) does not work. Note: it works on the standalone Chrome on the same Android.
I've included all these permissions in the codenameone_settings.properties file:
android.xpermissions=<uses-permission android:name="android.permission.CAMERA" android:required="true"/>\
<uses-permission android:name="android.permission.RECORD_AUDIO" android:required="true" />\
<uses-permission android:name="android.permission.INTERNET" android:required="true" />\
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" android:required="true" />\
<uses-permission android:name="android.permission.CAMERA" android:required="true" />\
<uses-feature android:name="android.hardware.audio.low_latency" android:required="true" />\
<uses-feature android:name="android.hardware.audio.pro" android:required="true" />\
<uses-feature android:name="android.hardware.microphone" android:required="true"/>\
<uses-feature android:name="android.hardware.camera" android:required="true" />\
<uses-feature android:name="android.hardware.camera.autofocus" android:required="true"/>\
<uses-feature android:name="android.hardware.camera" android:required="true" />\
<uses-feature android:name="android.hardware.camera.front" android:required="true" />
Is this the way to activate all the necessary Android permissions.
What do you think is causing the WebRTC not to function properly?
The WebView is called by the BrowserComponent class.
I understand that Android code is translated to native code and I believe that there is a way to make it work. Thanks!

I just took a look at a couple of examples (here and here, and it looks like the webview needs to grant some permissions in order to allow webrtc to work.
I have made a small change to our Android port that should allow you to grant these permissions. You just need to specify the origin in which permissions should be allowed. You would do this by setting the "android.WebView.grantPermissionsFrom" display property to the URL (or space delimited URLs) that you want to grant the permissions on.
e.g.
Display.getInstance().setProperty(
"android.WebView.grantPermissionsFrom",
"https://www.example.com/"
);
Call this in your app's init() or start() method.
NOTE These changes won't be available until the next server update. I'm not sure exactly when that will be since the bootcamp is underway right now. Usually it is every Friday, but it may be delayed until the first week of May due to the bootcamp.

Related

Cant get REST API requests to work on deployment device with react native

On my emulator I can use get/post requests and everything work fine.
but when I deploy it and try on my android phone - seems like nothing happens.
My manifest contains:
<uses-permission android:name="android.permission.INTERNET" />
..
<application..
android:networkSecurityConfig="#xml/network_security_config"
>
<uses-library android:name="org.apache.http.legacy" android:required="false"/>
the xml file under res folder:
<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
<domain-config cleartextTrafficPermitted="true">
<!-- For React Native Hot-reloading system -->
<!-- If you are running on a device insert your computer IP -->
<domain includeSubdomains="true">localhost</domain>
<domain includeSubdomains="true">mydomain.herokuapp.com</domain>
<trust-anchors>
<certificates src="system" />
<certificates src="user" />
</trust-anchors>
</domain-config>
<base-config cleartextTrafficPermitted="false" />
</network-security-config>
I looked everywhere but cant get it worked.
I have to mention that before trying to make the login authentication I did apply post/get calls and they worked fine. but theres something with the login.
it is working on my emulator.
Please if you have any clue or can assist it would be life saving!
(I have white list all IP's in mongodb so theres no problem there).
*I tried with Axios and other request methods non of them worked on the device.
is it because Im trying to run the app-debug.apk? or it has nothing to that
what am I missing?
I think you have built your apk in debug mode. Try build it in release mode.
How to Generate a React Native Release Build APK for Android

Phone + Angular + Facebook

I am creating an angular app, that will later be compiled on phonegap for android and ios. i have tried numerous plugins to integrate into facebook (mainly for login and sharing to facebook) on development - in the chrome browser while running on phonegap server, this works well.
I am able to click and share or have the pop up screen for permissions come up. however when i compile the the code and run it on a device it no longer works. i am suspecting this is because the the app does not have access to the device browser? or does not allow pop up in app? How can i resolve this problem? is cordova inapp the only way?
The updated cordova version doesn't allow the app to make any request outside the app. You need to follow the instructions in order to make it work.
Add the "Cordova Whitelist Plugin" in your config.xml
<gap:plugin name="cordova-plugin-whitelist" spec="1.1.0" />
Or simply
<plugin name="cordova-plugin-whitelist" spec="1.1.0" />
Try putting the following in your config.xml
<content src="index.html" />
is the path to your HTML file inside the source directory.
<access origin="*" />
will allow you to make a request anywhere from your app.
At the end, put the following intents
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
It will solve your problem. Give it a try and let me know!

How to add Google or Bing map on AngularJS-WinJS Windows Phone App?

I'm developing a Windows Phone 8.1 app using WinJs 2.1 and AngularJS 1.4. It worked fine until I needed to add either Google or Bing maps. I tried the following example but I got the following error.
Network request to https://maps.googleapis.com/maps/api/js?sensor=false&libraries=visualization did not succeed.
Your application manifest does not declare the following capabilities: internetClient privateNetworkClientServer
http://www.creepyed.com/2012/11/how-to-use-the-google-maps-api-on-windows-8/
Does anyone gone through the same issue or used something I missed to get this done?
I have added the following lines in my manifest
<ApplicationContentUriRules>
<Rule Type="include" Match="https://maps.googleapis.com/maps/api/js*" />
<Rule Type="include" Match="https://www.google.com/" />
<Rule Type="include" Match="https://earthquake.usgs.gov/" />
<Rule Type="include" Match="https://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx"/>
</ApplicationContentUriRules>
</Application>
</Applications>
<Capabilities>
<Capability Name="internetClientServer" />
<Capability Name="internetClient" />
<Capability Name="privateNetworkClientServer" />
<DeviceCapability Name="location" />
</Capabilities>
Thanks!

Is it possible to get a list of all image files from gallery (Android & iOS) using AIR

I'm working on a project for Android & iOS, using Adobe AIR.
The idea is to have one component which is basically a list populated with thumbnails of all images existing in Gallery app on mobile (Android & iOS).
Is there some solution for this? Is there a way to get a listing of all image files inside a Gallery?
I would not like to use "cameraRoll.browseForImage();" cause I don't want any popups.
Thank you!
I'm pretty new to iOS development using AIR, but it seems you might have to use a native extension to do your task. Some searching through up https://github.com/freshplanet/ANE-ImagePicker as a possible contender.
for android, edit your xml file to something like this
<android>
<manifestAdditions>
<![CDATA[<manifest>
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.READ_PHONE_STATE"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.WAKE_LOCK"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.VIBRATE"/>
<uses-permission android:name="android.permission.READ_CONTACTS"/>
<uses-feature android:name="android.hardware.camera" android:required="false"/>
<uses-feature android:name="android.hardware.camera.autofocus" android:required="false"/>
<uses-feature android:name="android.hardware.camera.flash" android:required="false"/>
<application>
<activity android:name="com.freshplanet.ane.AirImagePicker.AirImagePickerActivity" android:configChanges="orientation|keyboard|keyboardHidden|screenSize|screenLayout|fontScale" />
</application>
</manifest>]]>
</manifestAdditions>
</android>
and use this ane http://robotdev.co.uk/files/AirImagePicker.zip

how to run gwt gae app on every browser?

how is it possible to run a gwt app on all browsers?
when i put in my app_name.gwt.xml
<set-property name="user.agent" value="gecko1_8" />
the app runs only on firefox
if i put
<set-property name="user.agent" value="safari" />
it runs on google chrome.
if i put
<set-property name="user.agent" value="safari" />
<set-property name="user.agent" value="gecko1_8" />
he takes the last value so the app runs only on firefox.
i have tried things like this
<set-property name="user.agent" value="gecko1_8, safari" />
or
<set-property name="user.agent" value="safari" value="gecko1_8"/>
but nothing works.
what to do that the gwt app runs on every browser?
Just delete the set-property tag or comment it out:
<!--set-property name="user.agent" value="gecko1_8" /-->
Then the compiler will build all possible permutations (# of languages x 6).

Resources