HTML image displaying in email but not PDF

[Anonymous]

In my flow I've built a HTML table and referenced the image (which is stored in a SharePoint attachments folder) as follows:

<img src="Sharepointlink.jpg"alt="Observation images" width="100" height="100"/>

I used OneDrive 'Create file' then the 'Convert file using path' to convert to PDF.  I've added the HTML table to the body of my email and the PDF file as an attachment. 

In my email the images appear as I'd like:

Email content

But not in the PDF:

PDF file

I'm guessing I'm missing something from the URL code for it not to be rendering the image in PDF. I don't think the Base64 applies to this though as the images aren't stored in a file library right?

[DamoBird365 · Accepted solution]

Hi @Anonymous 

You need to convert an image into a dataURI.  This can be done with an expression.

I have saved a microsoft.png image to my one drive, converted the image to datauri and then within my html called <img src=like so:

You can then create an html file, convert the file and then create a copy of the output from the convert.

and this is what I got:

If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.
Cheers,
Damien

P.S. take a look at my new blog here

[Anonymous]

Thank you @DamoBird365 . I didn't realise there was an expression for dataURI. I've tried it with attachment content and have had some success. But since I'm doing this within an apply to each, I'm only getting the first image appearing on my PDF. Good start though! 

I'll play around with it some more to see if I can get the other images displaying.

[Anonymous]

@DamoBird365 

OK I need more help with this as I can't work out why only my first image is displaying. 

So I have one flow which runs on create of a SP item, gets the attachment content, converts it to dataURI,  concats it into an <img src /> expression and saves that variable to a column for that SP list item. The 2nd flow is a PowerApps button one that creates a HTML table and the PDF file to be emailed to the user.

Converting attachment content to dataUri and creating a concat variable

The dataUri expression for my datauri variable is: dataUri(outputs('Get_attachment_content')?['body'])

The html variable is set to: concat('<img src=','"',variables('datauri'),'"/>').

If I check the field where the html expression is saved, it all looks fine. For multiple images it's saved each expression as one long string. This is how it looks when I inspect the html of the email I received.

On inspection of the html in the email

This is what I got:

as displayed in email

As far as I can see, nothing seems to be wrong with the HTML itself. Could the issue be with the conversion to the dataUri image that follows the first one?

[Anonymous]

So instead of using 'append to string variable' for my dataURI variable, I used Compose and that resolved the issue.

[tscholl87]

Hi @DamoBird365 ,

Can you elaborate on what is inside each of these steps a little more??

I've got a HTML doc, with an image top left and I get the datauri step - datauri(outputs('Get_file_content_using_path')?['body'])

But how do you then do the part where you put that img src="outputs"?

[Anonymous]

@tscholl87  You will need to add it to your HTML script like this:

<img src="', outputs('Compose'), '"alt="doc image" width="100" height="100">