Quantcast
Channel: Ionic Framework - Ionic Forum
Viewing all 49337 articles
Browse latest View live

Geolocation is not working on android devices

$
0
0

@karabillie wrote:

Geolocation is not working on my android device, although it works on ios devices.
When I launch the app for the first time on my device, it asks me about the permissions on using geolocation but then it does go inside the function.
WHAT IS THE PROBLEM?

package.json:

{
  "name": "weather-app",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "https://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "~8.1.2",
    "@angular/core": "~8.1.2",
    "@angular/forms": "~8.1.2",
    "@angular/platform-browser": "~8.1.2",
    "@angular/platform-browser-dynamic": "~8.1.2",
    "@angular/router": "~8.1.2",
    "@ionic-native/android-permissions": "^5.19.1",
    "@ionic-native/core": "^5.0.0",
    "@ionic-native/geolocation": "^5.19.1",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",
    "@ionic/angular": "^4.7.1",
    "cordova": "^9.0.0",
    "cordova-android": "8.1.0",
    "cordova-ios": "^5.1.1",
    "cordova-plugin-add-swift-support": "^2.0.2",
    "cordova-plugin-android-permissions": "^1.0.2",
    "cordova-res": "^0.8.1",
    "core-js": "^2.5.4",
    "rxjs": "^6.5.4",
    "tslib": "^1.9.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.801.2",
    "@angular-devkit/build-angular": "~0.801.2",
    "@angular-devkit/core": "~8.1.2",
    "@angular-devkit/schematics": "~8.1.2",
    "@angular/cli": "~8.1.2",
    "@angular/compiler": "~8.1.2",
    "@angular/compiler-cli": "~8.1.2",
    "@angular/language-service": "~8.1.2",
    "@ionic/angular-toolkit": "^2.1.1",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "^5.0.0",
    "cordova-plugin-device": "^2.0.3",
    "cordova-plugin-ionic-keyboard": "^2.2.0",
    "cordova-plugin-ionic-webview": "^4.1.3",
    "cordova-plugin-splashscreen": "^5.0.3",
    "cordova-plugin-statusbar": "^2.4.3",
    "cordova-plugin-whitelist": "^1.3.4",
    "eslint": "^6.8.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "^5.20.1",
    "tslint-config-mway": "^2.0.4",
    "typescript": "^3.4.5"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {
        "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
      },
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-geolocation": {},
      "cordova-plugin-android-permissions": {}
    },
    "platforms": [
      "android",
      "ios"
    ]
  },
  "optionalDependencies": {
    "ios-deploy": "1.9.3"
  }
}

AndroidManifest file:

<?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="1" android:versionName="0.0.1" package="io.ionic.starter" xmlns:android="http://schemas.android.com/apk/res/android">
    <supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:resizeable="true" android:smallScreens="true" android:xlargeScreens="true" />
    <uses-permission android:name="android.permission.INTERNET" />
    <application android:hardwareAccelerated="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:networkSecurityConfig="@xml/network_security_config" android:supportsRtl="true" android:usesCleartextTraffic="true">
        <activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode" android:label="@string/activity_name" android:launchMode="singleTop" android:name="MainActivity" android:theme="@android:style/Theme.DeviceDefault.NoActionBar" android:windowSoftInputMode="adjustResize">
            <intent-filter android:label="@string/launcher_name">
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
    <uses-feature android:name="android.hardware.location.gps" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
</manifest>

My function in the component.ts:

getGeoLocation() {
    this.geolocation.getCurrentPosition({ enableHighAccuracy: false }).then((resp) => {
      this.geoLatitude = resp.coords.latitude;
      this.geoLongitude = resp.coords.longitude;
      const city = {
        isActive: this.isActive,
        latitude: this.geoLatitude,
        longitude: this.geoLongitude
      };
    }).catch((error) => {
      console.log('Error getting location', error);
    });
  }

Posts: 1

Participants: 1

Read full topic


