IONIC 4 : Image from api loading failed on android release apk - ionic-framework

I'm using ionic 4,and using cordova-plugin-advanced-http for reading data from api. when I'm trying to read images from API on debug mode,everything is working fine,but when I make released apk images are not displaying and I'm facing with 404 error. and the other hand I tried to install and configure cordova-plugin-whitelist as like as below but it's still not working.
config.xml
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<access origin="https://*.jomsave.com" />
<allow-navigation href="*" />
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<allow-navigation href="data:*" />
<access origin="content:///*" />
<access origin="file:///*" />
index.html
<meta http-equiv=“Content-Security-Policy” content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-eval' 'unsafe-inline'; media-src *">
this issue is only appear in android and only when I'm building release apk and ios version is working fine

Try removing and then adding cordova-plugin-whitelist :
cordova plugin remove cordova-plugin-whitelist
cordova plugin add cordova-plugin-whitelist

Related

Ionic app gets stuck after splash screen for 0.005% of users

I'm having an issue in my Ionic app. After the splash screen the user cannot tap on any buttons, and can't interact with the app at all. It's either stuck or simply non-responsive.
This happens consistently for those devices, therefore they are never able to sign up.
This is my ionic info:
Ionic CLI : 5.2.3 (C:\Users\Simon K\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : #ionic/angular 4.11.10
#angular-devkit/build-angular : 0.801.3
#angular-devkit/schematics : 8.1.3
#angular/cli : 8.1.3
#ionic/angular-toolkit : 2.0.0
Cordova:
Cordova CLI : 9.0.0 (cordova-lib#9.0.1)
Cordova Platforms : android 8.1.0, browser 6.0.0, ios 5.0.1
Cordova Plugins : cordova-plugin-ionic 5.4.4, cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.1, (and 14 other plugins)
This is being reported by users on older devices. Most recently on a Samsung S5. I'm not sure if it's due to an older phone just freezing on our app, or perhaps it's some sort of network setting? Where it prevents Ionic from being responsive.
My config settings:
<access origin="*" />
<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-navigation href="*" />
<preference name="ScrollEnabled" value="false" />
<preference name="android-minSdkVersion" value="19" />
<preference name="android-targetSdkVersion" value="29" />
<preference name="BackupWebStorage" value="none" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
<preference name="AndroidLaunchMode" value="singleTask" />
If there is anything else I can provide that might be helpful, please let me know. I am at a loss as to how such a problem can be fixed as I have not been able to replicate the issue.
Is this potentially an Ionic issue?
Run app on the device on which you are getting this issue check logs using chrome://inspect

How to create android project from weex

I can't add platform from weex, only from weexpack
drew#drew-Aspire-E1-571G ~/Work/Weex/awesome-project $ weexpack platform add android
Error: Current working directory is not a weexpack project
and I cannot compile weex to android project
.
If you use weex-toolkit, you should create some files and dirs by yourself, including:
dirs:
web
platforms
plugins
files:
android.config.json
ios.config.json
config.xml
Edit config.xml:
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.alibaba.weex" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>MyApp1</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" />
<plugin name="cordova-plugin-whitelist" spec="1" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
</widget>
In the current version, you can also use weex create to create weexpack project.
And of course, a starter kit maybe also helpful for you: https://github.com/elemefe/weex-vue-starter-kit

Phonegap build email plugin not recognized

I built an app that utilizes the phonegap build plugin for composing emails with attachments. The app is working well on iOS devices but email is not working on Android devices. Here is part of my config.xml:
<preference name="disable-cursor" value="true" />
<preference name="orientation" value="default" />
<preference name="fullscreen" value="true" />
<preference name="webviewbounce" value="false" />
<preference name="permissions" value="none"/>
<gap:platform name="android" />
<preference name="loadUrlTimeoutValue" value="700000" />
<gap:config-file platform="android" parent="/manifest"><application android:hardwareAccelerated="false"/></gap:config-file>
<icon src="icon.png" hover="true"/>
<icon src="icon.png" default="true" width="57" height="57"/>
<icon src="icons/android/mdpi.png" gap:platform="android" gap:qualifier="mdpi" />
<icon src="icons/android/hdpi.png" gap:platform="android" gap:qualifier="hdpi" />
<icon src="icons/android/xhdpi.png" gap:platform="android" gap:qualifier="xhdpi" />
<icon src="icons/android/xxhdpi.png" gap:platform="android" gap:qualifier="xxhdpi" />
<gap:splash src="splash.png" width="270" height="480" />
<gap:splash src="default-568h#2x.png" gap:platform="ios" width="640" height="1136"/>
<splash src="splash.png" />
<feature name="http://api.phonegap.com/1.0/file" />
<feature name="http://api.phonegap.com/1.0/network"/>
<feature name="http://api.phonegap.com/1.0/contacts"/>
<plugin name="com.jcjee.plugins.emailcomposer" spec="1.4.6" source="pgb" />
<plugin name="cordova-plugin-file" spec="3.0.0" source="pgb"/>
and my javascript that calls the email composer:
window.plugins.emailComposer.showEmailComposerWithCallback(null, email_subjectdef, "", email_default, [], [], true, [compatibleAttachment, compatibleAttachment2]);
I am currently trying the jcjee plugin but also tried the deappplant plugin.
The error I receive on the device is:
"cannot read property 'emailcomposer' of undefined.
Thanks for your help!
I was able to determine what the error was an the email plugin is working fine on Android. I had been using an iframe to display a PDF file. Apparently Android 4.4.2 does not like iframes, at least not in a Phonegap Build project. Removing the iframe solved my problem.

ionic run android -l (with livereload) no longer working

After this weekend I have been trying the command to livereload on android (ionic run android -l -c) which makes workflow faster but it's no longer working, no error messages.
I tried:
reinstalling npm (removed npm_modules) and once again npm install
uninstall and reinstalling cordova and ionic
updating ionic cli
no errors in css/scss file
restarting PC many times after doing all these.
Any of you had the same problem, any workarounds?
I checked my index.html and config.xml and both seem fine. As I know sometimes errors in this files might bother the livereload, so I'm posting them both here maybe someone else sees something I'm missing:
This is the index.html:
<!DOCTYPE html>
<html ng-app="az-app" id="index" ng-controller="IndexController">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<!-- compiled css output -->
<link href="css/ionic.app.css" rel="stylesheet">
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<!-- angular filters -->
<script src="lib/angular-filter/dist/angular-filter.js"></script>
<!-- iOS9 Window location bug patch -->
<script src="js/ios9-angular.patch.js"></script>
<!-- Controllers -->
<script src="js/controllers/IndexController.js"></script>
<script src="js/controllers/walkthrough/PolicyController.js"></script>
<script src="js/controllers/walkthrough/WalkthroughController.js"></script>
<script src="js/controllers/DashboardController.js"></script>
<script src="js/controllers/DoctorsDirController.js"></script>
<script src="js/controllers/meds-refund/MedsRefundWalkController.js"></script>
<script src="js/controllers/meds-refund/MedsRefundController.js"></script>
<script src="js/controllers/meds-refund/MedsCamScannerController.js"></script>
<script src="js/controllers/consult-refund/ConsultRefundWalkController.js"></script>
<script src="js/controllers/consult-refund/ConsultRefundController.js"></script>
<script src="js/controllers/consult-refund/SelectsController.js"></script>
<script src="js/controllers/consult-refund/ConsultCamController.js"></script>
<script src="js/controllers/med-authorization/MedAuthorizationWalkController.js"></script>
<script src="js/controllers/med-authorization/MedAuthorizationController.js"></script>
<script src="js/controllers/med-authorization/MedAuthCamController.js"></script>
<script src="js/controllers/what-to-do/WhatToDoController.js"></script>
<script src="js/controllers/benefits/LifeBenefitsController.js"></script>
<!-- Custom Directives -->
<script src="js/directives/moreInfo.js"></script>
<!-- Models -->
<script src="js/services/Config.js"></script>
<script src="js/services/CameraScannerFactory.js"></script>
<script src="js/services/StorageFactory.js"></script>
<script src="js/services/WebServiceFactory.js"></script>
</head>
<body>
<ion-nav-bar class="nav-bar">
<ion-nav-back-button class="button-clear" side="primary">
<i class="nav-bar-back-arrow ion-android-arrow-back"></i>
</ion-nav-back-button>
<ion-nav-buttons class="button-clear" side="secondary">
<button class="nav-bar-btn" ng-click="goToDashboard()">
<img class="bdoard-btn" src="img/icons/ic_dboard_btn.png"/>
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-nav-view></ion-nav-view>
</body>
</html>
my config.xml:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.azseguros.anglogold" version="1.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>AZ Seguros - Anglo Gold</name>
<description>
</description>
<author email="alaorden#banshai.com" href="http://banshai.com.com/">El equipo Banshai</author>
<content src="index.html"/>
<access origin="git add*"/>
<access launch-external="yes" origin="tel:*"/>
<access launch-external="yes" origin="mailto:*"/>
<preference name="webviewbounce" value="false"/>
<preference name="UIWebViewBounce" value="false"/>
<preference name="DisallowOverscroll" value="true"/>
<preference name="android-minSdkVersion" value="16"/>
<preference name="BackupWebStorage" value="none"/>
<preference name="SplashScreen" value="screen"/>
<preference name="Fullscreen" value="false"/>
<preference name="SplashScreenDelay" value="3000"/>
<preference name="xwalkVersion" value="14+"/>
<preference name="xwalkCommandLine" value="--disable-pull-to-refresh-effect"/>
<preference name="xwalkMode" value="embedded"/>
<feature name="StatusBar">
<param name="ios-package" onload="true" value="CDVStatusBar"/>
</feature>
<platform name="android">
<icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png"/>
<icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png"/>
<icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png"/>
<icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png"/>
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png"/>
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png"/>
<splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png"/>
<splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png"/>
<splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png"/>
<splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png"/>
<splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png"/>
<splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png"/>
<splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png"/>
<splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png"/>
<splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png"/>
<splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png"/>
<splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png"/>
<splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png"/>
</platform>
<platform name="ios">
<icon height="57" src="resources/ios/icon/icon.png" width="57"/>
<icon height="114" src="resources/ios/icon/icon#2x.png" width="114"/>
<icon height="40" src="resources/ios/icon/icon-40.png" width="40"/>
<icon height="80" src="resources/ios/icon/icon-40#2x.png" width="80"/>
<icon height="50" src="resources/ios/icon/icon-50.png" width="50"/>
<icon height="100" src="resources/ios/icon/icon-50#2x.png" width="100"/>
<icon height="60" src="resources/ios/icon/icon-60.png" width="60"/>
<icon height="120" src="resources/ios/icon/icon-60#2x.png" width="120"/>
<icon height="180" src="resources/ios/icon/icon-60#3x.png" width="180"/>
<icon height="72" src="resources/ios/icon/icon-72.png" width="72"/>
<icon height="144" src="resources/ios/icon/icon-72#2x.png" width="144"/>
<icon height="76" src="resources/ios/icon/icon-76.png" width="76"/>
<icon height="152" src="resources/ios/icon/icon-76#2x.png" width="152"/>
<icon height="29" src="resources/ios/icon/icon-small.png" width="29"/>
<icon height="58" src="resources/ios/icon/icon-small#2x.png" width="58"/>
<icon height="87" src="resources/ios/icon/icon-small#3x.png" width="87"/>
<splash height="1136" src="resources/ios/splash/Default-568h#2x~iphone.png" width="640"/>
<splash height="1334" src="resources/ios/splash/Default-667h.png" width="750"/>
<splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242"/>
<splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208"/>
<splash height="1536" src="resources/ios/splash/Default-Landscape#2x~ipad.png" width="2048"/>
<splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024"/>
<splash height="2048" src="resources/ios/splash/Default-Portrait#2x~ipad.png" width="1536"/>
<splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768"/>
<splash height="960" src="resources/ios/splash/Default#2x~iphone.png" width="640"/>
<splash height="480" src="resources/ios/splash/Default~iphone.png" width="320"/>
</platform>
<platform name="ios">
<config-file parent="NSAppTransportSecurity" platform="ios" target="*-Info.plist">
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
</config-file>
</platform>
<icon src="resources/android/icon/drawable-xhdpi-icon.png"/>
</widget>
You may check your firewall setting, add "node.exe" to excluded program.
Press Win+R, run "WF.msc", add "C:\Program Files\nodejs\node.exe" to exclude program on both incoming and outgoing role.
I just solve many livereload problems with this trick, including blank screen, unsuccessful livereload etc.
Note that ionic will open two port for "ionic cordova run android -l", one for html page(:8100) and one for websocket(as mean as livereload).

Blackberry config.xml is different in Worklight build methodologies

I'm building our BB10 environment in Worklight using two different ways.
1- Through Eclipse IDE:
The config.xml in the native folder which has been generated after building the environment contains all the feature that we need in our project.
<?xml version='1.0' encoding='utf-8'?>
<widget id="MobileBanking" version="1.0.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:rim="http://www.blackberry.com/ns/widgets" rim:backButton="exit">
<name>Mobile Bank</name>
<author email="support#company.com">company</author>
<description>
Mobile Bank
</description>
<license href="http://opensource.org/licenses/alphabetical">
</license>
<access subdomains="true" uri="file:///store/home" />
<access subdomains="true" uri="file:///SDCard" />
<!-- start_worklight_host_server do not change this line-->
<access subdomains="true" uri="https://mobile-qa.company.ca" />
<!-- end_worklight_host_server do not change this line-->
<access subdomains="true" uri="tel://*"/>
<access subdomains="true" uri="http://google.com"/>
<access subdomains="true" uri="http://maps.googleapis.com"/>
<access subdomains="true" uri="http://googleapis.com"/>
<access subdomains="true" uri="http://maps.gstatic.com"/>
<access subdomains="true" uri="http://fonts.gstatic.com"/>
<access subdomains="true" uri="http://csi.gstatic.com"/>
<access subdomains="true" uri="https://www.company.com/*" />
<!-- <access subdomains="true" uri="*" /> -->
<icon src="icon.png" />
<rim:splash src="splash-1024x600.png" />
<rim:splash src="splash-600x1024.png" />
<rim:splash src="splash-1280x768.png" />
<rim:splash src="splash-768x1280.png" />
<content src="webresources/skinLoader.html" />
<rim:permissions>
<rim:permit>read_device_identifying_information</rim:permit>
<rim:permit>access_shared</rim:permit>
<rim:permit>read_geolocation</rim:permit>
<rim:permit>access_pimdomain_contacts</rim:permit>
<rim:permit>access_pimdomain_messages</rim:permit>
<rim:permit>access_location_services</rim:permit>
</rim:permissions>
<preference name="HideKeyboardFormAccessoryBar" value="true"/>
<preference name="Orientation" value="portrait"/>
<preference name="ChildBrowser" value="disable"/>
<preference name="AutoHideSplashScreen" value="false"/>
<preference name="WebSecurity" value="enabled" />
<feature id="blackberry.invoke" name="blackberry.invoke" value="blackberry.invoke" />
<feature id="blackberry.app" name="blackberry.app" value="blackberry.app" />
<feature id="com.blackberry.utils" name="com.blackberry.utils" />
<feature id="com.blackberry.pim.lib" name="com.blackberry.pim.lib" />
<feature id="Battery" name="Battery" value="Battery" />
<feature id="Camera" name="Camera" value="Camera" />
<feature id="Contacts" name="Contacts" value="Contacts" />
<feature id="Device" name="Device" value="Device" />
<feature id="Accelerometer" name="Accelerometer" value="Accelerometer" />
<feature id="Compass" name="Compass" value="Compass" />
<feature id="Notification" name="Notification" value="Notification" />
<feature id="org.apache.cordova.file" name="File" value="File" />
<feature id="FileTransfer" name="FileTransfer" value="FileTransfer" />
<feature id="Geolocation" name="Geolocation" value="Geolocation" />
<feature id="Media" name="Media" value="Media" />
<feature id="Capture" name="media-capture" value="Capture" />
<feature id="NetworkStatus" name="NetworkStatus" value="NetworkStatus" />
<feature id="SplashScreen" name="SplashScreen" value="SplashScreen" />
<feature id="Vibration" name="Vibration" value="Vibration" />
</widget>
2- When I use Ant Worklight Builder, the generated native folder for BB10 contains the following config.xml:
<?xml version='1.0' encoding='utf-8'?>
<widget id="MobileBank" version="1.0.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:rim="http://www.blackberry.com/ns/widgets" rim:backButton="exit">
<name>MobileBank</name>
<author email="support#company.com">company</author>
<description>
MobileBanking
</description>
<license href="http://opensource.org/licenses/alphabetical">
</license>
<access subdomains="true" origin="file:///store/home" />
<access subdomains="true" origin="file:///SDCard" />
<!-- start_worklight_host_server do not change this line-->
<access subdomains="true" origin="https://mobile-qa.company.ca" />
<!-- end_worklight_host_server do not change this line-->
<access subdomains="true" origin="*" />
<icon src="icon.png" />
<rim:splash src="splash-1024x600.png" />
<rim:splash src="splash-600x1024.png" />
<rim:splash src="splash-1280x768.png" />
<rim:splash src="splash-768x1280.png" />
<content src="webresources/skinLoader.html" />
<rim:permissions>
<rim:permit>read_device_identifying_information</rim:permit>
<rim:permit>access_shared</rim:permit>
<rim:permit>read_geolocation</rim:permit>
<rim:permit>access_pimdomain_contacts</rim:permit>
</rim:permissions>
</widget>
All the feature tags disappear using Ant builder.
Worklight Ant task version 6.2.0.01.20150329-1923
WebWorks SDK version 2.2.0.15.
I tried Windows and Mac. got same result.
Thank you.
See this blog post: https://developer.ibm.com/mobilefirstplatform/2015/03/05/ootb-support-blackberry-webworks-2-2/
I've created an application with the BlackBerry 10 environment two times: using The WebWorks 1.0 SDK and the WebWorks 2.2 SDK. The difference in config.xml is due to the SDK used.
The Worklight builder will create the first config.xml if your environment variable for WEBWORKS_HOME is pointing to WebWorks 1.0.
The Worklight builder will create the second config.xml if your environment variable for WEBWORKS_HOME is pointing to WebWorks 2.2.
This means that your Studio and Ant .jar file are not of the same version Worklight.
Get the latest iFix from IBM Fix Central; to get the Ant .jar I believe that you will need to extract the Server installation to get it.