Security 面板

  • 使用 Security Overview 可以立即查看当前页面是否安全。
  • 检查各个源以查看连接和证书详情(安全源)或找出具体哪些请求未受保护(非安全源)。

Security Overview

要查看页面的整体安全性,请打开 DevTools,然后转至 Security 面板。

您首先会看到 Security Overview。Security Overview 会一目了然地告诉您页面是否安全。 安全页面会通过消息 This page is secure (valid HTTPS). 指示

点击 View certificate 查看主源的服务器证书。

非安全页面会通过消息 This page is not secure. 指示

Security 面板可以区分两种非安全页面。 如果请求的页面通过 HTTP 提供,则主源会被标记为不安全。

如果请求的页面通过 HTTPS 检索,但页面会继续使用 HTTP 检索其他源的内容,然后页面仍然会被标记为不安全。这称为混合内容页面。 混合内容页面仅受部分保护,因为 HTTP 内容可以被嗅探器获取到且易受到中间人攻击。

点击 View request in Network Panel 打开 Network 面板的过滤视图,然后查看具体是哪些请求通过 HTTP 提供。 这将显示来自所有源的所有未受保护的请求。

检查源

使用左侧面板可以检查各个安全或非安全源。

点击安全源查看该源的连接和证书详情。

如果您点击非安全源,Security 面板会提供 Network 面板过滤视图的链接。

点击链接可以查看具体是源的哪些请求通过 HTTP 提供。

chrome开发工具指南(三)的更多相关文章

  1. Chrome 开发工具指南

    Chrome 开发工具指南 谷歌 Chrome 开发工具,是基于谷歌浏览器内含的一套网页制作和调试工具.开发者工具允许网页开发者深入浏览器和网页应用程序的内部.该工具可以有效地追踪布局问题,设置 Ja ...

  2. chrome开发工具指南(一)

    注意:如果你是一个网页开发者同时想要获得最新版本的开发工具,那么你应该使用谷歌浏览器(金丝雀)Canary 版. Chrome 开发者工具 打开Chrome 开发者工具 选择浏览器位于浏览器窗口右上方 ...

  3. chrome开发工具指南(十二)

    使用 Device Mode 模拟移动设备 使用 Chrome DevTools 的 Device Mode 打造移动设备优先的完全自适应式网站.了解如何使用 Device Mode 模拟多种设备及其 ...

  4. chrome开发工具指南(七)

    检查动画 使用 Chrome DevTools 动画检查器检查和修改动画. 通过打开动画检查器捕捉动画.检查器会自动检测动画并将它们分类为多个组. 通过慢速播放.重播或查看动画源代码来检查动画. 通过 ...

  5. chrome开发工具指南(六)

    检查和编辑页面与样式 使用 Chrome DevTools 的 Elements 面板检查和实时编辑页面的 HTML 与 CSS. 在 Elements 面板中检查和实时编辑 DOM 树中的任何元素. ...

  6. chrome开发工具指南(二)

    Application 面板 使用 App Manifest 窗格检查您的网络应用清单和触发 Add to Homescreen 事件. 使用 Service Worker 窗格执行与服务工作线程相关 ...

  7. chrome开发工具指南(十四)

    模拟和测试其他浏览器 您的任务不只局限于确保网站在 Chrome 和 Android 上出色运行.即使 Device Mode 可以模拟 iPhone 等多种其他设备,我们仍鼓励您查看其他浏览器模拟解 ...

  8. chrome开发工具指南(十三)

    模拟传感器:地理定位与加速度计 由于大多数桌面设备都没有 GPS 芯片和加速度计,所以测试它们比较困难.Chrome DevTools 的 Sensors 模拟窗格可以通过模拟常见的移动设备传感器来降 ...

  9. chrome开发工具指南(十一)

    检查资源 使用 Application 面板的 Frames 窗格可以按框架组织资源. 您也可以在 Sources 面板中停用 Group by folder 选项,按框架查看资源. 要按网域和文件夹 ...

随机推荐

  1. 办公楼[POI2007]

    题目描述 FGD开办了一家电话公司.他雇用了N个职员,给了每个职员一部手机.每个职员的手机里都存储有一些同事的电话号码.由于FGD的公司规模不断扩大,旧的办公楼已经显得十分狭窄,FGD决定将公司迁至一 ...

  2. code_smith生成实体类

  3. C语言程序设计进阶 翁恺 第4周编程练习

    第4周编程练习 查看帮助 返回 第4周编程练习 依照学术诚信条款,我保证此作业是本人独立完成的. 温馨提示: 1.本次作业属于Online Judge题目,提交后由系统即时判分. 2.学生可以在作业 ...

  4. 邻接表(C++)

    adj_list_network_edge.h // 邻接表网边数据类模板 template <class WeightType> class AdjListNetworkEdge { p ...

  5. [vijos NOIP模拟题]天神下凡 贪心+搜索

    样例: 考试的时候没时间打了,随便敲了敲就交上去了,没想到竟然编译错误,忘定义n了23333 自己测了测能骗20分hhhh 考虑每个圆对答案的贡献,当一个圆被小圆内切的时候,分成了两半,对答案的贡献就 ...

  6. 敏捷视界:Scrum起源、Scrum术语

    Scrum起源 Scrum的原始含义 Scrum原始含义是指英式橄榄球次要犯规时在犯规地点对阵争球.争球双方各有8个队员参与,各方出3名前锋队员,并肩各站成一横排,面对面躬身互相顶肩,中间形成一条通道 ...

  7. python编程基础知识—字典

    字典 在python中,字典是一系列键-值对,每个键都与一个值相关联,可使用键来访问相关联的值.与键相关联的值可以是数字.字符串.列表乃至字典,即可将任何python对象用在字典中的值. 在pytho ...

  8. [ABP开源项目]--vue+vuex+vue-router+EF的权限管理系统

    好久没写文字了,当然大家也不期待嘛,反正看代码就行了. 演示网站 首先说下这个项目吧. 如标题一样是基于VUE+.NET开发的框架,也是群友一直吼吼吼要一个vue版本的ABP框架. 我们先来看看首页吧 ...

  9. 自动生成AWR报告

    --自动生成AWR报告 -------------------2013/09/23   脚本代码:   #!/bin/bash   AWR_FORMAT=html NUM_DAYS=1   MAX_S ...

  10. Dynamics CRM:Word Template Feature 的使用和实际遇到问题解决方案

    Word Template 是Dynamics CRM 2016 中的其中一个新的功能.Word Template 就是文档模板,用于在Dynamics CRM中定义文档模板,从而对实体记录按照文档模 ...