Using Cordova Plugin in Android - android

I'm using Cordova for create an App in Android and iOS, in iOS I did not have any problem, and the app is now in the App Store.
I have some questions for Android, because I am desperate...
I created the Project using cordova platform add android, and the project created fine. I can load and compile, and all works fine, except the plugins... I have added the plugins correctly and works fine in iOS using the command cordova plugins add org.cordova...
Can someone tell me how I need to use the plugins in Android? Do I need include any .js (of course Cordova.js is include, but I don't know how exactly is my project using it, like a charm...).
I just can see an error in LogCat that say:
error adding plugin org.apache.cordova.inappbrowse
The app works, but the alerts is showing the typical alert of a browser and the links is open inside my App, I use it with this code:
$('a[target=_blank]').on('click', function(e) {
e.preventDefault();
window.open($(this).attr('href'), '_system');
return false;
});
And for the notifications:
navigator.notification.alert("Hello!", null, "Title", "Close");
Can someone show me a way to solve the problem? An example?
Just for information... I have tried this very simple example (Link) in a new separate project and App and I have the some error... Maybe the error is in the Config.xml? How I need to use it for Android?
Thank you so much!!

Run it and watch console. If you get a "Refused to execute inline event handler" type message then add 'unsafe-inline' to your default source in the content security policy of your config.xml file.
<meta http-equiv="Content-Security-Policy" content="default-src 'self'
data: gap: https://ssl.gstatic.com 'unsafe-inline'
'unsafe-eval'; style-src 'self'; media-src *;">
Details on the policies are available at https://developer.chrome.com/extensions/contentSecurityPolicy .
Hope this helps. Healy in Tampa.

Uninstall all plugins and reinstalling them again solved my problem.

Related

Load socket.io with cordova android build

I have a small chat app project that I created with node.js, express and socket.io. And installed those modules with npm. App is working on the desktops as expected. I'm trying to built the android version of the app with cordova. And when i run cordova run android it opens the app on my phone and load the main ui with no problem and however it really doesn't work (functions) and I get this error in Chrome developer console remote devices, when i add socket.io js file like this in index.html
<script src="/socket.io/socket.io.js"></script>
socket.io.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND
Since app is running on port 3000 on localhost then I tried add the socket.io js script like this in the index.html
<script src="http://localhost:3000/socket.io/socket.io.js"></script>
And then this error occurs
Refused to load the script 'http://localhost:3000/socket.io/socket.io.js' because it violates the following Content Security Policy directive: "script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'".
This is the Content-Security-Policy meta tag
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' http://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'" />
If you want to import the socket.io file from the app storage remove the first slash and ensure that the file are present inside the www folder.
For android check in platforms/android/app/src/main/assets/www the content of that folder is the content of your app. Check there if your socket.io file is present and with the correct path.

Phonegap whitelist domains for Android

Using phonegap version 6.5.2 I'm trying to whitelist domains for an Android application's data and media requests.
In config.xml I have:
<access origin="*" />
as well as a few specific domains:
<access origin="http://example.com" />
<access origin="http://fonts.googleapis.com" />
I've also tried putting this in my root index.html, which should allow all domains, right?:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
But I'm still getting nothing but 404 errors when my app tries to load content.
What gives?
The basic rule to follow in case of 404 errors in cordova android app are as follows:
Check whether cordova whitelist plugin is installed properly
Check whether allow access origin is set properly in config.xml
Check whether content security policy is set properly in your HTML
files
These steps should address almost all the problems related to 404 errors provided the requested URLs are up and running. Hope it helps. Cheers
Not sure where the problem was, but after uninstalling and re-installing the whitelist plugin, and restarting the simulator, everything seems to be working. Thanks #Gandhi for pointing me in that direction.

Firebase signUpWithEmailAndPassword using Ionic

I am using the latest version of Ionic (v1.3.1) and Firebase (v3.1.0).
I'm trying to do firebase user authentication using the following method:
firebase.auth().signInWithEmailAndPassword(email, password)
Whilst this method works perfectly when ionic is running in a web browser, when the ionic app is run natively on Android, it throws an error, specifically:
'A network error (such as timeout, interrupted connection or unreachable host) has occurred.'
I have made sure the app's config.xml allows access to all URLs so it doesn't appear to be an issue with Ionic.
Looking online, it seems that Firebase is possibly blocking the app's browser because it doesn't recognise the app's domain (domains for authentication appear to be whitelisted in the 'OAuth redirect domains' part of the authentication section in the Firebase dashboard).
However, there is not way to identify what an Ionic app's domain is (it certainly isn't 'localhost' or 127.0.0.1)
So, my question is: does Firebase signInWithEmailAndPassword(email, password) actually work with Ionic and other web-wrapper platforms, or is this currently unsupported?
Make sure you are setting the correct Content-Security-Policy too. Something along:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *;script-src 'self' https://* 'unsafe-inline' 'unsafe-eval'; connect-src 'self' https://* 'unsafe-inline' 'unsafe-eval'; ">
Many thanks for the responses. For those interested in the solution to this problem, it did not reside with Firebase. Rather, newer versions of Cordova and Ionic sometimes throw http 404 errors when the app tries to make network requests.
In order to solve these 404 errors, the app needs the Cordova WhiteList plugin added:
http://docs.ionic.io/docs/cordova-whitelist

