CSS 卫生剂
一种轻量级可配置的CSS消毒器,通过过滤出可能有害的CSS属性和值来防止XSS攻击.
安装
npm install @barkleapp/css-sanitizer
使用量
基本用途
import { CssSanitizer } from 'css-sanitizer';
const sanitizer = new CssSanitizer();
const unsanitizedCss = `
body {
background: url('https://example.com/image.jpg');
color: red;
}
`;
const sanitizedCss = sanitizer.sanitizeCss(unsanitizedCss);
console.log(sanitizedCss);
自定义配置
您可以通过一个配置对象来自定义消毒器的行为 :
const customSanitizer = new CssSanitizer({
maxCssLength: 100000,
allowedProperties: ['custom-property'],
allowedAtRules: ['@custom-media'],
allowedPseudoClasses: [':has'],
validateUrl: (url) => {
// Custom URL validation logic
return url.startsWith('https://');
},
sanitizeUrl: (url) => {
// Custom URL sanitization logic
const allowedDomains = ['example.com', 'trusteddomain.com'];
const parsedUrl = new URL(url);
if (allowedDomains.includes(parsedUrl.hostname)) {
return url;
}
return '';
}
});
API 密码
CssSanitizer
进行CSS消毒的主要类.
构造器
new CssSanitizer(config)
config(可选) : 具有下列属性的对象:maxCssLength(数字): CSS字符串的最大允许长度.allowedProperties(Array):允许附加CSS属性.allowedAtRules允许附加规则.allowedPseudoClasses(Array):允许附加的伪类.validateUrl(功能):自定义功能来验证 URL.sanitizeUrl(功能):自定义功能来消毒URL.
方法
sanitizeCss(css: string): string
通过去除潜在的有害属性和值来对输入 CSS 字符串进行分级.
css: CSS字符串来消毒.- 返回:已消毒的 CSS 字符串.
配置选项
maxCssLength (违约:65536)
CSS 字符串的最大允许长度 。 如果输入的 CSS 超过此长度,则会被截取.
allowedProperties (默认:参见代码)
一组允许的 CSS 属性 。 您可以通过提供构造器中的一系列附加属性来添加到此列表中 .
allowedAtRules (默认: ['@media','@keyframes','@font-face','@import'])
一套允许的规则。 您可以通过在构建器中提供一系列附加规则来添加到此列表中 .
allowedPseudoClasses (默认:[':hover','活性',':聚焦',':访问',':一胎',':最后一胎','nth-child','nth-th-fort','nth-fort','not',': before',':after'])
一套允许的伪类. 您可以通过在构造器中提供一组额外的伪类来添加到此列表中.
validateUrl (职务)
使用 URL 字符串并返回布尔表示 URL 是否有效的函数 。 默认情况下,它会检查字符串是否可以被解析为有效的URL.
sanitizeUrl (职务)
如果不允许使用 URL, 则使用 URL 字符串并返回已静态 URL 字符串或空字符串的函数 。 默认情况下,它允许从'fonts.googleapis.com'获取URL.
许可证
麻省理工学院