admin 管理员组

文章数量: 1184232

文章目录

  • 1 基础设置
    • 1.1 打开方式
    • 1.2 布局设置
    • 1.3 改为中文
    • 1.4 页面介绍
  • 2 抓包
    • 2.1 基础概念
    • 2.2 怎么抓想要的包
    • 2.3 怎么看懂包（HTTP）
    • 2.4 运行接口
    • 2.5 Bug定位分析
  • 3 弱网设置
  • 4 录制自动化脚本

1 基础设置

1.1 打开方式

  1. 右键 > 检查
  2. 设置 > 更多工具 > 开发者工具
  3. 快捷键 [F12] / [Ctrl+Shift+I]

1.2 布局设置

1.3 改为中文

1.4 页面介绍

  • 保留日志 Preserve log
    保留操作过程中所有的包。
    示例：访问http://testingedu:8081/inter/index.html，使用Will/123456登录。
  • 停用缓存 Disable cache

2 抓包

2.1 基础概念

包：网络包，网络上信息传递的数据单元。
协议：Tcp/Ip, Http, Socket, Soap, Restful, Http=Http+ssl
抓包：抓取然间网络传输的包

2.2 怎么抓想要的包

步骤：清空 > 进行对应操作（一般来说只会操作对应的包） > 停止 > 从名字取分析

2.3 怎么看懂包（HTTP）

  1. URL ：统一资源定位符（包的服务器地址）
    组成：协议://主机地址/路径（接口名）
  2. 参数：客户端传递给服务器的信息
  3. 请求头：请求需要带上的验证信息
  4. 响应：服务器处理的结果
  5. 响应头：本次请求产生的验证信息，后续请求可能要用到（带在请求头里面）

2.4 运行接口

复制接口：右击接口 > Copy > Copy as cURL(bash)
运行接口：打开Postman > 点击Import > 选择Raw text，粘贴接口 > Continue > Import > 点击Send发送请求


2.5 Bug定位分析

  • 信息传递
    前端—互联网—后台（保证信息没有传错：看参数）
    后台—互联网—前端（保证前端结果和后台结果一致：看响应）

  • Bug分析示例1
    问题：访问http://testingedu:8081/inter/index.html，使用will%/123456登录，发现点了登录按钮无反应。

    分析：前端：后台报错时，前端没有提示；后台：后台500异常，附带截图

  • Bug分析示例2
    问题：http://testingedu:8081/inter/index.html特斯汀学院logo图片显示错误。

    分析：前端URL地址填错，导致404错误。（若URL地址正确却没显示，则可能是后台/前端没有图片）

3 弱网设置

4 录制自动化脚本

本文标签： 开发者 浏览器 工具 chrome

版权声明：本文标题：Chrome浏览器开发者工具使用 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/b/1754667056a3026006.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。