@didinj wrote:

Posts: 1

Participants: 1

Read full topic

@StoRmtec wrote:

Hello
I become an new Workspace in my Company. So that is install a new nodejs Version. 12.4.0
When i clone my Ionic Project and while add the Platform Android i become always this error.

[cordova-res]
[cordova-res] Something went wrong installing the “sharp” module
[cordova-res]
[cordova-res] The module ‘\?\C:\Users\martin.kuenz\AppData\Roaming\npm\node_modules\cordova-res\node_modules\sharp\build\Release\sharp.node’
[cordova-res] was compiled against a different Node.js version using
[cordova-res] NODE_MODULE_VERSION 57. This version of Node.js requires
[cordova-res] NODE_MODULE_VERSION 72. Please try re-compiling or re-installing
[cordova-res] the module (for instance, using npm rebuild or npm install).
[cordova-res]
[cordova-res] - Ensure the version of Node.js used at install time matches that used at runtime
[cordova-res] - Consult the installation documentation at https://sharp.pixelplumbing.com/en/stable/install/
[cordova-res] - Search for this error at https://github.com/lovell/sharp/issues
[cordova-res]

Can anybode help me? Thx

Posts: 1

Participants: 1

Read full topic

@krishkk wrote:

Hey anyone play RTSp url in ionic framework. I use streaming media but that is only compatible with android version > 9 and not working for all android version greater than 6 also. I need a plugin that work for all the android versions. Please suggest me.
Thanks

Posts: 1

Participants: 1

Read full topic

@Seikida wrote:

Hello

I need your help for my project.

1. I installed the plugin: In App Browser https://ionicframework.com/docs/native/in-app-browser
   Documentation is here: https://github.com/apache/cordova-plugin-inappbrowser

2. Dynamically, I created an HTML page in this directory: this.file.dataDirectory

3. I try to load this page on the webview like this:

IMPORT

import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';

CONSTRUCTOR

constructor(private iab: InAppBrowser) {}

MY CODE

const browser = this.iab.create( this.webview.convertFileSrc( this.file.dataDirectory + 'jojo/index.html' ) );

Everything is ok and there aren’t problems. My page jojo/index.html can load.

The page is load in the Cordova WebView

If I don’t mistake, because I don’t set the “target” value (the value is still “_self”) my page jojo/index.html is load in the Cordova WebView. Right ?

Reference:

Sp77i.png893×139

So … on my page, I want to use ionic functions (or cordova functions).

How can I do that ?

My config

This is my configuration:

Ionic:

   ionic (Ionic CLI)             : 4.12.0 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.4.2
   @angular-devkit/build-angular : 0.13.9
   @angular-devkit/schematics    : 7.3.9
   @angular/cli                  : 7.3.9
   @ionic/angular-toolkit        : 1.5.1

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.4, ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.0.1, (and 11 other plugins)

System:

   Android SDK Tools : 26.1.1 (/Users/jojo/Library/Android/sdk)
   ios-deploy        : 2.0.0
   NodeJS            : v11.10.0 (/usr/local/bin/node)
   npm               : 6.9.0
   OS                : macOS Mojave
   Xcode             : Xcode 10.2.1 Build version 10E1001

Thank you so much for your help.

Posts: 1

Participants: 1

Read full topic

@jerteach wrote:

When I type cordova --help I get a fair bit of information of commands to try and test out.

cordova --help

cordova command [options]

Global Commands
    create ............................. Create a project
    help ............................... Get help for a command
    telemetry .......................... Turn telemetry collection on or off
    config ............................. Set, get, delete, edit, and list global cordova options

Project Commands
    info ............................... Generate project information
    requirements ....................... Checks and print out all the requirements
                                            for platforms specified

    platform ........................... Manage project platforms
    plugin ............................. Manage project plugins

    prepare ............................ Copy files into platform(s) for building
    compile ............................ Build platform(s)
    clean .............................. Cleanup project from build artifacts

    run ................................ Run project
                                            (including prepare && compile)
    serve .............................. Run project with a local webserver
                                            (including prepare)

Learn more about command options using 'cordova help <command>'

Aliases
    build -> cordova prepare && cordova compile
    emulate -> cordova run --emulator

Options
    -v, --version ...................... prints out this utility's version
    -d, --verbose ...................... debug mode produces verbose log output for all activity,
    --no-update-notifier ............... disables check for CLI updates
    --nohooks .......................... suppress executing hooks
                                         (taking RegExp hook patterns as parameters)

Examples
    cordova create myApp org.apache.cordova.myApp myApp
    cordova plugin add cordova-plugin-camera
    cordova platform add android
    cordova plugin add cordova-plugin-camera --nosave
    cordova platform add android --nosave
    cordova requirements android    
    cordova build android --verbose
    cordova run android
    cordova build android --release -- --keystore="..\android.keystore" --storePassword=android --alias=mykey
    cordova config ls

