由于公司项目需求,我这里打算的是把后台服务api以文件读写的方式存在本地(项目还是用的Vue),怎么引入cordova以及搭建cordova我这里就省略了。
怎么使用
import { cordovaReadFile } from '@/utils/cordovaplugins'
//deviceready加载完毕 才能访问cordova
document.addEventListener('deviceready', () => {
cordovaReadFile()
}, false)
cordovaplugins.js 封装的读写工具js 大概就是读写文件操作,如果没有访问到文件 就创建并写入,访问到直接就读取。
看官网得知 配置
<preference name="AndroidPersistentFileLocation" value="Internal" />安装的持久化文件在安卓/data/data/<packageId>目录下。
/* eslint-disable */
//配置文件名
const SETTING_FILE_NAME = "setting.json"
const SETTING_FILE_CONTENT = JSON.stringify({
api: process.env.VUE_APP_BASE_API
})
/**
*@desc 写入文件
*@path /data/data/appId/file/file/config
*@author Bob
*@date 2021/04/28 19:07:31
*/
function createWriter(fileEntry, content) {
fileEntry.createWriter(function (fileWriter) {
//文件写入成功
fileWriter.onwriteend = function () {
console.log("Successful file write...");
};
//文件写入失败
fileWriter.onerror = function (e) {
console.log("Failed file write: " + e.toString());
};
//写入文件
fileWriter.write(content)
})
}
/**
*@desc 读取文件
*@path /data/data/appId/file/file/config
*@author Bob
*@date 2021/04/28 19:09:54
*/
function readFile(fileEntry) {
fileEntry.file(function (file) {
const reader = new FileReader()
reader.onloadend = function () {
console.log("file read success:" + this.result);
}
reader.readAsText(file)
})
}
/**
*@desc 判断配置文件是否存在
*@author Bob
*@date 2021/04/28 19:27:26
*/
function settingFileIsExist(dirEntry, fileName) {
return new Promise((resolve, reject) => {
dirEntry.getFile(fileName, {create: false, exclusive: false}, function () {
resolve(true)
}, function () {
resolve(false)
})
})
}
/**
*@desc 创建配置文件
*@author Bob
*@date 2021/04/28 19:40:05
*/
function createSettingFile(dirEntry, fileName, content) {
dirEntry.getFile(fileName, {create: true, exclusive: false}, function (fileEntry) {
createWriter(fileEntry, content)
}, function () {
console.log(fileName + "创建失败")
})
}
/**
*@desc 读取配置文件内容
*@author Bob
*@date 2021/04/28 19:48:15
*/
function readSettingFile(dirEntry, fileName) {
dirEntry.getFile(fileName, {create: false, exclusive: false}, function (fileEntry) {
readFile(fileEntry)
}, function () {
console.log(fileName + "读取失败")
})
}
export function cordovaReadFile () {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function (fs){
fs.root.getDirectory('config', {create: true}, async function(dirEntry) {
//是否存在
const isExist = await settingFileIsExist(dirEntry, SETTING_FILE_NAME)
if(!isExist) {
createSettingFile(dirEntry, SETTING_FILE_NAME, SETTING_FILE_CONTENT)
} else {
readSettingFile(dirEntry, SETTING_FILE_NAME)
}
}, function () {
console.log("config文件夹创建失败")
})
}, function () {
console.log("文件空间读取失败!")
})
}
运行截图
- 文件读取成功
- 文件写入成功