标签：src none 浏览器 XSS 网站 前端 安全 注意事项 CSP
跨站脚本攻击（XSS攻击）
原理：
跨站脚本攻击(Cross Site Script为了区别于CSS简称为XSS)指的是恶意攻击者往Web页面里插入恶意html代码，当用户浏览该页之时，嵌入其中Web里面的html代码会被执行，从而达到恶意用户的特殊目的。
如果评论或者留言内容以 v-html 的形式嵌入到页面的话 ;这样无论是谁访问这个页面的时候控制台都会输出“Hey you are a fool fish!”
除了输入框用户数据 v-html形式嵌入页面的常见 还有 富文本编辑器 和 搜索高亮
解决方案:
- 对数据进行严格的输出编码，使得攻击者提供的数据不再被浏览器认为是脚本而被误执行;
例如<script>在进行HTML编码后变成了<script>或者处理标签开始和结束符号< >，而这段数据就会被浏览器认为只是一段普通的字符串，而不会被当做脚本执行了
前端代码安全扫描
通常代码中不允许出现明文的 服务器地址 用户名 密码等敏感信息
解决方案:
- 配置文件放在服务器端 通过http 请求获取相应内容
- 通过nginx 代理转发到对应的服务器
部署安全注意事项
1.使用强大的内容安全策略
完善的内容安全策略(CSP)是前端应用程序安全的基石。CSP是浏览器中引入的一种标准，用于检测和缓解某些类型的代码注入攻击，包括跨站点脚本（XSS）和点击劫持。
强CSP可以禁用可能有害的内联代码执行，并限制加载外部资源的域。可以通过将 Content-Security-Policy 头设置为以分号分隔的指令列表来启用CSP。如果你的网站不需要访问任何外部资源，一个良好的头的起始值可能是这样的：
Content-Security-Policy: default-src 'none'; script-src 'self'; img-src 'self'; style-src 'self'; connect-src 'self';
在这里，我们将 script-src 、 img-src 、 style-src 和 connect-src 指令设置为 self ，以指示所有脚本、图像、样式表和fetch调用都应该被限制在HTML文档提供服务的同一来源。其他任何未明确提及的CSP指令将回退到 default-src 指令指定的值。我们将其设置为 none 表示默认行为是拒绝任何URL的连接。
然而，如今几乎任何web应用程序都不是独立的，所以你可能要调整这个头，以便你可以使用其他信任域，如域名Google Fonts或AWS S3 bucket，但始终最好从以下开始最严格的政策，并在需要时稍后放宽。
您可以在MDN网站上找到CSP指令的完整列表。
2.启用XSS保护模式
如果用户输入确实注入了恶意代码，我们可以通过提供 "X-XSS-Protection": "1; mode = block" 头指令来指示浏览器阻止响应。
尽管大多数现代浏览器默认情况下都启用了XSS保护模式，并且我们也可以使用内容安全策略来禁用内联JavaScript，但仍建议包含 X-XSS-Protection 头，以确保不使用内联JavaScript的旧版浏览器具有更好的安全性。
3.禁用iframe嵌入以防止点击劫持攻击
点击劫持是一种攻击，网站A上的用户被诱骗对网站B执行某些操作。为了实现这一点，恶意用户将网站B嵌入到一个不可见的iframe中，然后将iframe放置在网站A上毫无防备的用户的光标之下，因此当用户单击，或者更确切地说，认为他们单击了网站A上的元素时，他们实际上是单击了网站B上的某个东西。
我们可以通过提供 X-Frame-Options 响应头来防止此类攻击，该响应头禁止在框架中呈现网站：
"X-Frame-Options": "DENY"
另外，我们可以使用 frame-ancestors CSP指令，该指令可以更好地控制父级可以或不能将页面嵌入iframe的程度。
4.限制对浏览器功能和API的访问
良好的安全做法的一部分是，限制对正确使用我们的网站所不需要的任何内容的访问。我们已经使用CSP应用了这个原则来限制网站可以连接的域的数量，但是它也可以应用到浏览器特性上。
我们可以使用 Feature-Policy 头指示浏览器拒绝访问我们的应用不需要的某些功能和API。
我们将 Feature-Policy 设置为由分号分隔的一串规则，其中每个规则都是功能的名称，后跟其策略名称。
"Feature-Policy": "accelerometer 'none'; ambient-light-sensor 'none'; autoplay 'none'; camera 'none'; encrypted-media 'none'; fullscreen 'self'; geolocation 'none'; gyroscope 'none'; magnetometer 'none'; microphone 'none'; midi 'none'; payment 'none'; picture-in-picture 'none'; speaker 'none'; sync-xhr 'none'; usb 'none'; vr 'none';"
标签：src,none,浏览器,XSS,网站,前端,安全,注意事项,CSP 来源： https://www.cnblogs.com/xikui/p/16191347.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。