用 PHP 中的“data-src”属性替换 HTML 中的所有“src”属性

Question

我正在创建一个接收 HTML 电子邮件的应用程序。

出于安全考虑，我们希望禁用在这些电子邮件中自动加载图像。

游戏计划：

1. 消毒
2. 将IMG标签中的所有src属性替换为PHP中的data-src属性（使用相同的值）
3. 向前端添加按钮
4. 单击时将data-src 属性更改回img 并允许浏览器允许加载图像。

我现在的问题： 我可以编写一个基本的正则表达式来替换简单的<img src="abc.jpg" /> 中的src 属性，但我不知道如何在更复杂甚至可能格式错误的html 中用data-src 替换src。

我想复杂吗？有没有简单的方法可以解决这个问题？

Answer 1

在有问题的情况下，您会遇到

src=

当然，有些空格可以在 = 之前或之后。人们可能倾向于忽略撇号和引号之间的实例，但您无法避免这种复杂的攻击，例如

<script type="text/javascript">
    var img = '<img src="foo">';
    document.body.innerHTML += img;
</script>

最好是在类似浏览器的环境中解析 HTML 并运行

document.querySelectorAll("img[src]").length

页面加载后。如果为 0，那么您没有 src。但是，您可能仍然有将某些 CSS 文件链接到定义了 background-image 属性的 HTML 的危险。

所以，我将实现一个正则表达式来防止src= 和background-image:（可能带有空格）。最好的情况是根本不允许运行 Javascript，并且 CSS 也不允许使用外部源代码。