西安网站开发制作,新潮远网站建设,餐饮营销案例100例,网店推广引流1. 面试总结话术：
前端常见的安全问题主要包括以下几种： 跨站脚本攻击（XSS）：攻击者通过在目标网站注入恶意脚本，当用户访问网站时，恶意脚本会被执行，从而窃取用户信息或进行其他恶意操作。这种攻击通常利用表单提交、URL参数等方式注入脚本。存储型 xss 恶意代码存在数…1. 面试总结话术：
前端常见的安全问题主要包括以下几种：
跨站脚本攻击（XSS）：攻击者通过在目标网站注入恶意脚本，当用户访问网站时，恶意脚本会被执行，从而窃取用户信息或进行其他恶意操作。这种攻击通常利用表单提交、URL参数等方式注入脚本。存储型 xss 恶意代码存在数据库里，。反射型 xss 恶意代码存在 URL 里DOM 型 xss 取出和执行恶意代码由浏览器端完成，属于前端 JavaScript 自身的安全漏洞，而其他两种 XSS 都属于服务端的安全漏洞跨站请求伪造（CSRF）：攻击者诱导用户访问恶意网站或链接，利用用户在已登录状态下对其他网站的信任，以用户的身份发送伪造请求，执行非法操作。攻击者诱导受害者进入第三方网站，在第三方网站中，向被攻击网站发送跨站请求。利用受害者在被攻击网站已经获取的注册凭证，绕过后台的用户验证，达到冒充用户对被攻击的网站执行某项操作的目的。点击劫持（ClickJacking）：攻击者通过隐藏或覆盖页面上的元素，诱导用户点击看似正常的按钮或链接，实际上执行了攻击者预设的操作。HTTP头部注入攻击：攻击者通过修改HTTP头部信息，如Cookie、Referer等，伪造用户身份或欺骗服务器执行非法操作。文件上传漏洞：如果前端没有对用户上传的文件进行严格的验证和过滤，攻击者可能会上传恶意文件，如包含恶意代码的图片、脚本文件等，从而执行恶意操作。敏感信息泄露：前端代码中可能包含敏感信息，如API密钥、数据库连接字符串等，如果这些信息被泄露，攻击者可能会利用它们进行恶意操作。不安全的第三方库：前端开发中经常使用第三方库和插件，如果这些库存在安全漏洞，攻击者可能会利用它们进行攻击。因此，在选择和使用第三方库时，需要仔细评估其安全性。为了防范这些安全问题，前端开发者可以采取以下措施：
对用户输入进行严格的验证和过滤，防止注入攻击。使用HTTPS协议传输数据，保护数据的机密性和完整性。设置合适的HTTP头部信息，防止点击劫持和HTTP头部注入攻击。对上传的文件进行严格的验证和过滤，防止文件上传漏洞。避免在前端代码中存储敏感信息，将敏感信息存储在服务器端。定期更新和修补第三方库和插件的安全漏洞。使用Web应用防火墙（WAF）等安全设备增强应用的安全性。2. XSS
XSS是跨站脚本攻击（Cross-Site Scripting）的简称，它是个老油条了，在OWASP Web Application Top 10排行榜中长期霸榜，从未掉出过前三名。XSS这类安全问题发生的本质原因在于，浏览器错误的将攻击者提供的用户输入数据当做JavaScript脚本给执行了。
XSS 的本质是：恶意代码未经过滤，与网站正常的代码混在一起；浏览器无法分辨哪些脚本是可信的，导致恶意脚本被执行。
通常页面中包含的用户输入内容都在固定的容器或者属性内，以文本的形式展示。攻击者利用这些页面的用户输入片段，拼接特殊格式的字符串，突破原有位置的限制，形成了代码片段。攻击者通过在目标网站上注入脚本，使之在用户的浏览器上运行，从而引发潜在风险。通过 HTML 转义，可以防止 XSS 攻击， HTML 转义，并不等于高枕无忧。对于链接跳转，如 `a href="xxx" `或 `location.href="xxx"`，要检验其内容，禁止以 `javascript:` 开头的链接，和其他非法的 scheme。在 HTML 中内嵌的文本中，恶意内容以 script 标签形成注入。在内联的 JavaScript 中，拼接的数据突破了原本的限制（字符串，变量，方法名等）。在标签属性中，恶意内容包含引号，从而突破属性值的限制，注入其他属性或者标签。在标签的 href、src 等属性中，包含 javascript: 等可执行代码。在 onload、onerror、onclick 等事件中，注入不受控制代码。在 style 属性和标签中，包含类似 background-image:url("javascript:..."); 的代码（新版本浏览器已经可以防范）。在 style 属性和标签中，包含类似 expression(...) 的 CSS 表达式代码（新版本浏览器已经可以防范）。以下内容不可信
来自用户的 UGC 信息来自第三方的链接URL 参数POST 参数Referer （可能来自不可信的来源）Cookie （可能来自其他子域注入）2.1. XSS 攻击的分类 类型 存储区* 插入点* 存储型 XSS 后端数据库 HTML 反射型 XSS URL HTML DOM 型 XSS 后端数据库/前端存储/URL 前端 JavaScript 存储区：恶意代码存放的位置。插入点：由谁取得恶意代码，并插入到网页上。2.1.1. 存储型 XSS
存储型 XSS 的攻击步骤：
攻击者将恶意代码提交到目标网站的数据库中。用户打开目标网站时，网站服务端将恶意代码从数据库取出，拼接在 HTML 中返回给浏览器。用户浏览器接收到响应后解析执行，混在其中的恶意代码也被执行。恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作。这种攻击常见于带有用户保存数据的网站功能，如论坛发帖、商品评论、用户私信等。
2.1.2. 反射型 XSS
反射型 XSS 的攻击步骤：
攻击者构造出特殊的 URL，其中包含恶意代码。用户打开带有恶意代码的 URL 时，网站服务端将恶意代码从 URL 中取出，拼接在 HTML 中返回给浏览器。用户浏览器接收到响应后解析执行，混在其中的恶意代码也被执行。恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作。反射型 XSS 跟存储型 XSS 的区别是：存储型 XSS 的恶意代码存在数据库里，反射型 XSS 的恶意代码存在 URL 里。
反射型 XSS 漏洞常见于通过 URL 传递参数的功能，如网站搜索、跳转等。
由于需要用户主动打开恶意的 URL 才能生效，攻击者往往会结合多种手段诱导用户点击。
POST 的内容也可以触发反射型 XSS，只不过其触发条件比较苛刻（需要构造表单提交页面，并引导用户点击），所以非常少见。
2.1.3. DOM 型 XSS
DOM 型 XSS 的攻击步骤：
攻击者构造出特殊的 URL，其中包含恶意代码。用户打开带有恶意代码的 URL。用户浏览器接收到响应后解析执行，前端 JavaScript 取出 URL 中的恶意代码并执行。恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作。DOM 型 XSS 跟前两种 XSS 的区别：DOM 型 XSS 攻击中，取出和执行恶意代码由浏览器端完成，属于前端 JavaScript 自身的安全漏洞，而其他两种 XSS 都属于服务端的安全漏洞。 eval()、setTimeout()、setInterval()、Function()、innerHTML、document.write() 等 DOM 型 XSS 漏洞
2.2. XSS 攻击的预防
输入过滤 通过前面的介绍可以得知，XSS 攻击有两大要素：
攻击者提交恶意代码。浏览器执行恶意代码。针对第一个要素：我们是否能够在用户输入的过程，过滤掉用户输入的恶意代码呢？
既然输入过滤并非完全可靠，我们就要通过“防止浏览器执行恶意代码”来防范 XSS。这部分分为两类：防止 HTML 中出现注入。防止 JavaScript 执行时，执行恶意代码。预防存储型和反射型 XSS 攻击
存储型和反射型 XSS 都是在服务端取出恶意代码后，插入到响应 HTML 里的，攻击者刻意编写的“数据”被内嵌到“代码”中，被浏览器所执行。
预防这两种漏洞，有两种常见做法：
改成纯前端渲染，把代码和数据分隔开。对 HTML 做充分转义。纯前端渲染的过程：
浏览器先加载一个静态 HTML，此 HTML 中不包含任何跟业务相关的数据。然后浏览器执行 HTML 中的 JavaScript。JavaScript 通过 Ajax 加载业务数据，调用 DOM API 更新到页面上。在纯前端渲染中，我们会明确的告诉浏览器：下面要设置的内容是文本（.innerText），还是属性（.setAttribute），还是样式（.style）等等。浏览器不会被轻易的被欺骗，执行预期外的代码了。
但纯前端渲染还需注意避免 DOM 型 XSS 漏洞（例如 onload 事件和 href 中的 javascript:x
