在Ionic Capacitor+Angular中使用NFC插件写入标签失败求助

问题背景 #

在Ionic Capacitor+Angular项目中集成NFC功能，已安装插件：

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

代码无语法错误，但写入NFC卡失败，已解决插件的flag错误，但仍无法写入且无明确错误提示。相关代码及运行信息如下：

核心代码 #

nfc.page.ts

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

// 点击按钮触发此函数
startNfcListener(){
    this.nfc.addNdefListener().subscribe(this.onNdefTagScanned.bind(this));
}

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

    // 写入标签
    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 {}

运行步骤 #

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

接近NFC卡时的日志片段 #

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]

解决方案 #

1. 检查NFC标签兼容性与状态 #

• 确认标签支持NDEF格式：老旧的Mifare Classic等标签不支持NDEF，需更换Mifare Ultralight等兼容标签。
• 检查标签是否锁定：部分标签出厂或被写入后锁定，无法修改，可通过第三方NFC工具APP检测标签可写状态。

2. 调整写入逻辑与时机 #

Android系统检测到NFC标签时会优先触发系统级处理，导致APP失去标签控制权，需修改写入逻辑：

• 改为主动触发写入流程，先确保NFC开启并禁用系统默认处理：

async startNfcWriter() {
  try {
    await this.nfc.enabled();
    // 禁用系统默认NFC处理，确保APP获取标签控制权
    await this.nfc.disableForegroundDispatch();
    // 等待用户触碰标签，触发写入
    const message = [this.ndef.textRecord("Hello world", "en")];
    await this.nfc.write(message);
    console.log('写入成功');
  } catch (error) {
    console.error('写入失败', error);
  }
}

• 避免在addNdefListener回调中写入，改为点击按钮后等待用户触碰标签。

3. 完善Android权限与配置 #

• 在AndroidManifest.xml中添加必要权限：

<uses-permission android:name="android.permission.NFC" />
<uses-feature android:name="android.hardware.nfc" android:required="true" />

• 添加NFC事件捕获的intent filter，确保APP优先处理NFC标签：

<intent-filter>
    <action android:name="android.nfc.action.NDEF_DISCOVERED" />
    <category android:name="android.intent.category.DEFAULT" />
    <data android:mimeType="text/plain" />
</intent-filter>
<intent-filter>
    <action android:name="android.nfc.action.TECH_DISCOVERED" />
</intent-filter>
<meta-data android:name="android.nfc.action.TECH_DISCOVERED"
           android:resource="@xml/nfc_tech_filter" />

• 在res/xml目录创建nfc_tech_filter.xml，声明支持的NFC技术：

<resources xmlns:xliff="urn:oasis:names:tc:xliff:document:1.2">
    <tech-list>
        <tech>android.nfc.tech.Ndef</tech>
        <tech>android.nfc.tech.NdefFormatable</tech>
    </tech-list>
</resources>

4. 增强调试日志 #

• 在onNdefTagScanned中打印完整事件详情，确认是否正确获取标签对象：

onNdefTagScanned(nfcEvent: any) {
  console.log('NFC事件详情:', JSON.stringify(nfcEvent));
  // ... 原有写入逻辑
}

• 在Android Studio Logcat中过滤NfcPlugin关键词，查看底层执行日志。

5. 修复插件兼容性问题 #

• 检查插件版本是否匹配，避免版本冲突：

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

• 重新安装插件并同步项目：

npm uninstall phonegap-nfc @awesome-cordova-plugins/nfc
npm install phonegap-nfc @awesome-cordova-plugins/nfc
ionic cap sync

内容的提问来源于stack exchange，提问作者ilias sayagh