前端高级面试题-安全相关

1 XSS

复制代码
跨⽹站指令码(英语: Cross-site scripting ,通常简称为: XSS )是⼀种⽹站应⽤程式的安全漏洞攻击,是代码注⼊的⼀种。
它允许恶意使⽤者将程式码注⼊到⽹⻚上,其他使⽤者在观看⽹⻚时就会受到影响。这类攻击通常包含了 HTML 以及使⽤者端脚
本语⾔
XSS 分为三种:反射型,存储型和 DOM-based

如何攻击

  • XSS 通过修改 HTML 节点或者执⾏ JS 代码来攻击⽹站。
  • 例如通过 URL 获取某些参数
javascript 复制代码
<!-- http://www.domain.com?name=<script>alert(1)</script> -->
<div>{{name}}</div>
复制代码
上述 URL 输⼊可能会将 HTML 改为 <div><script>alert(1)</script></div> ,这样⻚⾯中就凭空多了⼀段可执⾏脚本。这种攻
击类型是反射型攻击,也可以说是 DOM-based 攻击

如何防御

复制代码
最普遍的做法是转义输⼊输出的内容,对于引号,尖括号,斜杠进⾏转义
javascript 复制代码
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
}
javascript 复制代码
通过转义可以将攻击代码 <script>alert(1)</script> 变成
// -> &lt;script&gt;alert(1)&lt;&##x2F;script&gt;
escape('<script>alert(1)</script>')
复制代码
对于显示富⽂本来说,不能通过上⾯的办法来转义所有字符,因为这样会把需要的格式也过滤掉。这种情况通常采⽤⽩名单过滤的办法
,当然也可以通过⿊名单过滤,但是考虑到需要过滤的标签和标签属性实在太多,更加推荐使⽤⽩名单的⽅式
javascript 复制代码
var xss = require("xss");
var html = xss('<h1 id="title">XSS Demo</h1><script>alert("xss");</script>'
// -> <h1>XSS Demo</h1>&lt;script&gt;alert("xss");&lt;/script&gt;
console.log(html);
复制代码
以上示例使⽤了 js-xss 来实现。可以看到在输出中保留了 h1 标签且过滤了 script 标签

2 CSRF

复制代码
跨站请求伪造(英语: Cross-site request forgery ),也被称为 one-click attack 或者 session riding ,通常缩写为
 CSRF 或者 XSRF ,是⼀种挟制⽤户在当前已登录的 Web 应⽤程序上执⾏⾮本意的操作的攻击⽅法
 CSRF 就是利⽤⽤户的登录态发起恶意请求

如何攻击

复制代码
假设⽹站中有⼀个通过 Get 请求提交⽤户评论的接⼝,那么攻击者就可以在钓⻥⽹站中加⼊⼀个图⽚,图⽚的地址就是评论接⼝
javascript 复制代码
<img src="http://www.domain.com/xxx?comment='attack'"/>

如何防御

  • Get 请求不对数据进⾏修改
  • 不让第三⽅⽹站访问到⽤户 Cookie
  • 阻⽌第三⽅⽹站请求接⼝
  • 请求时附带验证信息,⽐如验证码或者 token

3 密码安全

加盐

复制代码
对于密码存储来说,必然是不能明⽂存储在数据库中的,否则⼀旦数据库泄露,会对⽤户造成很⼤的损失。并且不建议只对密码单纯
通过加密算法加密,因为存在彩虹表的关系
  • 通常需要对密码加盐,然后进⾏⼏次不同加密算法的加密
javascript 复制代码
// 加盐也就是给原密码添加字符串,增加原密码⻓度
sha256(sha1(md5(salt + password + salt)))
复制代码
但是加盐并不能阻⽌别⼈盗取账号,只能确保即使数据库泄露,也不会暴露⽤户的真实密码。⼀旦攻击者得到了⽤户的账号,可以通过
暴⼒破解的⽅式破解密码。对于这种情况,通常使⽤验证码增加延时或者限制尝试次数的⽅式。并且⼀旦⽤户输⼊了错误的密码,也不
能直接提示⽤户输错密码,⽽应该提示账号或密码错误

前端加密

复制代码
虽然前端加密对于安全防护来说意义不⼤,但是在遇到中间⼈攻击的情况下,可以避免明⽂密码被第三⽅获取
相关推荐
Hilaku3 分钟前
CORS 到底在保护谁?90% 的前端理解错了跨域的本质
前端·javascript·程序员
wno70417 分钟前
node.js中使用jquery
前端·node.js·jquery
江湖中的阿龙19 分钟前
Oracle 紧急安全警报:Java 9.1 分漏洞 CVE-2026-91403,撤销对 eMudhra 风险证书的信任
java·安全·oracle
阿琳a_22 分钟前
b-map-viewer:面向 Vue 3 的地图可视化 SDK,从接入到展示再到交互分析
前端·javascript·vue.js·gis·数据可视化·地图
10年前端老司机32 分钟前
Agent 商业化困局:热闹的发布会,冷清的付费客户
前端·后端·agent
钱栈up39 分钟前
热榜上手|HyperFrames:写HTML出MP4
前端·html
Sailing1 小时前
🚀🚀【封闭结束8】Agent RAG:从零搭建一个可用知识库
前端·后端·agent
是真的小外套1 小时前
网络安全实战第21期:一次完整的注入风险验证与记录
安全·web安全
Captain1314_李祖团1 小时前
5. MLIR相关语法
java·前端·javascript
恋猫de小郭1 小时前
Flutter 可以更直接地调用原生 API 了,Dart Direct Native Interop
android·前端·flutter