How to implement background service on my ionic 4 app?

$
0
0

@tomjaihk wrote:

I intend to use this module:

https://ionicframework.com/docs/native/background-mode

However, this module makes my app crash when I enable it. Is there any alternative way to implement background service? Thank you.

My device is Android 10 Sony Xperia 1.

info

Ionic:

   Ionic CLI                     : 5.4.13
   Ionic Framework               : @ionic/angular 4.11.7
   @angular-devkit/build-angular : 0.803.21
   @angular-devkit/schematics    : 8.1.3
   @angular/cli                  : 8.1.3
   @ionic/angular-toolkit        : 2.0.0

plugin list

com.unarin.cordova.beacon 3.8.1 "Proximity Beacon Plugin"
cordova-plugin-autostart 2.3.0 "Autostart"
cordova-plugin-background-mode 0.7.3 "BackgroundMode"
cordova-plugin-badge 0.8.8 "Badge"
cordova-plugin-ble-central 1.2.4 "BLE"
cordova-plugin-browsertab 0.2.0 "cordova-plugin-browsertab"
cordova-plugin-compat 1.2.0 "Compat"
cordova-plugin-device 2.0.3 "Device"
cordova-plugin-geolocation 4.0.2 "Geolocation"
cordova-plugin-googlemaps 2.6.2 "cordova-plugin-googlemaps"
cordova-plugin-inappbrowser 3.2.0 "InAppBrowser"
cordova-plugin-ionic-keyboard 2.2.0 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 4.1.3 "cordova-plugin-ionic-webview"
cordova-plugin-local-notification 0.9.0-beta.2 "LocalNotification"
cordova-plugin-nativestorage 2.3.2 "NativeStorage"
cordova-plugin-splashscreen 5.0.3 "Splashscreen"
cordova-plugin-statusbar 2.4.3 "StatusBar"
cordova-plugin-whitelist 1.3.4 "Whitelist"
cordova.plugins.diagnostic 5.0.1 "Diagnostic"

Posts: 1

Participants: 1

Read full topic

Is there any free ionic supporting dicom image viewer is available?

Cordova pluggins security issue on veracode scan

$
0
0

@mellajones wrote:

I Have developed an application using ionic 3 and i used “cordova-plugin-x-socialsharing” ,“cordova-plugin-local-notification” , my veracode result scan is pointing this plugins with vulnerabiulities , please is ionic doing something to help fix those security vulnerability issues and if you have any good suggestions on what i can do to fix this.

Posts: 1

Participants: 1

Read full topic

Reloading not working when deployed through a Node.js server

$
0
0

@kevintenyroy wrote:

I have a project deployed as a website (not a PWA) through a node.js server. The website works as intended, but when reloaded on a particular page (let’s say lvh.me:3000/home), I get a error on the page “cannot get /home”.

The project works perfectly on ionic serve without any error on the browser console. But when the above issue arises, I get an error of “Refused to load the image ‘http://lvh.me:3000/favicon.ico’ because it violates the following Content Security Policy directive: “default-src ‘none’”. Note that ‘img-src’ was not explicitly set, so ‘default-src’ is used as a fallback.”

Any suggestion on how to resolve this?

Posts: 1

Participants: 1

Read full topic

Problem with ion-refresher

$
0
0

@Ccuestama wrote:

Good morning, I’m having a problem with the ionic component: ion-refresher

When I launch it, I mean I pull to resfresh on another page, they all work perfectly,

The problem occurs when I throw it on one that is in the ion-content of a tab, when launching said refresher all the others are blocked

Posts: 1

Participants: 1

Read full topic

Cannot find module '@ionic-native/diagnostic/ngx'.ts(2307)

Ionic 3: Deeplinks. Please Help

$
0
0

@PappJulioNicolas wrote:

Hi everyone

I am trying to run the DeepLinks in an application created in Ionic 3. On Android it is working fine with this plugin: https://ionicframework.com/docs/v3/native/deeplinks/. Declare the URL Scheme, Host and others requesting the plugin. It is in a first instance.

