Display local image in pdf file


i'am using HTML-PDF node to create a a pdf file. i send a table in mustache template node as an input and it create me a pdf file containing that table. My problem is, i went to add a local image inside that table.
i have tried those three lines but none of them works

  <p><img style="display: block; margin-left: auto; margin-right: auto;" src="C:/Users/Public/img/logo.png" />1</p>
    <p><img style="display: block; margin-left: auto; margin-right: auto;" src="C:\Users\Public\img\logo.png" />2</p>
    <p><img style="display: block; margin-left: auto; margin-right: auto;" src="C:\\Users\\Public\\img\\logo.png"/>3</p>

any ideas?. And thank you.



You will need to set the http configuration in your settings.js file

see https://nodered.org/docs/configuration

1 Like


httpStatic in my settings.js file is already configured and works fine. i uncomment it and i fixed my static folder path.



i don't know is there a difference between mustache template node and dashboard template node when i add a local image inside it.
in dashboard template node this works and i can display my image.
<img src="/start.png" height="189" width="632" >
but, this doesn't work in mustache template node. i found nothing in my file.



Have you checked if the pdf node supports embedding images? Have you tried an image that is hosted publicly on the internet to test with?



an image from internet works. i test it.



i still can't find a solution for a local image. any help would be appreciated.



My guess, without knowing which pdf node you're using, is it isn't embedding the actual image data, rather linking to it. When you use a public url, the pdf is able to load the image. When you use a relative image url like /start.png then when you open the pdf it has no idea what /start.png is relative to.

You could try changing that to a full url lie http://localhost:1880/start.png - but that will only work when you open the pdf on the same machine. If you want to give that pdf to someone else, you'd need that image to be hosted on the public internet.

The alternative is to investigate how to embed the image data inside the pdf rather than just link to it. I have no idea if the pdf node you're using is capable of doing that. If you let us know which node module you are using we may be able to help answer that part.

1 Like


i'am using this node.



your suggestion works, and i only need to open pdf on my machine.
Thanks a lot.



why this doesn't work ???
<img style="display: block; margin-left: auto; margin-right: auto; width: 100%; height: 100%;" ng-src="http://localhost:1880/client/{{payload.name}}/name.png"/>
the image doesn't show up in my pdf !!!



i have found a solution
i just concatinate the src of image in function then send it to my template.