Cordova app crashes on Android when offline - android

I'm currently building an Angular app for Android / iOs (with Cordova).
I'm encountering an issue : the app have to work when the device is offline. On iOs, when I switch the device offline, it's ok.
On Android (real device on 4.1), if I put the device offline and come back to the app, it alerts me that the app have crashed.
I dont know where I can find any log about what happens, any help would be great :)
Here's my config.xml file :
<?xml version="1.0" encoding="UTF-8"?>
<widget id="fr.menutab.app" version="0.0.1">
<name>App title</name>
<description>Not yet</description>
<author email="dev#callback.apache.org" href="http://cordova.io">
Author
</author>
<!-- PLUGINS -->
<feature name="Device">
<param name="ios-package" value="CDVDevice" />
<param name="android-package" value="org.apache.cordova.device.Device" />
</feature>
<feature name="Console">
<param name="ios-package" value="CDVConsole" />
</feature>
<feature name="File">
<param name="ios-package" value="CDVFile" />
<param name="android-package" value="org.apache.cordova.file.FileUtils" />
</feature>
<feature name="FileTransfer">
<param name="ios-package" value="CDVFileTransfer" />
<param name="android-package" value="org.apache.cordova.filetransfer.FileTransfer" />
</feature>
<!-- PREFERENCES -->
<preference name="target-device" value="universal" />
<preference name="Orientation" value="landscape" />
<preference name="Fullscreen" value="true" />
<preference name="phonegap-version" value="3.3.0" />
<!-- ACCESS CONTROL -->
<access origin="*" />
</widget>
Tell me if you need to see more code :)

I was having this same problem. Found this article on problems updating to cordova 3.5.0.
http://excellencemagentoblog.com/cordova-3-5-0-update-troubleshooting-android
The fix that worked for me is at the bottom of the article:
cordova plugin remove org.apache.cordova.network-information
cordova plugin add https://github.com/apache/cordova-plugin-network-information

You can try with "Offline" Event.
The event fires when an application goes offline, and the device is not connected to the Internet.
document.addEventListener("offline", yourCallbackFunction, false);
The offline event fires when a previously connected device loses a network connection so that an application can no longer access the Internet. It relies on the same information as the Connection API, and fires when the value of connection.type becomes NONE.
Applications typically should use document.addEventListener to attach an event listener once the deviceready event fires.
Example :
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for device API libraries to load
//
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
// device APIs are available
//
function onDeviceReady() {
document.addEventListener("offline", onOffline, false);
}
// Handle the offline event
//
function onOffline() {
}
</script>
Source Link : http://docs.phonegap.com/en/3.1.0/cordova_events_events.md.html#offline
Hope this helps.

Related

Connection refused when attempting http requests to local web api (ionic android application)