On the other hand, create a base application, with this plugin to open: https://github.com/lampaa/com.lampa.startapp. Declare in the config.xml the URL Scheme to be able to open it in iOS. I leave the example here:

<config-file overwrite = "true" parent = "LSApplicationQueriesSchemes" target = "* - Info.plist">
            <array>
                <string> providers: // </string>
            </array>
</config-file>

Anyway, it doesn’t work. I understand that iOS always has complications. The error he gives me is the following:

-canOpenURL: failed for URL: “providers: //” - error: “The operation couldn’t be completed. (OSStatus error -10814.)”

Anyone could do Deeplinks in any application in Ionic 3? Thank you very much for the help

Attached list of plugins and ionic info

com.lampa.startapp 6.1.6 “startApp”
com.telerik.plugins.nativepagetransitions 0.6.5 “Native Page Transitions”
cordova-plugin-3dtouch 1.3.5 “3D Touch”
cordova-plugin-androidx 1.0.2 “cordova-plugin-androidx”
cordova-plugin-androidx-adapter 1.1.0 “cordova-plugin-androidx-adapter”
cordova-plugin-background-mode 0.7.2 “BackgroundMode”
cordova-plugin-badge 0.8.7 “Badge”
cordova-plugin-camera-preview 0.10.0 “cordova-plugin-camera-preview”
cordova-plugin-cocoapod-supportx 1.7.3 “Cordova CocoaPods Dependency Support”
cordova-plugin-device 2.0.2 “Device”
cordova-plugin-email-composer 0.9.2 “EmailComposer”
cordova-plugin-file 6.0.2 “File”
cordova-plugin-file-opener2 2.2.1 “File Opener2”
cordova-plugin-firebasex 7.0.1 “Google Firebase Plugin”
cordova-plugin-inappbrowser 3.1.0 “InAppBrowser”
cordova-plugin-ionic-webview 4.1.1 “cordova-plugin-ionic-webview”
cordova-plugin-local-notification 0.9.0-beta.2 “LocalNotification”
cordova-plugin-nativestorage 2.3.2 “NativeStorage”
cordova-plugin-splashscreen 5.0.3 “Splashscreen”
cordova-plugin-statusbar 2.4.3 “StatusBar”
cordova-plugin-whitelist 1.3.4 “Whitelist”
cordova-universal-links-plugin 1.2.1 “Universal Links Plugin”
ionic-plugin-deeplinks 1.0.20 “Ionic Deeplink Plugin”
phonegap-plugin-barcodescanner 8.0.0 “BarcodeScanner”

Ionic:

