业务场景

今天上班，老板让我查个bug ，说甲方提出一个疑问：推送页面第一行数据的【是否需要超限提示】栏显示不对，不应该是显示"否"，而需要显示"是"。

这个界面是已经离职的同事做的，本着不看别人代码的原则，我猜一定是接口数据异常！于是，我打开控制台，梳理了接口的返回值：

js 复制代码

{
	"content":{
		"currPage":1,
		"list":[
			{
				"alarmDurationTime":"30",
				"createTime":"20230607112750",
				"createUser":"RY1539551643334680578",
				"deptId":"BM1671075409042526209",
				"deptName":"工程部",
				"id":16,
				"overrunTime":"90"，
				"positionId":"GW1541311742399029250",
				"positionName":"工程经理（能源）",
				"season":2,
				"seasonName":"空调季",
				"updateTime":"20230621150155",
				"updateUser":"RY1539551643334680578",
				"valid":"1",
			},
			{
				"addPrompt":"2",
				"alarmDurationTime":"30",
				"createTime":"20230607112750",
				"createUser":"RY1539551643334680578",
				"deptId":"BM1671075409042526209",
				"deptName":"工程部",
				"id":16,
				"positionId":"GW1541311742399029250",
				"positionName":"工程经理（能源）",
				"season":2,
				"seasonName":"空调季",
				"updateTime":"20230621150155",
				"updateUser":"RY1539551643334680578",
				"valid":"1"
			},
			{
				"addPrompt":"1",
				"alarmDurationTime":"60",
				"createTime":"20220715162059",
				"createUser":"RY1541334884978860034",
				"deptId":"BM1538734603729711106",
				"deptName":"银泰集团",
				"id":6,
				"overrunTime":"90",
				"positionId":"GW1542444952122105858",
				"positionName":"集团工程物业助理总",
				"prompt":"将预警到事业部。",
				"season":2,
				"seasonName":"空调季",
				"updateTime":"20230717113230",
				"updateUser":"RY1539551643334680578",
				"valid":"1"
			},
            //  ....相同的结构，省略
		],
		"pageSize":20,
		"totalCount":10,
		"totalPage":1
	},
	"count":10,
	"result":"success"
}

很容易就能猜出来，这个显示的文字是根据返回值的addPrompt字段決定的，

对比一下返回的数据，错误的数据显然是后端没有返回addPrompt这个字段导致的。

为了验证自己的猜想，在不调试代码的前提，最快的就是拦截这个请求 ，然后给这个请求的第一条数据增加addPrompt字段即可！

拦截请求，比较好用的工具就是Charles了，但是下载安装什么的都很麻烦！

非常幸运的是，这一强大的功能，谷歌浏览器居然已经支持了！现在，我们来演示如何利用谷歌浏览器更改接口的返回值！

如何使用谷歌浏览器mock请求

mock一个请求

mock一个请求，我们首先需要打开浏览器的Network面板，找到请求后，点击鼠标右键

如图，面板中的Override headers 和Override content 就是浏览器的mock功能！根据其英文意思，Override headers覆盖请求头、Override content覆盖响应体，显然，更改响应内容，点击Override content即可。

选择Override content后，我们需要选择一个文件夹用来存放mock信息