Ionic 3本地存储数据不持久：引导页重复显示如何解决？

嘿，我帮你梳理下这个引导页持久化的问题，看起来你已经尝试了两种存储方案但都踩坑了，咱们一步步来排查解决：

先搞清楚两种存储方案的常见坑点 #

1. @ionic-native/native-storage 重启后丢数据 #

NativeStorage本身是持久化存储（存在应用私有目录，除非卸载/清除应用数据才会丢失），你遇到的问题大概率是使用方式不对：

• 没有等待存储操作完成就跳转页面：存储是异步操作，如果你直接在setItem后立刻跳转，可能数据还没写入磁盘就重启了应用
• 插件安装不完整：确认已经正确安装了cordova插件和npm包

修正后的使用示例：

// 导入NativeStorage并添加到app.module.ts的providers中
import { NativeStorage } from '@ionic-native/native-storage';

// 存储二维码和引导页标记
saveOnboardingData(qrData: string) {
  NativeStorage.setItem('hasSeenOnboarding', true)
    .then(() => NativeStorage.setItem('qrCode', qrData))
    .then(() => {
      // 确认存储完成后再跳转
      this.navCtrl.push(MainPage);
    })
    .catch(err => console.error('存储失败:', err));
}

// 启动时检查
checkOnboarding() {
  NativeStorage.getItem('hasSeenOnboarding')
    .then(() => this.navCtrl.push(MainPage))
    .catch(() => {
      // 没找到数据，显示引导页
      this.showOnboardingPage();
    });
}

2. @ionic/storage 无法存储数据 #

这个问题通常是配置不全或者异步操作没处理好：

• 缺少SQLite驱动：默认Ionic Storage可能使用localStorage，但部分平台（比如iOS）的localStorage可靠性差，建议强制用SQLite作为后端
• 模块未正确导入或初始化

完整配置步骤：

1. 安装依赖：

npm install @ionic/storage --save
ionic cordova plugin add cordova-sqlite-storage

2. 在app.module.ts中配置存储模块：

import { IonicStorageModule } from '@ionic/storage';

@NgModule({
  imports: [
    // ...其他模块
    IonicStorageModule.forRoot({
      name: '__appDB',
      // 优先使用SQLite，保证持久化
      driverOrder: ['sqlite', 'indexeddb', 'websql']
    })
  ]
})

3. 异步方式使用存储：

import { Storage } from '@ionic/storage';

async saveOnboardingData(qrData: string) {
  try {
    await this.storage.set('hasSeenOnboarding', true);
    await this.storage.set('qrCode', qrData);
    // 等待存储完成再跳转
    this.navCtrl.push(MainPage);
  } catch (err) {
    console.error('存储失败:', err);
  }
}

async checkOnboarding() {
  const hasSeen = await this.storage.get('hasSeenOnboarding');
  if (hasSeen) {
    this.navCtrl.push(MainPage);
  } else {
    this.showOnboardingPage();
  }
}

额外排查技巧 #

• 在platform.ready()之后执行所有存储操作：确保平台和存储模块完全初始化
• 加日志测试：存储后立即读取数据，重启应用后再读取，看数据是否存在，定位是存储还是读取的问题
• 检查应用权限：Android平台确保应用有存储权限（不过NativeStorage和SQLite都是私有存储，一般不需要额外权限）

内容的提问来源于stack exchange，提问作者Kim Ruan