如何在 DOMPDF 生成器上显示背景图像

Question

到目前为止，我一直在尝试使用以下代码：

<style>
    body {
        background-image: url(http://example.com/wp-content/uploads/2016/04/myImage.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
    }
</style>

然而，这不会在生成的 PDF 上呈现图像。

正文中的纯图像标签采用这种格式，可以正常工作并显示：

<img src="/home/example/public_html/wp-content/uploads/2016/04/myImage.jpg">

有人知道这是为什么吗？我该怎么做才能使背景图像实际显示在生成的 pdf 中？

更新:

我现在已经尝试 base64_encode() 所有可能的链接..意味着我已经通过了，

/home/example/public_html/wp-content/uploads/2016/04/myImage.jpg

http://example.com/wp-content/uploads/2016/04/myImage.jpg

/wp-content/uploads/2016/04/myImage.jpg

这些通过 base64_encode() 函数的 ^ 组合，其中 none 已用于显示背景图像。

Answer 1

我已经弄明白了。我没有意识到的是，放在一起的 html 位于我的 wordpress 主题文件夹的文件夹中，所以为了访问我需要的图像，我需要根据位置返回几个目录html 文件在我的文件结构中。我试图从媒体库中访问附加到 post 的图像。

解决方法很简单：

background-image: url(../../uploads/2016/04/myImage.jpg);

Answer 2

更灵活的解决方案

这样您就不必知道生成 PDF 的目录的相对性。

..include setup.dompdf.php in your generator script

<?php 

    $webRoot = '/var/www/html/';

    $dompdf = new Dompdf($this->dompdf_options);
    $dompdf->setBasePath($webRoot);

?>

然后您可以从生成 pdf 的任何脚本中相对于网络根目录引用 css 中的任何文件。

<style>
    body {
        background-image: url(wp-content/uploads/2016/04/myImage.jpg);
    }
</style>

Answer 3

我知道这个问题很老了，但总有其他答案的余地。

你可以尝试使用base64。这是代码：

获取图片内容。

$data = file_get_contents('absolute/path/to/background-image.jpg');

将其转换为 base64。

$base64 = 'data:image/' . $type . ';base64,' . base64_encode($data);

在CSS中这样使用。

body { background-image: url(<?php echo $base64 ?>); }

但请记住，背景大小属性无法正常工作，至少就我而言是这样。

如何在 DOMPDF 生成器上显示背景图像

How to get background image showing on DOMPDF generator

css

pdf

background-image

dompdf

更灵活的解决方案