Ionic CLI : 5.2.7 (/Users/equiporeserv/.nvm/versions/node/v10.15.3/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.6
@ionic/app-scripts : 3.2.4

Cordova:

Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : ios 5.1.1
Cordova Plugins : cordova-plugin-ionic-webview 4.1.1, (and 18 other plugins)

Utility:

cordova-res : 0.6.0 (update available: 0.8.1)
native-run : 0.2.8 (update available: 0.3.0)

System:

Android SDK Tools : 26.1.1 (/Users/equiporeserv/Library/Android/sdk)
ios-deploy : 1.9.4
ios-sim : 8.0.2
NodeJS : v10.15.3 (/Users/equiporeserv/.nvm/versions/node/v10.15.3/bin/node)
npm : 6.11.3
OS : macOS Mojave
Xcode : Xcode 11.1 Build version 11A1027

Posts: 1

Participants: 1

Read full topic


Ionic 4 React Fonts and Styles

$
0
0

@michaelgriffith wrote:

I don’t fully understand how the vars and styles work in Ionic 4 react app. I was able to successfully install and style my app globally with a font, but want to use different fonts for different elements.

In /src/theme/variables.css I have defined my fonts, as such

/* Fonts */
@font-face {
  font-family: 'Comfortaa', ;
  src: url('/assets/fonts/comfortaa.woff');
}

@font-face {
  font-family: 'OpenSans',;
  src: url('/assets/fonts/opensans.woff2');
}

and applied the style by setting the root font family:

: root {
  ...
  --ion-font-family: 'Comfortaa';
}

However I want to style body or h1 or paragraphs with OpenSans. I cannot figure out where and what I need to do to style each element (font/colors/etc) separately than the root theme.

Any all replies appreciated, thanks in advance.

Posts: 1

Participants: 1

Read full topic

Ionic 4 not storing updated authentication cookie on iOS and Android

$
0
0

@shpingbing wrote:

All of a sudden today, our deployed Ionic app stopped accepting the authentication cookie returned by our server. We have made no changes to the app or the server, so we are quite puzzled. After debugging these requests, we confirmed that the SET-COOKIE header is coming back from our login endpoint, but it is not used on requests made after via HttpClient.

This only happens on iOS and Android, running ionic serve everything works.

Any ideas on this one?

Posts: 1

Participants: 1

Read full topic

how to duplicate a page? (I'm a newbie)

$
0
0

@enzog wrote:

How can I duplicate a screen? I want a second screen very similar to the first and I didn’t want to have the trouble of doing it from scratch again.

Posts: 1

Participants: 1

Read full topic

Leaflet map can't be loaded ionic 4...pleas help!

Custom selected for ion-segment-button

$
0
0

@melaniecarr23 wrote:

I have a strange situation where I’m using the ion-segment buttons to set my event.field = the selected event.options object. It works how I’d like it to EXCEPT that it doesn’t keep the button clicked highlighted as selected.

Is there a way to set the selected element in another way? event.field, once the button is selected, becomes an object. The value of the button would be equal to event.field.field OR event.options[i].field.

Can someone help me?

<ion-segment (ngModel)="event.options" selected="event.field">
   <ion-segment-button (click)="changeField(d, e, i, event.options)" *ngFor="let options of event.options; let i = index" [value]="event.field">
   <ion-label color="primary">{{ options.field }}</ion-label>
   </ion-segment-button>
</ion-segment>

Posts: 1

Participants: 1

Read full topic

Changed then and catch in JavaScript promise

$
0
0

@Azad47808 wrote:

I’m getting the values of a table in my code with this code.

this.dbObject.executeSql("SELECT * FROM atten").then(res => {

      console.log("this is responce = ", res.rows)

    }).catch(err => {

      console.log("this is error = ", err)

    })

the then function not execute.

the catch function executes with right values of the table, don’t get any error “this is error = values”

when I remove the catch method it gets an error

Posts: 1

Participants: 1

Read full topic

Does it make sense to use an analytics tool in an Ionic App?

$
0
0

@ioclaudio wrote:

Hi,
according to you, does it make sense to use an analytics tool, such as Google Analytics or Motomo, in an Ionic app to retrieve statistics on the use of the app and the user behavior?

Could it slow down the app or create other problems?
Can they be effective tools as they are with web sites and webapps?
There are ways to make the same thing?

Thank you

cld

Posts: 1

Participants: 1

Read full topic


Ionicons disappear if I change $font-path

$
0
0

@APrince wrote:

Hi guys,

In my app created from a blank template, there are these 3 imports in the variables.scss file:

@import "ionic.ionicons";

@import "roboto";

@import "noto-sans";

Now, that alone works fine. I just had to replace the builtin roboto font with the full version containing the extended characters. I did that by creating fonts folder with the assets folder and copied the full font files there. So far so good.

However, I wanted to share the module with fonts across multiple projects without copying it everywhere, so I have my custom assets-common submodule that is mounted within the assets folder, so the fonts are no longer within assets/fonts but in assets/assets-common/fonts. Therefore I also had to change the $font-path variable within variables.scss to this:

$font-path: "../assets/audic-common-assets/fonts";

For the roboto font that is “overriden” in the fonts folder it works well, and the extended characters are still OK. However ionicons are now broken.

if I look in the www folder, I can see that ionicons and noto-sans fonts are still in assets/fonts. So obviously the fonts that are not overriden have a hardcoded build output path.

Anything I can do about it?

Posts: 1

Participants: 1

Read full topic

Register PushNotification: Error -> UI API called on a background thread

$
0
0

@chunta wrote:

Main Thread Checker: UI API called on a background thread: -[UIApplication registerForRemoteNotifications]

I use the following js in constructor in the tab example, but I always get the error as title.
import {
Plugins,
PushNotification,
PushNotificationToken,
PushNotificationActionPerformed } from ‘@capacitor/core’;
const { PushNotifications } = Plugins;

   // Register with Apple / Google to receive push via APNS/FCM
     PushNotifications.register();

//Environment
Ionic:

Ionic CLI : 5.4.15 (/usr/local/lib/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.1.2

Capacitor:

Capacitor CLI : 1.4.0
@capacitor/core : 1.4.0

Anyone can help ?

Posts: 1

Participants: 1

Read full topic

Perplexity about the use of Firebase

$
0
0

@ioclaudio wrote:

Hi guys,
this is not a technical question I know, perhaps it is a bit off-topic, but I think it is important to discuss the technologies we use every day to make our Apps.

I see everyday tutorials and articles that promote and explain the use of Firebase with Angular, Ionic, and other technologies.
But I have some concerns and some doubts about Firebase, because it is a Google proprietary technology and because it must be hosted on their servers.
At the moment these two things are a guarantee of quality, but what about the future?
What will happen if Google increases prices or introduces other limitations?

Would you trust to use Firebase for an important application? What would happen if overnight, for some reason, it was no longer usable? The fact that it cannot be used with the on-promise formula, in my opinion, is not reassuring.

What do you think?
Are there real alternatives?

Claudio

Posts: 1

Participants: 1

Read full topic

Ionic 4 WebAssembly is not defined with OpenCV on an older phone

$
0
0

@wojtekkabat wrote:

I am trying to develop a simple image processing mobile application using the Ionic Framework (version 4). I decided to use the OpenCV.js library and the way I am adding it to my ionic project is:

  1. I put the opencv.js file in app/assets/lib/opencv.js

  2. I added

 "scripts": [
          "src/assets/lib/opencv.js"
        ]

in my angular.json file.

  1. I put declare var cv: any; on top of any ts file that I needed to use the opencv library in and then I just use cv to reference an opencv.js function like for example cv.imread(image) .

My application works well in the browser, as well as on some test devices (I’ve tried Galaxy Note 10 , Galaxy S8 , Galaxy S6 ). However, when I try to run the application on a Samsung Galaxy S5 , the app shows an error on the console upon startup:

Uncaught ReferenceError: WebAssembly is not defined

and then, when I click a button that calls anything related to openCV I get the following message:

ERROR Error: Uncaught (in promise): ReferenceError: cv is not defined

And of couse the openCV functinality does not work. I realize it must be something related to the phone being pretty old, but I would like to know exactly the reason why it works on other phones but does not on this one. And maybe, if it is possible, it would be great to find out what can be done to make it work on this and other phones like this.

It is a Samsung Galaxy S5 with Android 5.0 .

Also I do not really understand why WebAssembly is required in this particular case. I thought the opencv.js file that I downloaded from here https://docs.opencv.org/master/opencv.js was just a JS file that contains the necessary functions (like a lib). How does webassembly come into play here?

Posts: 1

Participants: 1

Read full topic

Migrate Swift/Kotlin/android studio project to IONIC

$
0
0

@cgarib wrote:

Hi, if I already have a swift project, is it possible to migrate it somehow into ionic?. Same question with Kotlin and android studio.

Thanks!

Posts: 1

Participants: 1

Read full topic

Viewing all 49337 articles
Browse latest View live