前端面试系列-安全

最新推荐文章于 2024-07-01 11:04:53 发布

weixin_34008805

最新推荐文章于 2024-07-01 11:04:53 发布

阅读量166

点赞数

文章标签：前端面试后端 ViewUI

原文链接：https://juejin.im/post/5c7eaaa251882564ea644dcc

版权

XSS

XSS 简单点来说，就是攻击者想尽一切办法将可以执行的代码注入到网页中,分为持久型(存储在数据库中，危害性较大)和非持久型。

防御方式

转义字符

    function escape(str) {
      str = str.replace(/&/g, '&amp;')
      str = str.replace(/</g, '&lt;')
      str = str.replace(/>/g, '&gt;')
      str = str.replace(/"/g, '&quto;')
      str = str.replace(/'/g, '&#39;')
      str = str.replace(/`/g, '&#96;')
      str = str.replace(/\//g, '&#x2F;')
      return str
    }
复制代码

CSP 本质上就是建立白名单，开发者明确告诉浏览器哪些外部资源可以加载和执行

通常可以通过两种方式来开启 CSP：

1、设置 HTTP Header 中的 Content-Security-Policy

2、设置 meta 标签的方式

只允许加载本站资源

    Content-Security-Policy: default-src ‘self’
复制代码

只允许加载 HTTPS 协议图片

    Content-Security-Policy: img-src https://*
复制代码

允许加载任何来源框架

    Content-Security-Policy: child-src 'none'
复制代码

CSRF

CSRF 中文名为跨站请求伪造。原理就是攻击者构造出一个后端请求地址，诱导用户点击或者通过某些途径自动发起请求。如果用户是在登录状态下的话，后端就以为是用户在操作，从而进行相应的逻辑

防御方式

SameSite

可以对 Cookie 设置 SameSite 属性。该属性表示 Cookie 不随着跨域请求发送，可以很大程度减少 CSRF 的攻击，但是该属性目前并不是所有浏览器都兼容。

验证 Referer

对于需要防范 CSRF 的请求，我们可以通过验证 Referer 来判断该请求是否为第三方网站发起的。

Token

服务器下发一个随机 Token，每次发起请求时将 Token 携带上，服务器验证 Token 是否有效。

点击劫持

点击劫持是一种视觉欺骗的攻击手段。攻击者将需要攻击的网站通过 iframe 嵌套的方式嵌入自己的网页中，并将 iframe 设置为透明，在页面中透出一个按钮诱导用户点击。

防御

X-FRAME-OPTIONS

JS 防御

    <head>
      <style id="click-jack">
        html {
          display: none !important;
        }
      </style>
    </head>
    <body>
      <script>
        if (self == top) {
          var style = document.getElementById('click-jack')
          document.body.removeChild(style)
        } else {
          top.location = self.location
        }
      </script>
    </body>
复制代码

中间人攻击

weixin_34008805

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端面试系列-安全

XSSXSS 简单点来说，就是攻击者想尽一切办法将可以执行的代码注入到网页中,分为持久型(存储在数据库中，危害性较大)和非持久型。防御方式转义字符 function escape(str) { str = str.replace(/&/g, '&amp;') str = str.replace(/</g, '&lt;')...
复制链接

扫一扫