But when I type capacitor --help I get very little information and no examples. Does anyone have any command line examples that I can try out to see how things work?

I know the main page at https://capacitor.ionicframework.com/docs/android/custom-code/ has lots of code, but there has to be a few main command line examples that can be written in a few lines. even capacitor create --help does not give much more information and has no examples.

Could someone reply with a few command line capacitor examples they have tried!

capacitor --help

Usage: capacitor [options] [command] <command>

Options:
  -V, --version                             output the version number
  -h, --help                                output usage information

Commands:
  create [options] [directory] [name] [id]  Creates a new Capacitor project
  init [options] [appName] [appId]          Initializes a new Capacitor project in the current directory
  serve                                     Serves a Capacitor Progressive Web App in the browser
  sync [platform]                           updates + copy
  update [platform]                         updates the native plugins and dependencies based in package.json
  copy [platform]                           copies the web app build into the native app
  open [platform]                           opens the native project workspace (xcode for iOS)
  add [platform]                            add a native platform project
  ls [platform]                             list installed Cordova and Capacitor plugins
  doctor [platform]                         checks the current setup for common errors
  plugin:generate                           start a new Capacitor plugin

Posts: 1

Participants: 1

Read full topic

@alim1990 wrote:

I am trying to make a product comparison page in my ionic app. The first section should be the main specs titles (name, price, ram,…). So I figure out a way by using multiple ion-slides inside ion-slides, which worked perfectly before looping the array of products.

Here is the code:

<div>
  <ion-slides slidesPerView="5">
    <ion-slides slidesPerView="1" class="slideWidth" >
      <ion-slide>
          <ion-item class="slide_height">
              <ion-label><b>Logo</b></ion-label>
            </ion-item>
        <ion-item>
          <ion-label><b>Product</b></ion-label>
        </ion-item>
        <ion-item>
          <ion-label><b>Company</b></ion-label>
        </ion-item>
        <ion-item>
          <ion-label><b>Price</b></ion-label>
        </ion-item>
        <ion-item>
          <ion-label><b>Discount</b></ion-label>
        </ion-item>
        <ion-item>
          <ion-label><b>Final Price</b></ion-label>
        </ion-item>
        
      </ion-slide>
    </ion-slides>
    <ion-slides slidesPerView="2" pager paginationType="progress">
      <ion-slide *ngFor="let offer of array; let i = index">
          <ion-item>
        <img class="brand_logo" [src]="url">
            </ion-item>
        <ion-item>
          <ion-label>{{offer.product}}</ion-label>
        </ion-item>
        <ion-item>
          <ion-label>{{offer.cname}}</ion-label>
        </ion-item>
        <ion-item>
          <ion-label>{{offer.price}} $</ion-label>
        </ion-item>
        <ion-item>
          <ion-label>{{offer.discount}} %</ion-label>
        </ion-item>
        <ion-item>
          <ion-label>{{offer.price-offer.price*(offer.discount)/100}} $</ion-label>
        </ion-item>
        
      </ion-slide>
    </ion-slides>
  </ion-slides>
  </div>

Here is a stackblitz. The ion-items are not well aligned with each other, between the main fix ion-slide and the others generated in a for loop.

P.S.: Using ion-grid with ion-col and ion-row produced the same effect.

Posts: 1

Participants: 1

Read full topic

@vishalgupta29 wrote:

Doubt.jpg1366×946 142 KB

I want to create a background like this. But I don’t know how to do it. Anyone plz help.

Posts: 1

Participants: 1

Read full topic

@sandhyasuman wrote:

Ionic version:
ionic 4.0

Current behavior:

I am trying to create a ionic react app, using my custom cordova plugin.
I use https://ionicframework.com/blog/ionic-cli-v5-brings-react-beta-support/ to create the app. After adding cordova plugin and running ionic build/cordova prepare for ios the www folder is empty.
compared to ionic react app, if i create app for target angular it fills www folder correctly.

Expected behavior:
ionic build/cordova prepare should add desired file including index.html to www folder which is not happening fo rreact-ionic app.

Steps to reproduce:
ionic start myApp --type=react
ionic cordova plugin list
ionic cordova plugin add cordova-plugin-custom => add cordova dependencies
ionic cordova platform ios => add www folder but empty
ionic cordova build ios
ionic cordova prepare ios => www folder is still empty
ionic cordova run ios => throws an error saying www/index.html not found.

Other information:
If I execute same steps as above except first line as ionic start myApp --type=angular, it shows www folder correctly including index.html and works fine.

Ionic:

Ionic CLI : 5.0.2 (/usr/local/lib/node_modules/ionic)
Ionic Framework : @ionic/react 0.0.5

