js 优雅的打印网络请求

在大多数开发中,我们都不可避免的需要发起网络请求,从请求api,到文件上传,有前端发起的请求越来越多,但是网络请求的内容查看,总是有些不方便。

这个时候我结合jsconsole对象,在现有开发的网络请求函数中内嵌了一个打印网络请求信息的小方法,主要是把请求的参数,返回的结果等到进行了打印。

为了优雅的打印,网络请求的信息,最外层我使用console.groupCollapsed() 折叠信息,只显示请求状态和接口核心关键词。

console.groupCollapsed([标志] 接口名字 [接口请求状态]);
console.groupEnd();

随后就是内部的内容了,我在内部使用了console.table(),打印相对规整的请求信息,和返回信息。

内部的table核心就是keyvalue,其他如果有必要显示可以打印,如果没有就不需要打印。

let logData = [{
	key: "action",
	value: ACTION,
	type: typeof ACTION
},
{
	key: "data",
	value: data,
	type: typeof data
},
{
	key: "sta",
	value: res.data.sta,
	type: typeof res.data.sta
},
{
	key: "msg",
	value: res.data.msg,
	type: typeof res.data.msg
},
{
	key: "URL",
	value: URL,
	type: typeof URL
},
{
	key: "timestamp",
	value: timestamp,
	type: typeof timestamp
}];
console.table(logData);

因为在console.table()内打印对象不会很好的显示,我追加了请求信息的表格,没有做其他的处理直接使用了console.table(data)打印。

当然还做简单的判断,如果data为空或者{}的话,会使用console.warn()打印黄色的警告信息(There are no request parameters)。

在最后做了一个简单的判断,如果有错误,就答应红色的错误信息console.error(),如果没有就答应一般信息console.info()

posted @ 2021-01-06 12:05  一生亦木  阅读(216)  评论(0)    收藏  举报