问题描述

有没有人有任何想法如何清理通过用户输入输入的 CSS？我关心通过 CSS 的 cross-site 脚本。我正在使用 wp_filter_kses 清理用户输入的 HTML，但是我需要一个类似的解决方案来进行用户输入的样式。到目前为止，我使用以下丑陋和不完整的功能，但我想要更完整的东西。

function sanitizeCSS ( $css ) {
    $css = str_replace( '/-moz-binding/', '', $css );
    $css = str_replace( '/expression/', '', $css );
    $css = str_replace( '/javascript/', '', $css );
    $css = str_replace( '/vbscript/', '', $css );
    return $css; 
}

最佳解决方案

您将需要一个真正的 CSS 解析器，如 this one 来过滤 CSS 。正则表达式或简单的字符串替换不够安全。

次佳解决方案

我发现最好的办法是将 CSSTidy 纳入我的插件。我从 JetPack 获取了一个自定义 CSS 功能的页面。

JetPack 的 CSSTidy 实现包含在 Jetpack_Safe_CSS 类中作为函数 filter_attr 。我无法完全弄清楚为什么 JetPack 在分析之前将用户输入的 CSS 嵌入到’div’ 元素中，但是在一些尝试和错误之后，我发现 CSSTidy 并不能够解析一个 CSS 文件。这一课学到了我从 JetPack 中删除了代码。

我下载了 CSSTidy，创建了一个目录来包含 CSSTidy 的 PHP 文件。然后我需要在我的代码中使用 class.csstidy.php，并初始化一个新的 csstidy 对象。将 CSS 嵌套在’div’ 元素中进行验证，然后通过 CSSTidy 进行解析，然后将简单的 CSS 从 csstidy 对象中退回。到目前为止，数以千计的安装非常好 (尽管我永远不会知道有多少用户实际使用我的插件的 CSS 功能) 。

我可能没有注意到这是我的原始问题，但是我正在寻找最简单，最简单的方法，而不是最技术，最复杂或最强大的方法。我值得尽可能少地修改 WordPress 的体验。这就是为什么我把 JetPack 作为最接近”source” 的东西。我认为 JetPack 几乎是由 Automattic(WordPress 本身的开发人员) 开发的。我唯一的… 遗憾的是，CSSTidy 在 2007 年被放弃了，所以我想我将需要在某个时候找到另一个解决方案。

require_once( 'csstidy/class.csstidy.php' );
$csstidy = new csstidy();
$csstidy->set_cfg( 'remove_bslash', FALSE );
$csstidy->set_cfg( 'compress_colors', FALSE );
$csstidy->set_cfg( 'compress_font-weight', FALSE );
$csstidy->set_cfg( 'discard_invalid_properties', TRUE );
$csstidy->set_cfg( 'merge_selectors', FALSE );
$csstidy->set_cfg( 'remove_last_;', FALSE );
$csstidy->set_cfg( 'css_level', 'CSS3.0' );
$csstovalidateindiv = 'div {' . $csstovalidate . '}';
$csstovalidateindiv = preg_replace( '/\\([0-9a-fA-F]{4})/', '\\\\$1', $csstovalidateindiv );
$csstovalidateindiv = wp_kses_split( $csstovalidateindiv, array(), array() );
$csstidy->parse( $csstovalidateindiv );
$csstovalidateindiv = $csstidy->print->plain();
$csstovalidateindiv = str_replace( array( "n", "r", "t" ), '', $csstovalidateindiv );
preg_match( "/^divs*{(.*)}s*$/", $csstovalidateindiv, $matches );
if ( !empty( $matches[1] ) ) $cssvalidated = $matches[1];

(代码或没有发生)

参考文献

注：本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意，可以加入我们改善翻译效果：薇晓朵技术论坛。