发表更新前端安全5 分钟读完 (大约724个字)0次访问

前端安全

前端安全

为什么会跨域？

跨域问题是浏览器的同源策略导致的，同源策略是浏览器的一种安全机制，即进行资源请求时需要保证协议、域名、端口号都相同，否则就产生了跨域，是为了防止恶意的跨站脚本攻击。

如何解决跨域问题？

CORS(跨域资源共享)：在服务端设置Access-Control-Allow-Origin等header，以允许跨域请求

JSONP：利用动态创建script标签,通过script.src实现跨域请求

Nginx反向代理：配置Nginx反向代理，将跨域请求转发到服务器

window.postMessage()：HTML5提供的跨域通信API，允许窗口间的消息传递

websocket：websocket协议支持跨域通信

你知道哪些前端攻击？该如何预防？

  • xss

    • Cross Site Script 跨站脚本攻击
    • 手段：将 js 代码插入到网页内容中，渲染时执行 js 代码
    • 预防：特殊字符替换（前端或后端）
    • 输入检查，对于用户输入进行格式检查。

  • csrf

    • Cross Site Request Forgery 跨站请求伪造

    • 手段：诱导用户去访问另一个网站的接口，伪造请求

    • 预防：严格的跨域限制 + 验证码机制

    • csrf 详细过程

      • 用户登录 A 网站，有了 A 网站的 cookie
      • 诱导用户到 B 网站，并发起 A 网站的请求
      • A 网站的 API 发现有 cookie，认为是用户自己操作的

    • csrf 预防手段

      • 严格的跨域请求限制，如判断 referer（请求来源）
      • 为 cookie 设置 SameSite，禁止跨域传递 cookie
        • Chrome 51 开始，浏览器的 Cookie 新增加了一个 SameSite 属性，用来防止 CSRF 攻击 和用户追踪（第三方恶意获取 cookie），限制第三方 Cookie，从而减少安全风险。
      • 关键接口使用短信验证码
      • token 验证

  • 点击劫持

    • click jacing
    • 手段：诱导界面上蒙一个透明 iframe，诱导用户点击
    • 预防：让 iframe 不能跨域加载
      • X-FRAME-OPTIONS 响应头是用来给浏览器指示允许一个页面可否在<frame>,
        <iframe> 或者 <object> 中展现的标记。网站可以使用此功能，来确保自己网站
        内容没有被嵌到别人的网站中去，也从而避免点击劫持的攻击。

  • DDos

    • Distribute denial-of-service 分布式拒绝服务
    • 手段：分布式的、大规模的流量访问，使服务器瘫痪
    • 预防：软件层不好做，需硬件预防（如阿里云 WAF）

  • SQL 注入

    • 手段：提交内容时写入 SQL 语句，破环数据库
    • 预防：处理输入的内容，替换特殊字符
#

评论

×