如何移除PHP提取的Summernote内容中的Base64图片字符串？

嘿，这个需求太常见了！从Summernote导出的HTML里清理那些体积臃肿的Base64图片，用PHP有两种靠谱的方案，你可以根据自己的HTML复杂度来选：

方案一：正则表达式快速处理（适合简单HTML） #

如果你的内容结构规整，没有太多嵌套或特殊标签，用正则能快速搞定。核心思路是匹配所有src属性以data:image开头的<img>标签，直接替换为空。

代码示例：

// 你的原始Summernote内容
$originalContent = '<p>several text here </p> <p>several text again here </p> <p><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAB4AAAAQ4CAYAAADo08FDAAAgAElEQVR4AeydCXxU1dn/f5M9IQvLANnYt6BCIhI3xC1xC1WwUAvV...</p>';

// 正则匹配并移除所有Base64图片标签
$cleanedContent = preg_replace('/<img[^>]+src="data:image[^"]+"[^>]*>/i', '', $originalContent);

// 输出清理后的纯文本内容
echo $cleanedContent;

简单解释下这个正则逻辑：

• <img[^>]+：匹配<img开头到src属性前的所有内容，避免漏掉其他属性
• src="data:image[^"]+"：精准锁定Base64格式的图片地址
• [^>]*>：匹配标签剩余部分，确保整个<img>标签被完整选中
• i修饰符：不区分大小写，兼容data:Image这类不规范写法

方案二：DOMDocument严谨处理（适合复杂HTML） #

如果你的HTML结构复杂（比如多层嵌套、有换行或特殊属性），正则容易出现漏匹配或误匹配，这时候用PHP的DOM解析库更稳妥。

代码示例：

$originalContent = '<p>several text here </p> <p>several text again here </p> <p><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAB4AAAAQ4CAYAAADo08FDAAAgAElEQVR4AeydCXxU1dn/f5M9IQvLANnYt6BCIhI3xC1xC1WwUAvV...</p>';

$dom = new DOMDocument();
// 关闭XML错误提示，避免HTML格式不规范时抛出报错
libxml_use_internal_errors(true);
// 手动指定UTF-8编码，防止中文乱码
$dom->loadHTML('<?xml encoding="UTF-8">' . $originalContent);
libxml_clear_errors();

// 获取所有图片标签
$images = $dom->getElementsByTagName('img');

// 必须倒序遍历（正序移除元素会导致索引混乱，漏处理后续图片）
for ($i = $images->length - 1; $i >= 0; $i--) {
    $imgElement = $images->item($i);
    $srcValue = $imgElement->getAttribute('src');
    
    // 判断是否为Base64图片
    if (str_starts_with($srcValue, 'data:image')) {
        // 移除该图片标签
        $imgElement->parentNode->removeChild($imgElement);
    }
}

// 提取处理后的内容，去掉DOM自动添加的<html><body>标签
$cleanedContent = $dom->saveHTML($dom->getElementsByTagName('body')->item(0));
$cleanedContent = str_replace(['<body>', '</body>'], '', $cleanedContent);

echo $cleanedContent;

注意：如果你的PHP版本低于8.0，str_starts_with函数不支持，可以换成substr($srcValue, 0, 11) === 'data:image'来判断。

要是你不想移除整个图片标签，只想清空Base64字符串保留空标签，把$imgElement->parentNode->removeChild($imgElement)改成$imgElement->setAttribute('src', '')就行。

内容的提问来源于stack exchange，提问作者ytse_jam