前端安全 常见的攻击类型及防御措施

1. 跨站脚本攻击(XSS)

  • 描述:跨站脚本(XSS:Cross-Site Scripting)是一种安全漏洞,允许攻击者向网站注入恶意客户端代码。该代码由受害者执行从而让攻击者绕过访问控制并冒充用户。
  • XSS攻击可以分为三类:存储(持久)、反射(非持久)或基于DOM。
    • 存储型XSS攻击
      • 注入的恶意脚本永久存储在目标服务器上。当用户访问时,代码被加载并执行。
      • 举例:比如在留言板中添加恶意代码,如果服务器没有防范,将会永久保存恶意代码,当有人浏览到这段留言时,就会被执行。
    • 反射型XSS攻击
      • 当用户被诱骗点击恶意链接、提交特制表单或浏览恶意网站时,服务器 未经过滤,会将恶意脚本反射回用户浏览器执行。
      • 举例:比如某些网站的搜索功能,会附带一些参数,而如果服务器未经过滤直接返回恶意链接,那么浏览器也会在读取参数时执行恶意代码。
    • 基于DOM的XSS攻击
      • DOM型XSS攻击发生在客户端,攻击者操纵页面中JavaScript的运行逻辑,动态修改DOM结构。
      • 举例:比如网站代码中有读取url的hash的功能,而恶意URL通过设置hash部分来注入恶意代码。
  • 防范措施:
    • 输入校验:对用户输入内容进行严格校验,拒绝危险字符。
    • 输出编码:对动态生成的HTML内容进行转义,防止插入恶意代码(如特殊字符)。
    • 内容安全策略 (CSP):通过设置Content-Security-Policy响应头,限制允许加载的脚本来源。
    • 避免使用innerHTML:尽量使用安全的DOM操作办法(如textContent或appendChild)。

2. 跨站请求伪造(CSRF)

  • 描述:攻击者让用户的浏览器在用户不知情的境况下向网站的后端发送请求。比如利用已登录的身份发送恶意请求(转账或修改密码)。
  • 防范措施:
    • CSRF Token :在表单或请求中加入随机生成的Token,后端验证Token的有效性。
    • 验证来源 :通过RefererOrigin头验证请求来源。
    • 使用SameSite Cookie :将Cookie设置成SameSite=StrictSameSite=lax,限制跨站发送。

3. 点击劫持

  • 描述: 攻击者利用透明的iframe覆盖真实页面,引诱用户点击,执行恶意操作。
  • 防范措施:
    • X-Frame-Options :通过设置响应头X-Frame-Options:DENYSAMEORIGIN,禁止页面被嵌入iframe
    • CSP帧祖先限制 :使用CSP的frame-ancestors指令限制允许嵌套页面的来源。

4. 中间人(MitM)

  • 描述:(Man-in-the-Middle)第三方拦截了Web服务器和客户端之间的流量,并冒充Web服务器以捕获数据。流量被传递,可能会进行修改。公共Wi-Fi网络是执行此类攻击的典型手段。
  • 防范措施:
    • HTTPS:启用HTTPS,确保传输加密。
    • HSTS :通过HTTP响应头启用Strict-Transport-Security,强制使用HTTPS。

5. 敏感信息泄漏

  • 描述:前端代码中直接暴露API密钥、用户信息等敏感数据。
  • 防范措施:
    • 环境变量保护:避免将敏感信息直接写入前端代码,通过后端获取。
    • 代码混淆:对前端代码进行混淆处理,增加破解难度。
    • 严格权限控制:对API请求进行身份验证和权限校验。

6. 不安全的依赖包

  • 描述:使用了第三方库或框架存在漏洞,可能被攻击者利用。
  • 防范措施:
    • 定期更新依赖:修补已知漏洞。
    • 依赖检测工具:使用工具检查依赖库的安全性。
    • 尽量减少依赖:仅引入必要的依赖,降低攻击面。
相关推荐
我命由我123451 小时前
React - 类组件 setState 的 2 种写法、LazyLoad、useState
前端·javascript·react.js·html·ecmascript·html5·js
kali-Myon1 小时前
CTFshow-Pwn142-Off-by-One(堆块重叠)
c语言·数据结构·安全·gdb·pwn·ctf·
自由生长20241 小时前
IndexedDB的观察
前端
IT_陈寒2 小时前
Vite热更新坑了我三天,原来配置要这么写
前端·人工智能·后端
斯班奇的好朋友阿法法2 小时前
离线ollama导入Qwen3.5-9B.Q8_0.gguf模型
开发语言·前端·javascript
掘金一周2 小时前
每月固定续订,但是token根本不够用,掘友们有无算力焦虑啊 | 沸点周刊 4.2
前端·aigc·openai
小村儿2 小时前
连载加餐01-claude code 源码泄漏 ---一起吃透 Claude Code,告别 AI coding 迷茫
前端·后端·ai编程
莫物3 小时前
vue过滤表格数据导致的索引错乱问题
前端·javascript·vue.js
竹林8183 小时前
从监听失败到实时更新:我在NFT铸造项目中搞定合约事件监听的全过程
前端·javascript
光影少年3 小时前
手写防抖和节流
前端·javascript·前端框架