javascript技巧

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript技巧 > uniapp添加操作日志

uniapp添加操作日志的方法(uniapp、日志、文件、html5+)

作者：林夕小哥哥

近期一直在写微信小程序,有一个问题一直没有解决,就是在测试环境中调试代码会打印很多日志,方便看到问题所在,这篇文章主要给大家介绍了关于uniapp添加操作日志(uniapp、日志、文件、html5+)的相关资料,需要的朋友可以参考下

前言

最近在做uniapp的项目，由于项目场景比较复杂，在处理售后问题的时候发现仅通过后端请求日志无法满足需求，于是便开始写一个前端保存操作日志的方法。

一、使用方法：

1、全局引入（main.js）

import {LogCat} from './utils/LogCat.js'
Vue.prototype.$LogCat = LogCat

2、初始化日志存储路径（App.vue）

 onLaunch: function() {
    this.$LogCat.init()
}

3、参数

 调用this.$LogCat.d(tag,msg)方法

参数说明数据类型默认值
tag日志标签，默认会在标签后面追加“：”string
msg日志内容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,   //日志最大存储天数
  
  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)
    // 遍历目录下的日志文件,并删除日志最大存储天数前的日志
    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"
    //写入的内容
    let content = `\n${datetime} ${tag}${msg ? ':'+msg : msg}\n`;

    let file = new this.File(this.LogPath);
    if (!file.exists()) {
      file.mkdirs(); //创建父路径
    }
    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(); //关闭缓冲流
          fos.close(); //关闭文件输出流
        }
      } 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

总结

到此这篇关于uniapp添加操作日志(uniapp、日志、文件、html5+)的文章就介绍到这了,更多相关uniapp添加操作日志内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

阅读全文