I built an ionic/angular web app via ionic build, then created the android project with capacitor via
"ionic capacitor run android -l --external". I'm trying to make an http post request to a local web api.
Api's IP is 127.0.0.1:43308, while the android project is running at http://192.168.1.6:8100.
I tried many solutions online and all led me back to the same error
net::ERR_CONNECTION_REFUSED
Anyone got ideas? the project has no issues when ran through a web browser, only gives me such error when it's ran as a native application
Capacitor.config.json:
{
"appId": "com.reservation.app",
"appName": "reservation-app",
"webDir": "www",
"npmClient": "npm",
"server": {
"url": "http://192.168.1.6:8100",
"cleartext": true,
"allowNavigation":[
"localhost:8100/*"
]
}
}
Config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<access origin="*" />
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android">
<application android:networkSecurityConfig="#xml/network_security_config" />
<application android:usesCleartextTraffic="true" />
</edit-config>
<preference name="ScrollEnabled" value="false" />
<preference name="android-minSdkVersion" value="19" />
<preference name="BackupWebStorage" value="none" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
<feature name="CordovaHttpPlugin">
<param name="android-package" value="com.silkimen.cordovahttp.CordovaHttpPlugin"/>
</feature>
<feature name="File">
<param name="android-package" value="org.apache.cordova.file.FileUtils"/>
<param name="onload" value="true"/>
</feature>
<feature name="Whitelist">
<param name="android-package" value="org.apache.cordova.whitelist.WhitelistPlugin"/>
<param name="onload" value="true"/>
</feature>
</widget>
EDIT:
Web API's CORs policy:
public void ConfigureServices(IServiceCollection services)
{
services.AddCors(options =>
{
options.AddPolicy(name: AllowSpecificOrigins,
builder =>
{
builder.WithOrigins( "http://localhost:8100", "http://192.168.1.6:8100")
.AllowAnyMethod()
.AllowAnyHeader()
.AllowCredentials();
});
});
}
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
app.UseCors(AllowSpecificOrigins);
}
Looks like a CORS issue.
Enable CORS for all request methods and from localhost ports 3000 ( http://192.168.1.6:8100 in your case) and 1056 (default for the Webpack server and VS.NET respectively)
As we require credentials sent over, we can't use 'Access-Control-Allow-Origin: *' and need to explicitly list available websites.
See brief description here or a verbose one here
To enable CORS for your entire application the line below must precede any defined endpoints in your app that you want to support cross-origin requests (ex. before any call to UseMvc).
app.UseCors(builder =>
builder.WithOrigins(["http://192.168.1.6:8100","Other Origins that need to call the backend here"])
.WithExposedHeaders(HeaderNames.ContentDisposition) // Expose the file name of downloaded files
.AllowAnyMethod()
.AllowAnyHeader()
.AllowCredentials()
);
Figured it out, web api IP address should be 127.0.0.1:PORT, and android's api reference IP should be 10.0.2.2:PORT (points to the pc's local server).
https://learn.microsoft.com/en-us/xamarin/cross-platform/deploy-test/connect-to-local-web-services#create-a-development-certificate
Can't connect to api endpoint from mobile app

Cordova Android Will Not Display StatusBar

