默认情况下,Vue 是否为 XSS 提供安全性或防止 XSS?

Does Vue, by default, provide security for or protects against XSS?

我正在想办法保护,

对抗XSS攻击。当我访问 Angular 官方文档时,

https://angular.io/guide/security

,它说:

To systematically block XSS bugs, Angular treats all values as untrusted by default. When a value is inserted into the DOM from a template, via property, attribute, style, class binding, or interpolation, Angular sanitizes and escapes untrusted values.

还有:

Angular sanitizes untrusted values for HTML, styles, and URLs; sanitizing resource URLs isn't possible because they contain arbitrary code. In development mode, Angular prints a console warning when it has to change a value during sanitization.

和:

Angular recognizes the value as unsafe and automatically sanitizes it, which removes the tag but keeps safe content such as the element.

当我去 React 官方文档时,

https://reactjs.org/docs/introducing-jsx.html#jsx-prevents-injection-attacks

,内容如下:

It is safe to embed user input in JSX:

和:

By default, React DOM escapes any values embedded in JSX before rendering them. Thus it ensures that you can never inject anything that’s not explicitly written in your application. Everything is converted to a string before being rendered. This helps prevent XSS (cross-site-scripting) attacks.

但是对于 Vue,我在他们的文档中找不到任何关于 XSS 保护的内容,或者他们可以默认提供的任何内容。

我的问题:默认情况下,Vue 是否提供任何方式来防止 XSS 攻击,或者我是否需要寻找第 3 方解决方案?

当我 Google 这个主题时,我得到了很多博客文章网站和文章,例如,这个项目来清理我的 HTML:

https://github.com/punkave/sanitize-html

vue 中没有内置的消毒剂。根据 Evan You(Vue 的创建者)comment 关于一个问题

built-in sanitizer would add extra bundle weight for a rare use case (when most use cases of v-html are for trusted content); it is also trivial to add sanitize-html by setting Vue.prototype.$sanitize = sanitizeHTML and then do v-html="$sanitize(html)".

检查此 post :https://github.com/vuejs/vue/issues/6333

比答案更多的附加信息:就像另一个 中提到的那样 sanitize-html 有 327 KB 重量的缺点。但也有更小的套餐可供选择:

为了在我们的项目中防止 XSS,我们使用 vue-dompuritfy-html which has the bonus to cover the recommended eslint rule vue/no-v-html。安装后你可以简单地使用

<div v-dompurify-html="htmlContent" />

帮助防止 XSS 的一种方法是在您的 html 头部添加 内容安全策略。它通过限制页面可以加载的资源(脚本、图像)以及限制页面的框架来工作。

例如,以下指令仅允许从与页面本身和“apis.google.com”相同的来源加载脚本。

<meta http-equiv="Content-Security-Policy" content="script-src 'self' https://apis.google.com">

还有其他 CSP 设置可用于帮助缓解 XSS 攻击,例如 nonce 和哈希。如需更多信息,请访问:https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP