如何将Cordova WebView 1.x本地存储迁移到Capacitor 4.x Android应用

针对你从Ionic 3（cordova-plugin-ionic-webview v1.1.16，file:///源LocalStorage）迁移到Ionic 6+Capacitor 4.3.0（http源LocalStorage）的数据丢失问题，以下是几个可行的迁移方案：

方案一：通过Capacitor Filesystem读取旧LocalStorage文件并导入 #

旧版Cordova WebView的LocalStorage以SQLite格式存储在App沙盒内的特定文件中，可通过Capacitor的Filesystem插件读取该文件，解析后导入新的LocalStorage。

步骤： #

1. 安装依赖

   • 安装Capacitor Filesystem插件：

     npm install @capacitor/filesystem
     npx cap sync
     

   • 安装SQLite解析库（用于读取LocalStorage的SQLite文件）：

     npm install sql.js
     

2. 定位旧LocalStorage文件路径

   • Android：路径为app_webview/Local Storage/file__0.localstorage，对应Directory.Data目录
   • iOS：路径为WebKit/LocalStorage/file__0.localstorage，对应Directory.Library目录

3. 编写迁移逻辑
   在App启动初期（如AppComponent的ngOnInit）执行以下代码：

   import { Filesystem, Directory, Encoding } from '@capacitor/filesystem';
   import initSqlJs from 'sql.js';
   
   async function migrateLegacyLocalStorage() {
     // 避免重复迁移
     if (localStorage.getItem('ls_migrated') === '1') return;
   
     try {
       // 读取旧LocalStorage文件（以Android为例，iOS需调整path和directory）
       const fileResult = await Filesystem.readFile({
         path: 'app_webview/Local Storage/file__0.localstorage',
         directory: Directory.Data,
         encoding: Encoding.Base64
       });
   
       // 转换为SQL.js可处理的二进制格式
       const binaryData = new Uint8Array(atob(fileResult.data).split('').map(c => c.charCodeAt(0)));
   
       // 初始化SQL.js（建议将wasm文件打包到本地，避免CDN依赖）
       const SQL = await initSqlJs({
         locateFile: file => `./assets/sqljs/${file}` // 将sql-wasm.wasm放在assets/sqljs目录
       });
   
       // 加载数据库并查询所有键值对
       const db = new SQL.Database(binaryData);
       const queryResult = db.exec('SELECT key, value FROM ItemTable');
       
       if (queryResult.length > 0) {
         const entries = queryResult[0].values;
         entries.forEach(([key, value]) => {
           localStorage.setItem(key, value);
         });
       }
   
       // 标记迁移完成
       localStorage.setItem('ls_migrated', '1');
       console.log('LocalStorage迁移成功');
     } catch (err) {
       console.error('迁移失败:', err);
     }
   }
   
   // 启动时执行迁移
   migrateLegacyLocalStorage();
   

4. 部署SQL.js的Wasm文件
   将sql.js的sql-wasm.wasm文件复制到项目的assets/sqljs目录，并确保在angular.json中配置该目录的资源打包规则。

方案二：发布过渡版本先同步数据到原生存储 #

如果旧版App仍可推送更新，可先发布一个过渡版本，将旧LocalStorage数据同步到原生存储，再由新版App读取并导入。

步骤： #

1. 给旧Ionic 3 App添加原生存储插件（如cordova-plugin-preferences或cordova-plugin-settings）
2. 过渡版本启动时，遍历旧LocalStorage的所有键值对，存入原生存储
3. 新版Ionic 6+Capacitor App启动时，通过@capacitor/preferences读取原生存储中的数据，写入新LocalStorage，标记迁移完成

方案三：Android端手动复制存储文件（风险较高） #

Android上Capacitor WebView的http源LocalStorage文件路径为app_webview/Local Storage/http_{域名}_0.localstorage，可尝试在App启动时将旧的file__0.localstorage复制到该路径。但需注意：

• 需处理文件锁定问题（WebView可能正在占用目标文件）
• 仅适用于Android，iOS沙盒限制无法直接操作该路径
• 权限问题：需确保App拥有访问自身沙盒目录的权限（默认已具备）

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