ilias sayagh
ilias sayagh

Reputation: 11

how can I implement a functional nfc plugin on an ionic capacitor app with Angular

I installed this one

npm install phonegap-nfc 
npm install @awesome-cordova-plugins/nfc

and apparently everything was working since my code didn't have any error until I tried to write data on my nfc card. nfc.page.ts:

import { NFC, Ndef } from '@awesome-cordova-plugins/nfc/ngx';

.
.
.
.
.
//this function is triggered when clicking on a button
startNfcListener(){
    this.nfc.addNdefListener().subscribe(this.onNdefTagScanned.bind(this));
  }

  onNdefTagScanned(nfcEvent: any) {
    const record = this.ndef.textRecord("Hello world", "en");  
    const message = [record];

    // write to the tag
    this.nfc.write(message).then(
      _ => console.log('Wrote message to tag'),
      error => console.log('Write failed', error)
    )
  }

app.module.ts:

import { NFC, Ndef } from '@awesome-cordova-plugins/nfc/ngx';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, HttpClientModule],
  providers: [NFC, Ndef, { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }],
  bootstrap: [AppComponent],
})
export class AppModule {}

I tried to run it on Android using Android Studio

npm run build
ionic cap copy
ionic cap sync
ionic cap open android

deploying the app in my phone gave me a flag error which I solved in the nfc plugin file but still the tag wont be written into my card it doesn't give me any specific error.

here the logs when approaching my nfc card

*2023-08-09 01:04:23.249 10059-10059 Capacitor/AppPlugin     io.ionic.starter                     V  Notifying listeners for event pause
2023-08-09 01:04:23.250 10059-10059 Capacitor/AppPlugin     io.ionic.starter                     D  No listeners found for event pause
2023-08-09 01:04:23.250 10059-10059 NfcPlugin               io.ionic.starter                     D  onPause Intent { flg=0x34000000 cmp=io.ionic.starter/.MainActivity }
2023-08-09 01:04:23.250 10059-10059 NfcPlugin               io.ionic.starter                     D  stopNfc
2023-08-09 01:04:23.252 10059-10059 Capacitor               io.ionic.starter                     D  App paused
2023-08-09 01:04:23.252 10059-10059 NfcPlugin               io.ionic.starter                     D  onNewIntent Intent { flg=0x34000000 cmp=io.ionic.starter/.MainActivity }
2023-08-09 01:04:23.253 10059-10147 NfcPlugin               io.ionic.starter                     D  parseMessage Intent { flg=0x34000000 cmp=io.ionic.starter/.MainActivity }
2023-08-09 01:04:23.253 10059-10147 NfcPlugin               io.ionic.starter                     D  action null
2023-08-09 01:04:23.253 10059-10059 ViewRootIm...nActivity] io.ionic.starter                     I  stopped(false) old = false
2023-08-09 01:04:23.253 10059-10059 Capacitor/AppPlugin     io.ionic.starter                     D  Firing change: true
2023-08-09 01:04:23.253 10059-10059 Capacitor/AppPlugin     io.ionic.starter                     V  Notifying listeners for event appStateChange
2023-08-09 01:04:23.253 10059-10059 Capacitor/AppPlugin     io.ionic.starter                     D  No listeners found for event appStateChange
2023-08-09 01:04:23.253 10059-10059 Capacitor/AppPlugin     io.ionic.starter                     V  Notifying listeners for event resume
2023-08-09 01:04:23.253 10059-10059 Capacitor/AppPlugin     io.ionic.starter                     D  No listeners found for event resume
2023-08-09 01:04:23.254 10059-10059 NfcPlugin               io.ionic.starter                     D  onResume Intent { flg=0x34000000 cmp=io.ionic.starter/.MainActivity }
2023-08-09 01:04:23.263 10059-10059 Capacitor               io.ionic.starter                     D  App resumed
2023-08-09 01:04:23.264 10059-10059 MSHandlerLifeCycle      io.ionic.starter                     I  removeMultiSplitHandler: no exist. decor=DecorView@2b0d5d6[MainActivity]*

Upvotes: 1

Views: 1374

Answers (0)

Related Questions