查找所有图像并将其从 html 转换为 base64
我正在使用 html2canvas 开发一个屏幕截图项目。我的业务受限于无法渲染的图片,导致该url中的所有图片都无法显示。
但我尝试用已转换为 Base64 的新图像替换其中一个图像网址,并且它有效。
所以在这里我找到了解决方案,只是不能应用于我的网站。我需要帮助来编译代码才能完成我的项目。
有什么方法可以更改此代码:
<?php
echo '
<html>
<body>
<div><img src="/image1.jpg" /></div>
<p><img src="/image2.png" /></p>
</body>
</html>
'
?>
到
<?php
echo '
<html>
<body>
<div><img src="base64,/9j/4AAQSkZJRgABAQAAAQABAA_blablabla..." /></div>
<p><img src="base64,/9h/4AAQSkZJRgABAQAAAQABAA_blablabla..." /></p>
</body>
</html>
'
?>
我已经尝试使用此代码 FROM 如何将图像转换为 Base64 编码?
$path = 'myfolder/myimage.png';
$type = pathinfo($path, PATHINFO_EXTENSION);
$data = file_get_contents($path);
$base64 = 'data:image/' . $type . ';base64,' . base64_encode($data);
但不能将其应用于所有图像 URL。
更新===
这个问题的主要主题是如何将所有图像转换为base64
我假设如果像这样使用 jQuery 它是如何工作的:
<script>
$(function(){
$('img').each(function() {
$(this).attr('src', 'BASE64 GENERATED');
});
});
</script>
要遵循的最佳实践是 DOMDocument ,下面是如何执行此操作的示例。
$html = '<html>....</html>';
$dom = new DOMDocument();
$dom->loadHTML(mb_convert_encoding($html, 'HTML-ENTITIES', 'UTF-8'));
$images = $dom->getElementsByTagName('img');
foreach ($images as $image) {
$src = $image->getAttribute('src');
$type = pathinfo($src, PATHINFO_EXTENSION);
$data = file_get_contents($src);
$base64 = 'data:image/' . $type . ';base64,' . base64_encode($data);
$image->setAttribute("src", $base64);
}
$html = $dom->saveHTML();
azjezz 的回答对我帮助很大,但我必须添加以下代码行才能在 word 365 上查看图像: $html = preg_replace("/