I have an issue I have been trying to solve, none of the solutions online I have seen have helped either.
Very simple, so you think the solution would be as well.
On the Android platform for Cordova build I am using the StatusBar plugin which is set in the config.xml to preference and DISPLAY it...Yes, I am trying to get it to display in the app and not hide. It seems to be hidden every time the app runs.
In my InAppBrowser option string, I also set fullscreen=no so that that won't affect it either.
Running the app in the simulator and on-device both hide it still. Would someone possibly know a solution to FORCE the status bar to show and if not, what are the causes of this?
onDeviceReady: function() {
StatusBar.overlaysWebView(true);
//InAppBrowser Init
var options = "location=no,fullscreen=no,zoom=no"
Browser = cordova.InAppBrowser.open('http://www.app.example', '_self', options);
The StatusBar plugin is also being imported correctly and can be seen here, this was done via plugman:
Here is my Config.xml file for better supporting information:
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.pulse_co" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<feature name="Notification">
<param name="android-package" value="org.apache.cordova.dialogs.Notification" />
</feature>
<feature name="InAppBrowser">
<param name="android-package" value="org.apache.cordova.inappbrowser.InAppBrowser" />
</feature>
<feature name="NetworkStatus">
<param name="android-package" value="org.apache.cordova.networkinformation.NetworkManager" />
</feature>
<feature name="Whitelist">
<param name="android-package" value="org.apache.cordova.whitelist.WhitelistPlugin" />
<param name="onload" value="true" />
</feature>
<feature name="OneSignalPush">
<param name="android-package" value="com.plugin.gcm.OneSignalPush" />
</feature>
<name>Pulse</name>
<description>
Add Pulse App Description Here
</description>
<author email="email#test.com" href="https://support.example.com">
Team
</author>
<content src="index.html" />
<access origin="https://root.domain.co*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<allow-intent href="market:*" />
<preference name="loglevel" value="DEBUG" />
<preference name="StatusBarOverlaysWebView" value="true" />
<feature name="StatusBar">
<param name="android-package" value="org.apache.cordova.statusbar.StatusBar" />
<param name="onload" value="true" />
</feature>
Install statusbar plugin
cordova plugin add cordova-plugin-statusbar
If that still doesn't work, try calling show after deviceready event
StatusBar.show();
Remove
StatusBar.overlaysWebView(true);
Or set it to false
Also remove
<preference name="StatusBarOverlaysWebView" value="true" />
Or set it to false
OverlaysWebview males the statusbar transparent
The options only have effect on InAppBrowser if you use '_blank'.
'_self' = open in Cordova window
'_blank' = open in InAppBrowser window
'_system' = open in system browser
The accepted answer didn't work for me
For anyone still facing this,
according to Cordova plugin page
fullscreen: Sets whether the InappBrowser WebView is displayed
fullscreen or not. In fullscreen mode, the status bar is hidden.
Default value is yes.
So, in order to keep status bar visible, pass fullscreen: "no" in options
let browser = this.inAppBrowser.create(
"https://github.com"
"_target",
{ zoom: "no", location: "no", fullscreen: "no" }
);

Cordova Android Failed to load resource: net::ERR_NAME_NOT_RESOLVED

I upgraded today to the newest Cordova - 5.4.1. App on iOS kept working just fine but not on Android. All requests were returning 404 error, so I dig into the topic and found out that I need "cordova-plugin-whitelist". I installed it and added
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'">
to the header of index.html as well as <access origin="*" /><allow-navigation href="*"/> to config.xml
and now every request to external world is returning "net::ERR_NAME_NOT_RESOLVED"
In AndroidManifest.xml I have those two lines so I guess it's not a problem with Internet access.
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
I went through many questions on SO related to cordova-plugin-whitelist but nothing seems to work
My config.xml
```
<?xml version='1.0' encoding='utf-8'?>
<widget id="app" version="1.1.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>app</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<allow-navigation href="*" />
<platform name="ios">...splash screens and icons</platform>
<platform name="android">...splash screens and icons</platform>
<icon src="resources/android/icon/drawable-xhdpi-icon.png" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
<preference name="Orientation" value="default" />
<feature name="phonegap-parse-plugin">
<param name="id" value="org.apache.cordova.core.parseplugin" />
<param name="url" value="https://github.com/fastrde/phonegap-parse-plugin" />
</feature>
<feature name="Insomnia (prevent screen sleep)">
<param name="id" value="nl.x-services.plugins.insomnia" />
<param name="url" value="https://github.com/EddyVerbruggen/Insomnia-PhoneGap-Plugin.git" />
</feature>
<feature name="Toast">
<param name="id" value="cordova-plugin-x-toast" />
<param name="url" value="https://github.com/EddyVerbruggen/Toast-PhoneGap-Plugin.git" />
</feature>
<feature name="Cordova SMS Plugin">
<param name="id" value="com.cordova.plugins.sms" />
<param name="url" value="https://github.com/cordova-sms/cordova-sms-plugin.git" />
</feature>
<feature name="OpenTokCordovaPlugin">
<param name="id" value="com.tokbox.cordova.opentok" />
<param name="url" value="https://github.com/doxyme/cordova-plugin-opentok" />
</feature>
</widget>
```
I have no idea what the issue was but restarting device resolved it. Nothing related to the app, just the phone had difficulties with connecting to Internet even though it was connected to Wi-Fi and signal strength seemed to be on max.
In your app's 'config.xml', place only this:
<allow-navigation href="*" />
And remove what you added to your index.html header.
Then if it still doesn't work that means your problem is not related to the whitelist plugin.
I used this plugin in different Android projects and never had to do more than this to allow my app to communicate with the back-end.
Hope that helps!
We ran into a similar issue where we received the "Failed to load resource net::ERR_NAME_NOT_RESOLVED" error on two different systems from the android emulator running in HAXM using Cordova 6.4.0 and the version 25 (7.1.1) android SDK. Simply removing and adding the whilelist plugin resolved our issue without changing any configuration files.
I was having the same issue and nothing seemed to solve... And I figured out that in my case was the splashscreen image size that was too big (about 3.2MB)... I used this website to compress the file and then worked.
Restarting Device seems to resolve this problem for me locally, but this piece of work always comes back to me from support. So would like to have a fix for the solution not a workaround.
The whitelist plugin also has Content Security Policy declarations:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
This seems to have resolved the issue for me, but only time will tell as I can never get this issue to replicate on demand.
For me, none of the mentioned solutions worked. What worked for me was adding the plugin directly from the repo:
cordova plugin rm cordova-plugin-inappbrowser --force
cordova plugin add https://github.com/apache/cordova-plugin-inappbrowser.git
If the problem persists you can go ahead and remove and add the platform again:
cordova platform save
cordova platform rm <platform>
cordova platform add <platform>
It seems you are trying to send requests yet you are offline, try to check internet connection.

Window.location doesn't work on Phonegap/Cordova version 4 after upgrade

I have an application based on Cordova 2.7 for Android platform.
Yesterday I had to upgrade Cordova version because of Google Play warning about vulnerabilities...
What I did is to create a basic Cordova app throw terminal commands before upgrades.
After that I put this code into the index.js default file:
onDeviceReady: function() {
app.receivedEvent('deviceready');
//navigator.app.loadUrl('http://www.google.com/');
alert('inside');
//console.log(navigator.app);
//window.location = encodeURI('http://www.example.com');
//window.location.href = 'http://www.example.com/';
window.location = 'http://www.example.com/'; <--- Not works
//window.location = 'local_page.html'; <--- this works perfect
//window.open('http://www.google.com', '_self');
}
And the config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget
id="com.example.app" version="0.0.1"
xmlns="http://www.w3.org/ns/widgets"
xmlns:cdv="http://cordova.apache.org/ns/1.0">
<preference name="loglevel" value="DEBUG" />
<feature name="Device">
<param name="android-package" value="org.apache.cordova.device.Device" />
</feature>
<feature name="InAppBrowser">
<param name="android-package" value="org.apache.cordova.inappbrowser.InAppBrowser" />
</feature>
<name>TPV_APP</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<access origin="*" />
Window.location doesn't work. Indeed doesn't show any posible error.
Its just doesnt work.
If window.location redirect to local pages, it works perfectly,
but for external pages it doesnt.
The alert is executed ok.
INFO: In my previous version of Cordova was working without problems.
I need to be redirected within the same webview. Not open another webview or browser.
I have been searching solutions for 2 days.
Any idea will be appreciated.
Thanks.

Minimum permissions from user in phongap app

I have a phongap app almost ready to be released,
The app gets data from a database (AJAX), shows the users location on google maps and stores a few strings in the users localstorage.
I built my app useing phonegap build and it all works great.
My problem is when I download the APK to my device I am asked for all posible permissions.
I unchecked all unwanted features in the WMAppManifest, and my config.xml shows:
<features>
<feature name="Device">
<param name="wp-package" value="Device" onload="false"/>
<param name="android-package" value="Device" />
</feature>
<feature name="NetworkStatus">
<param name="wp-package" value="NetworkStatus"/>
<param name="android-package" value="NetworkStatus" /></feature>
I'm pretty sure my problem is in the config file but what is it?
Thanks in advance.
You can set the individual permissions in your apps config.xml.
First, disable all permissions.
<preference name="permissions" value="none" />
After that, you can enable the required permissions one by one.
<feature name="http://api.phonegap.com/1.0/network" />
<feature name="http://api.phonegap.com/1.0/camera" />
<feature name="http://api.phonegap.com/1.0/notification" />
<feature name="http://api.phonegap.com/1.0/geolocation" />
<feature name="http://api.phonegap.com/1.0/media" />
<feature name="http://api.phonegap.com/1.0/contacts" />
<feature name="http://api.phonegap.com/1.0/file" />
<feature name="http://api.phonegap.com/1.0/battery" />
<feature name="http://api.phonegap.com/1.0/device" />
Just insert the feature(s) you need – the others can/should be left out.
Source: PhoneGap Build Documentation (Features section)

Categories

Resources