Cordova安卓与iOS平台：打包数据文件的目录及读取方法

一、文件存放位置（无需改动） #

继续将数据文件放在www/data/目录下即可。这个目录是Cordova应用的内置资源目录，会被打包进Android APK和iOS IPA中，属于应用只读资源，完全适合存放几KB到几十KB的静态文本/JSON数据。

二、跨平台读取方案（适配浏览器模拟器+真机） #

核心问题在于不同环境的协议差异：浏览器模拟器用http://localhost协议，AJAX可直接访问；iOS真机/官方模拟器用file://协议，AJAX会触发跨域限制，需用Cordova File插件读取。我们需要区分环境做适配：

修正后的完整代码

function ReadAppBundleFile(fileName, successfn, errorfn = null) {
    // 区分Cordova真机环境与浏览器模拟器环境
    if (window.cordova) {
        // 真机/官方模拟器：使用File插件读取file://协议路径
        const pathToFile = cordova.file.applicationDirectory + 'www/data/' + fileName;
        console.log("真机读取路径: ", pathToFile);
        
        window.resolveLocalFileSystemURL(pathToFile, fileEntry => {
            fileEntry.file(file => {
                const reader = new FileReader();
                reader.onloadend = () => {
                    try {
                        const parsedData = JSON.parse(reader.result);
                        successfn(parsedData);
                    } catch (parseError) {
                        errorfn?.(new Error(`JSON解析失败: ${parseError.message}`));
                    }
                };
                reader.onerror = err => errorfn?.(new Error(`文件读取错误: ${err.message}`));
                reader.readAsText(file);
            }, err => errorfn?.(new Error(`获取文件句柄失败: ${err.message}`)));
        }, err => errorfn?.(new Error(`解析文件路径失败: ${err.message}`)));
    } else {
        // 浏览器模拟器：使用AJAX/fetch读取http协议路径
        const ajaxUrl = `./data/${fileName}`;
        console.log("浏览器读取路径: ", ajaxUrl);
        
        fetch(ajaxUrl)
            .then(res => {
                if (!res.ok) throw new Error(`请求失败: ${res.status}`);
                return res.text();
            })
            .then(text => {
                try {
                    const parsedData = JSON.parse(text);
                    successfn(parsedData);
                } catch (parseError) {
                    errorfn?.(new Error(`JSON解析失败: ${parseError.message}`));
                }
            })
            .catch(err => errorfn?.(new Error(`AJAX读取失败: ${err.message}`)));
    }
}

关键细节说明

1. 环境判断：通过window.cordova是否存在区分真机和浏览器模拟器，避免在浏览器环境调用File插件API导致的URI格式错误。
2. 路径适配：
   • 真机下cordova.file.applicationDirectory返回iOS的file:///var/containers/Bundle/Application/.../MyApp.app/或Android的file:///android_asset/，拼接后是合法的file协议路径。
   • 浏览器模拟器下用相对路径./data/${fileName}，因为此时页面根目录对应www/，可直接访问子目录资源。
3. 错误处理：补充了JSON解析、文件读取、网络请求各环节的错误捕获，方便调试定位问题。

三、前置检查 #

确保已正确安装Cordova File插件：

cordova plugin add cordova-plugin-file

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