本文讨论了如何使用chrome开发者工具和Fiddler来定位和分析前端与后台的问题。通过分析HTTP响应状态码，列举了各种可能的前端错误，如输入框处理、接口请求、页面元素错误等，并指出了一些后台错误，如返回报文格式不符、数据排序和分页问题。此外，还提到了前端的常见问题，包括非法标签、H5属性设置错误、JS注入和插件事件等。
必备工具：
chrome 浏览器F12 开发者工具 、Fiddler（抓包工具太多，熟练用抓包工具更好啊）
chrome开发者工具可以帮助定位分析哪些问题？
前端有没有向后台发起请求？发起了哪些接口的请求？接口参数是否正确?（缺少必填参数、清空缓存请求参数是否有丢失）
后台是否有应答？应答的消息能否支持页面展示？是否符合接口文档（拼写错误、json数据层级结构错误）？
因为有些接口先后顺序是严重依赖的，前端请求接口顺序是否正确？（网络较慢的时候，会暴露问题，比如用户多次刷新就会出现1个接口请求多次。用户频繁后退\前进\刷新操作）
后台是否有应答? （常见的: 1xx 2xx 3xx 4xx 5xx 状态码分别是什么意思？200服务器相应成功、400请求参数浏览器处理不了、500服务器异常、401 Unauthorized 请求未经授权，这个状态代码必须和WWW-Authenticate报头域一起使用)
有些特殊场景的bug,比如限制cpu ,限制网络，可以用开发者工具>>performance>>点击小齿轮>> 选择 cpu 6x slowdown 给cpu调慢6倍后，看下能否重现比较难现的现场的bug(一般这种bug是前端的bug)
chrome 开发者工具可以模拟：3G弱网， 弱cpu (performance > cpu 6x slowdown)
Fiddler可以帮助定位分析哪些问题？
抓包后，在composer里面，把报文的
最低0.47元/天 解锁文章
扫一扫
1162
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