404 not found (from cache) for Hybrid Fiori app for Android

I have a fiori app that has an embedded IFRAME that makes XMLHttpRequest. The IFRAME src is pointing to "https://myserver:port/some/path/iframe.html" and the request within the page is made to the same server - "https://myserver:port/some/path/request_uri" (POST request).
This works fine in desktop/mobile browser and Fiori app for iOS but it fails for Android app with "404 Not Found (from cache)". I'm not sure why it load the page fine (https://myserver:port/some/path/iframe.html) but fails the request.
Some research seems to indicate that this is caused by Cordova and that I need to add the cordova plugin whitelist - GitHub - apache/cordova-plugin-whitelist: Mirror of Apache Cordova plugin whitelist.
It looks like the request should work fine with the following in the config.xml
<access origin="*" />
But it's not working. I've even tried adding very loosely configured CSP meta tag in the iframe page as well as the LaunchPad page:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
But the request still seems to be blocked and returns "404 Not Found (from cache)".
Does any one have any idea how to fix this issue?
You could perhaps try adding allow-navigation to the config.xml.
<allow-navigation href="myserver:port/*/*" />
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-whitelist/
You might also try using the the logcat tool for Android. It might be possible to pinpoint the problem using it.

Ionic Android fails AJAX calls with Cordova Whitelist

Anyone know how I give an Android Ionic app permission to make cross-domain $http calls?
I have tried the suggestions mentioned in this post: Ionic + Angular - How to avoid the "404 Not Found (from cache)" after POST request?
I have my Content Security meta tag set to accept everything but my app still won't allow any AJAX calls (AngularJS $http.get).
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
The error is in the
ionic.bundle.js:17746, error message 'failed'
(no details). The calls I am trying to make are not https.
Works fine in iOS.
Example call:
$http.get(AppConfig.apiHost + "/api/user/",
{params: {user_id: target_user_id}})
.success(function (target_user) { // do something})
.error(function (error) { console.log(error)});
CLARIFICATIONS FROM COMMENTS BELOW
Here is my config.xml: https://gist.github.com/metalaureate/6f8237b673dacc1412c0b928b7a3d9e5
Cordova CLI: 6.0.0
Ionic Version: 1.0.0-rc.0
Ionic CLI Version: 1.7.14
Ionic App Lib Version: 0.7.0
ios-deploy version: 1.8.5
ios-sim version: 5.0.6
OS: Mac OS X El Capitan
Node Version: v0.12.2
Xcode version: Xcode 7.3 Build version 7D175
Plugins:
cordova-plugin-app-event,cordova-plugin-badge,cordova-plugin-camera,cordova-plugin-contacts,cordova-plugin-device,cordova-plugin-file,cordova-plugin-file-transfer,cordova-plugin-image-picker,cordova-plugin-inappbrowser,cordova-plugin-whitelist,cordova-plugin-x-socialsharing,cordova-plugin-x-toast,de.appplant.cordova.plugin.local-notification,phonegap-plugin-push
All AJAX calls fail.
All testing on a real Samsung S4
This is a very unspecific error, but here are some suggestions you could try to track down the cause of your problem:
If your device has Android <4.4: update it, try it with another device with a newer version or use Crosswalk to use the CSP feature with older Android versions
Update your Ionic sources
Specifically whitelist your API host URL in your CSP settings. That said, default-src * should cover this. You could also try to remove the CSP content altogether: <meta http-equiv="Content-Security-Policy"> (not recommended for production!)
Can you reach the API host (or any other URL) from any other app on your device? If not, you may want to check the Wifi connection of your test device ;)
can u hit the url on simple android chrome browser ? Can u add <meta http-equiv="Content-Security-Policy" content="default-src 'self' https://maps.googleapis.com/ https://maps.gstatic.com/ 'unsafe-inline' 'unsafe-eval'"> where "http://your url" as inside the tag after googleapis.com meta tag .
I can think that it might be a CORS issue.
If possible could u try by making changes in the ionic.project file and adding a new property
{
2 "name": "app",
3 "app_id": "",
4 "proxies": [{
5 "path": "/api/myurl",
6 "proxyUrl": "http://Your-URL"
7 }]
8 }
and making get request by path name and not by url
$http.get('/api/myurl/')
References :- http://ionicinaction.com/blog/how-to-fix-cors-problems-and-no-access-control-allow-origin-header-errors-with-ionic/
http://ionicinaction.com/blog/how-to-fix-cors-issues-revisited/
IONIC, Access-Control-Allow-Origin
ionic app cannot connect cors enabled server with $http
http://blog.ionic.io/handling-cors-issues-in-ionic/
Now this same issue doesnot happen with cordova .
Hope it Helps.
added the plugin
ionic plugin add https://github.com/apache/cordova-plugin-whitelist.git

Categories

Resources