Cordova:

Cordova CLI : 8.1.1 (cordova-lib@8.1.0)
Cordova Platforms : ios 4.5.5
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.0, (and 4 other plugins)

Utility:

cordova-res : 0.5.1
native-run : 0.2.7

System:

NodeJS : v8.10.0 (/usr/local/bin/node)
npm : 6.9.0
OS : macOS Mojave
Xcode : Xcode 10.2.1 Build version 10E1001

Posts: 1

Participants: 1

Read full topic

@bc_uk wrote:

I am developing an Ionic (v5) mobile app that uses the Cordova Oracle Mobile Cloud SDK. However, there is an issue with making HTTPS requests to the Oracle Mobile Hub - it’s the familiar CORS issue. However, because mobile client requests can come from any domain/IP range, it doesn’t seem possible to add a CORS whitelist to the Mobile Hub server. I tried adding the Access-Control-Allow-Origin headers to my server request code on the server (node.js) but the issue occurs at the authentication stage, before the requests even hit my node.js code. The solution is to add a CORS whitelist to the server environment, but as already mentioned, there’s no set domains where requests can come from.

With all that in mind, I have been looking at Capacitor as a possible solution by installing the Android Oracle Mobile Cloud SDK. Would this circumvent the problems of the request coming from a webview? There’s a note on the Capacitor docs under Android Development, which states the following:

Also, Capacitor requires an Android WebView with Chrome version 50 or later. On Android 5 and 6, the Capacitor uses the System WebView. On Android 7+, Google Chrome is used.

I’m not sure how to interpret that. Any help much appreciated.

Posts: 1

Participants: 1

Read full topic

@aayush2589 wrote:

I am using ionic 4 and using the command
ionic cordova build android
after creating the build i am running that build on android studio 3.4.1 but it is not working.
Can anyone help me what to do , when i was running on studio 3.0.1 it was fine but for android studio 3.4.1 it is not working.
Is there anyone who faced this problem please share the solution.

Posts: 1

Participants: 1

Read full topic

@sahiwala wrote:

Dear All

I have one Form with input field username and one submit button

I want to validate for required field before clicking submit button

How do i do this ?

Please answer in Ionic 4 with sample code and understanding less code

Regards
Shabbir Sahiwala

Posts: 2

Participants: 2

Read full topic

@Marko-Matijevic wrote:

Hello, I am making an ionic app for iOS which uses IndexedDB as persistent storage. I have read that iOS when on low memory deletes persistent storage. Is that true?? There is not much about it on the Internet. Thanks

Posts: 1

Participants: 1

Read full topic

@djtenssy wrote:

I’m using the google maps plugin and I want to change the map type. In options I have the following, but it doesn’t work, I have changed it to different types but always appears the same type of map:

let opciones: GoogleMapOptions = {
            mapType: GoogleMapsMapTypeId.SATELLITE,
            controls: {
                compass: false,
                zoom: true,
                myLocationButton: true,
                myLocation: true
            },
            styles: this.style
        };

How can I change the map type?
Thank you.

Posts: 1

Participants: 1

Read full topic

@iwon wrote:

How to avoid duplicate event subscribe in lazy load.

Posts: 1

Participants: 1

Read full topic

@osolemio wrote:

