uniapp添加操作日志的方法(uniapp、日志、文件、html5+)
前言
最近在做uniapp的項目,由于項目場景比較復雜,在處理售后問題的時候發(fā)現(xiàn)僅通過后端請求日志無法滿足需求,于是便開始寫一個前端保存操作日志的方法。
一、使用方法:
1、全局引入(main.js)
import {LogCat} from './utils/LogCat.js'
Vue.prototype.$LogCat = LogCat2、初始化日志存儲路徑(App.vue)
onLaunch: function() {
this.$LogCat.init()
}3、參數(shù)
調(diào)用this.$LogCat.d(tag,msg)方法
| 參數(shù) | 說明 | 數(shù)據(jù)類型 | 默認值 |
| tag | 日志標簽,默認會在標簽后面追加“:” | string | |
| msg | 日志內(nèi)容 | string、object、array | '' |
4、Vue文件中使用
methods:{
handleClick() {
let data = {
name:'張三',
age:18
}
this.$LogCat.d('點擊了',data) //2023-04-20 14:15:30 點擊了:{name:'張三',age:18}
}
}二、JS代碼如下:
export const LogCat = {
main: plus.android.runtimeMainActivity(),
Environment: plus.android.importClass('android.os.Environment'),
BufferedWriter: plus.android.importClass('java.io.BufferedWriter'),
File: plus.android.importClass('java.io.File'),
FileOutputStream: plus.android.importClass('java.io.FileOutputStream'),
OutputStreamWriter: plus.android.importClass('java.io.OutputStreamWriter'),
LogPath: '', //日志存儲目錄
saveDays: 7, //日志最大存儲天數(shù)
init: function() {
if (this.Environment.MEDIA_MOUNTED || !this.Environment.isExternalStorageRemovable()) {
this.LogPath = this.main.getExternalFilesDir(null).getPath();
} else {
this.LogPath = this.main.getFilesDir().getPath();
}
let fileManager = new this.File(this.LogPath);
let files = fileManager.listFiles()
let now = new Date();
let maxSavedDay = utils.getFormatDate(now - this.saveDays * 24 * 60 * 60 * 1000)
// 遍歷目錄下的日志文件,并刪除日志最大存儲天數(shù)前的日志
for (var i in files) {
let name = files[i].getName().split('.')[0],
time = name.split('_')[1]
if (time <= maxSavedDay && name.search('log_') == 0) {
files[i].delete()
}
}
console.log('LogPath->', this.LogPath);
},
d: function(tag, msg = '') {
let now = new Date();
let date = utils.getFormatDate(now);
let datetime = utils.getFormatDateTime(now);
msg = (typeof msg !== 'string' ? JSON.stringify(msg) : msg);
//文件名
let fileName = this.LogPath + "/log_" + date + ".txt"
//寫入的內(nèi)容
let content = `\n${datetime} ${tag}${msg ? ':'+msg : msg}\n`;
let file = new this.File(this.LogPath);
if (!file.exists()) {
file.mkdirs(); //創(chuàng)建父路徑
}
let fos = null;
let bw = null;
try {
fos = new this.FileOutputStream(fileName, true);
bw = new this.BufferedWriter(new this.OutputStreamWriter(fos));
//bw.write(log);
bw.append(content);
} catch (e) {
console.log('e->', e);
} finally {
try {
if (bw != null) {
bw.close(); //關(guān)閉緩沖流
fos.close(); //關(guān)閉文件輸出流
}
} catch (closeEx) {
console.log('closeEx->', closeEx);
}
}
}
}
export const utils = {
getFormatDate: (dateString) => {
const date = new Date(dateString);
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
month = month > 9 ? month : '0' + month;;
day = day > 9 ? day : '0' + day;
return `${year}-${month}-${day}`;
},
getFormatDateTime: (dateString) => {
const date = new Date(dateString);
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
let hour = date.getHours();
let min = date.getMinutes();
let second = date.getSeconds();
month = month > 9 ? month : '0' + month;;
day = day > 9 ? day : '0' + day;
hour = hour > 9 ? hour : '0' + hour;
min = min > 9 ? min : '0' + min;
second = second > 9 ? second : '0' + second;
return `${year}-${month}-${day} ${hour}:${min}:${second}`;
}
}三、說明
默認配置了日志最大存儲時間(saveDays)為7天,可自行修改
四、文章參考
https://ext.dcloud.net.cn/plugin?id=1816
總結(jié)
到此這篇關(guān)于uniapp添加操作日志(uniapp、日志、文件、html5+)的文章就介紹到這了,更多相關(guān)uniapp添加操作日志內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript中Obfuscator命令行使用超詳細教程
這篇文章主要介紹了JavaScript中Obfuscator命令行使用的相關(guān)資料,javascript-obfuscator是JavaScript混淆工具,用于保護源碼和反爬蟲,支持命令行操作,可配置壓縮、控制流扁平化、字符串加密等選項,需要的朋友可以參考下2025-06-06
能說明你的Javascript技術(shù)很爛的五個原因分析
Javascript在互聯(lián)網(wǎng)上名聲很臭,但你又很難再找到一個像它這樣如此動態(tài)、如此被廣泛使用、如此根植于我們的生活中的另外一種語言2011-10-10
解析javascript瀑布流原理實現(xiàn)圖片滾動加載
這篇文章主要幫助大家解析javascript瀑布流原理,實現(xiàn)js圖片滾動加載2016-03-03
JavaScript高級程序設(shè)計閱讀筆記(六) ECMAScript中的運算符(二)
ECMAScript中的運算符,學習js的朋友可以參考下2012-02-02

