讲师中心 微信公众号
AI工具推荐 视频效率加速

如何安全地过滤 HTML 标签:允许指定标签,移除其余所有(含属性)

阿浩酱_2363

阿浩酱_2363

发布时间:2026-01-22 10:32:08

|

531人浏览过

|

来源于php中文网

原创

如何安全地过滤 HTML 标签:允许指定标签,移除其余所有(含属性)

本文讲解为何不应使用正则表达式清洗 html,推荐采用专业 html 消毒库(如 dompurify 或 sanitize-html),并提供完整、安全、可落地的前端与后端协同过滤方案。

HTML 是一种嵌套结构复杂、语法灵活(如自闭合标签、CDATA、注释、命名空间等)的标记语言。试图用正则表达式匹配并剔除“非白名单标签”看似简洁,实则隐患重重——例如你的正则 /]*>/g 会在以下场景失效:

  • 匹配 <script>alert(1)</script> 失败(因 script 不在否定列表开头,但 可能被误判为结束标签);
  • 无法识别 如何安全地过滤 HTML 标签:允许指定标签,移除其余所有(含属性) 中的 > 被包裹在属性值内,导致提前截断;
  • 忽略 HTML 注释 、CDATA 区段或 SVG 内联标签;
  • 对大小写不敏感处理缺失(如 );
  • 更严重的是:正则无法解析 DOM 结构,无法防范基于标签嵌套、事件属性(onerror)、伪协议(javascript:)等的 XSS 攻击。

✅ 正确做法:使用专为 HTML 净化设计的成熟库。

✅ 推荐方案:DOMPurify(前端首选)

DOMPurify 是由 Cure53 团队维护的、经严格安全审计的轻量级库,支持白名单机制,自动处理转义、属性过滤、SVG 安全策略等:

<script src="https://cdn.jsdelivr.net/npm/dompurify@3/dist/purify.min.js"></script>
const allowedTags = ['a', 'b', 'i', 's', 'u', 'sup', 'sub', 'strong', 'cite', 'code', 'del', 'em'];

const cleanHTML = DOMPurify.sanitize(dirtyHTML, {
  ALLOWED_TAGS: allowedTags,
  // 可选:限制 a 标签仅允许 href(且自动校验为安全协议)
  ALLOWED_ATTR: ['href'],
  FORBID_ATTR: ['onerror', 'onclick', 'javascript:', 'data-*'], // 显式禁止危险属性
  KEEP_CONTENT: true // 移除非允许标签时保留其文本内容(对应示例中 span 的 "without any errors")
});

// 输入示例将被安全净化为:
// "<b><i>Test<strong>Passed</strong>without any errors<a href=\"http://example.com\">click here</a></b></i>"
⚠️ 注意:KEEP_CONTENT: true 是实现你示例中 without any errors → "without any errors" 的关键配置,它确保被移除标签的子文本不丢失。

✅ 后端必须同步消毒(不可省略!)

前端净化仅用于用户体验优化与基础防护;攻击者可绕过 JS 直接提交恶意 payload。因此服务端必须独立执行同等强度的消毒:

java-api-doc-generator
java-api-doc-generator

分析 Java Spring Boot 后端 Controller 代码,自动生成 Markdown 格式的接口文档。当用户说“生成 Java 接口文档”、“生成 API 文档”、“从 Spring 代码生成文档”时触发。

下载

立即学习“前端免费学习笔记(深入)”;

  • Node.js:继续使用 sanitize-html(更细粒度配置)或 DOMPurify(服务端需搭配 JSDOM);
  • PHP:使用 Symfony HtmlSanitizer(v6.2+ 内置,支持白名单 + 属性控制 + XSS 防御);
  • Python:推荐 bleach(基于 html5lib,支持白名单与 CSS 过滤);
  • Java:使用 OWASP Java HTML Sanitizer。

示例(Symfony PHP):

use Symfony\Component\HtmlSanitizer\HtmlSanitizer;
use Symfony\Component\HtmlSanitizer\Rule\TagRule;

$sanitizer = new HtmlSanitizer([
  (new TagRule('a'))->withAllowedAttributes(['href']),
  // 允许的标签列表...
  new TagRule('b'), new TagRule('i'), /* ... */
]);
$clean = $sanitizer->sanitize($userInput);