i built an app using PayPal plugin for Cordova/Ionic Applications (https://github.com/paypal/PayPal-Cordova-Plugin) but payments with credit cards doesn’t work. Every attempt i made the reply is "Merchant doen’st accept this kind of payment (in italian: "il commerciante non accetta questo tipo di pagamento). I’m not able to solve this issue. Seeing the logs of the app i read “payment canceled”.
Is there someone that knows something about thie issue?

Posts: 1

Participants: 1

Read full topic

@VictorNorman wrote:

Can someone give me an example of how to pull convertFileSrc() from Capacitor instead of using the one from cordova?

I need this because if I use the cordova one, then I cannot run my code in the browser anymore – because cordova.js does not support the browser.

Thanks.

Posts: 1

Participants: 1

Read full topic

@Maestropikal wrote:

Hi all,

I’m facing a wall right now trying to implement SSO with MS-ADAL module in my Ionic application.

I just can’t get a valid authenticationContext using Microsoft Azure AD, in which I registered my application.

I can’t know if this is because I didn’t set all parameters on Azure portal correctly (I tried to find a clear tutorial on it, found many many super complicated ones, not even one close enough to S-I-M-P-L-E )

Herebelow is my code :

import { Injectable } from '@angular/core';
import { JwtHelperService } from '@auth0/angular-jwt';
import { Platform} from 'ionic-angular';

import { MSAdal, AuthenticationContext } from '@ionic-native/ms-adal';

import { environment as env } from '../environments/environment';
...
@Injectable()
export class AuthService {
  constructor(
    private msAdal: MSAdal,
    private jwtHelper: JwtHelperService,
    private platform: Platform,
    //private AuthContxt: AuthenticationContext
  ) {
    console.log("auth.service.ts constructor");
    platform.ready().then(() => {
      console.log('Activate ADAL logger');
      
      //Microsoft.ADAL.AuthenticationSettings.setLogger(logItem => {
      //  console.log(`ADAL: ${logItem.message}`, logItem);
      //});
    });
  }

public async authenticate(): Promise<boolean> {
    
    await this.platform.ready();
        
    const authContext = this.msAdal.createAuthenticationContext(
      env.adAuthority,
      false
    );
...

And as for the environment is concerned here is part of the file :

export const environment = {
  //adAuthority: 'https://login.microsoftonline.com/common',
  adAuthority: 'https://login.windows.net/common',

  //adResourceUri: 'https://management.azure.com/',
  adResourceUri: 'https://graph.windows.net',

  adClientId: '<<<here is the client id I took from Azure portal>>>',

  adRedirectUri: 'https://localhost:8100/',
 
  // -------------------------------------
  // partie dédiee a la connexion a l'API
  // -------------------------------------
...
};

Is my adAuthority wrong ? tried the login.microsoftonline.com/common but it returns a 404 in chrome when I put it as a URL …

Indeed the error is that my ‘authContext’ is undefined which leads logically to nothing when trying to get tokens afterwards

Posts: 1

Participants: 1

Read full topic

@nagarajsabhahith wrote:

How to check current page is root page or forwarded page in ionic 4,

On device back button press i want show alert before closing app

this.platform.backButton.subscribe(async () => {
    if (status) { // I WANT TO MAKE THIS STATUS TRUE ONLY IF APP VIEW IS ON ROOT PAGE
      const alert = await this.alertController.create({
        header: 'Confirm!',
        message: 'Are you sure? Do you want to exit app?',
        buttons: [
          {
            text: 'Cancel',
            role: 'cancel',
            handler: (blah) => {
            }
          }, {
            text: 'Exit',
            handler: () => {
              navigator['app'].exitApp();
            }
          }
        ]
      });
      await alert.present();
    }
  });

Posts: 1

Participants: 1

Read full topic

@lalitk wrote:

I have created iframe youtube video slider. it contain 3 slider youtube video. it’s run very well but when i play any one youtube video and go to another page then video doesn’t stop.

audio doesn’t stop and when i come back to same page then video slider rendering again but first one audio is continue played. how to pause or stop them??

Any one have an idea regarding my question??

Posts: 1

Participants: 1

Read full topic

@lucasmc20 wrote:

Hi all, I’m having a hard time on the iframe part of the ionic.

I’ve created an iframe to load my page, it loads everything, however the ads (adsense) of the page does not appear, the space is blank and shows nothing. I have already tried making changes with css and nothing works.
I have adbmod also configured in the app.

Netflix.page.ts

import { Component, OnInit, Input  } from '@angular/core';
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
import { NavController } from '@ionic/angular';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';

@Component({
  selector: 'app-home',
  templateUrl: 'netflix.page.html',
  styleUrls: ['home.page.scss'],
})
//export class Netflix implements OnInit{
export class Netflix {
  url: any;
  constructor(private sanitize: DomSanitizer){
    this.url = sanitize.bypassSecurityTrustResourceUrl("https://streamingsbrasil.com/category/netflix/amp");
  }

}

page.html

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button text="Voltar" defaultHref="home"></ion-back-button>
    </ion-buttons>

    <ion-title>
      Netflix
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <iframe scrolling="yes" style="z-index: 9999 !important;width: 100%;height: 79vh;position: fixed !important;" [src]="url"></iframe>
</ion-content>

<ion-tabs>
  <ion-tab-bar slot="bottom">
    <ion-tab-button href="/netflix/netflixlancamento">
      <ion-icon name="rocket"></ion-icon>
      <ion-label>Lançamentos</ion-label>
    </ion-tab-button>

    <ion-tab-button href="/netflix/netflixnoticias">
      <ion-icon name="paper"></ion-icon>
      <ion-label>Notícias</ion-label>
    </ion-tab-button>

    <ion-tab-button href="/netflix/netflixdicas">
      <ion-icon name="apps"></ion-icon>
      <ion-label>Dicas</ion-label>
    </ion-tab-button>
    <ion-tab-button href="/netflix/netflixremovidos">
      <ion-icon name="trash"></ion-icon>
      <ion-label>Removidos</ion-label>
    </ion-tab-button>
  </ion-tab-bar>
</ion-tabs>

Posts: 1

Participants: 1

Read full topic