✅ 总结:安全 HTML 过滤的黄金法则

  • ❌ 永远不要用正则表达式解析/修改 HTML;
  • ✅ 前端用 DOMPurify 实现即时、用户友好的白名单过滤;
  • ✅ 后端必须用语言原生消毒库做最终校验,且策略应与前端一致(避免“信任前端输出”);
  • ✅ 白名单优先:只允许明确需要的标签和属性,其余一律拒绝;
  • ✅ 敏感属性(如 href, src)需额外校验协议(仅允许 http://, https://, mailto: 等);
  • ✅ 日志记录非法输入,用于安全审计与规则迭代。

遵循以上实践,你不仅能精准达成“保留 等标签、剥离 如何安全地过滤 HTML 标签:允许指定标签,移除其余所有(含属性)

相关文章

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
PixPix
PixPix Hot

PixPix是一款面向电商视觉生产的AI商品图生成工具。

PixTV
PixTV Hot

PixTV是一款面向AIGC内容创作的AI视频生成工具。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

Laper
Laper Hot

Laper是专为编剧、导演和制片人推出的 AI 原生剧本创作工具。

花生AI
花生AI Hot

一款AI视频创作工具,主要用于B站推出的AI视频创作工具,适合需要提升相关任务效率的用户。

蛙蛙写作

一款AI论文写作工具,主要用于超级AI智能写作助手,适合需要提升相关任务效率的用户。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

创客贴AI

创客贴AI是一款AI图像与设计工具,AI辅助的智能在线设计工具。

相关专题

更多
PHP Symfony框架
PHP Symfony框架

本专题专注于PHP主流框架Symfony的学习与应用,系统讲解路由与控制器、依赖注入、ORM数据操作、模板引擎、表单与验证、安全认证及API开发等核心内容。通过企业管理系统、内容管理平台与电商后台等实战案例,帮助学员全面掌握Symfony在企业级应用开发中的实践技能。

6057

2025.09.11

js正则表达式
js正则表达式

php中文网为大家提供各种js正则表达式语法大全以及各种js正则表达式使用的方法,还有更多js正则表达式的相关文章、相关下载、相关课程,供大家免费下载体验。

4696

2023.06.20

正则表达式不包含
正则表达式不包含

正则表达式,又称规则表达式,,是一种文本模式,包括普通字符和特殊字符,是计算机科学的一个概念。正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串,通常被用来检索、替换那些符合某个模式的文本。php中文网给大家带来了有关正则表达式的相关教程以及文章,希望对大家能有所帮助。

3201

2023.07.05

java正则表达式语法
java正则表达式语法

java正则表达式语法是一种模式匹配工具,它非常有用,可以在处理文本和字符串时快速地查找、替换、验证和提取特定的模式和数据。本专题提供java正则表达式语法的相关文章、下载和专题,供大家免费下载体验。

8902

2023.07.05

java正则表达式匹配字符串
java正则表达式匹配字符串

在Java中,我们可以使用正则表达式来匹配字符串。本专题为大家带来java正则表达式匹配字符串的相关内容,帮助大家解决问题。

812

2023.08.11

正则表达式空格
正则表达式空格

正则表达式空格可以用“s”来表示,它是一个特殊的元字符,用于匹配任意空白字符,包括空格、制表符、换行符等。本专题为大家提供正则表达式相关的文章、下载、课程内容,供大家免费下载体验。

520

2023.08.31

Python爬虫获取数据的方法
Python爬虫获取数据的方法

Python爬虫可以通过请求库发送HTTP请求、解析库解析HTML、正则表达式提取数据,或使用数据抓取框架来获取数据。更多关于Python爬虫相关知识。详情阅读本专题下面的文章。php中文网欢迎大家前来学习。

693

2023.11.13

正则表达式空格如何表示
正则表达式空格如何表示

正则表达式空格可以用“s”来表示,它是一个特殊的元字符,用于匹配任意空白字符,包括空格、制表符、换行符等。想了解更多正则表达式空格怎么表示的内容,可以访问下面的文章。

406

2023.11.17

Tailwind CSS 如何制作导航栏和卡片
Tailwind CSS 如何制作导航栏和卡片

用 Tailwind CSS 制作导航栏和卡片,可先搭建语义化结构,再组合 Flex、Grid、间距、圆角与阴影类。这里整理横向导航、移动端菜单、卡片网格及悬停效果的相关文章,帮助你把常见页面组件做得清晰且适配不同屏幕。

0

2026.11.03

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
墨刀帮助中心
墨刀帮助中心

共0课时 | 0人学习

MyEclipse学习中心
MyEclipse学习中心

共0课时 | 0人学习

Apache Subversion 官方手册
Apache Subversion 官方手册

共0课时 | 0人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn