cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
calvares
Continued Contributor
Continued Contributor

HTML image displaying in email but not PDF

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 contentEmail content

But not in the PDF:

PDF filePDF 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?

1 ACCEPTED SOLUTION

Accepted Solutions
DamoBird365
Super User
Super User

Hi @calvares 

 

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

 

DamoBird365_0-1617910209776.png

 

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:

DamoBird365_1-1617910209684.png

 

 

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

 

DamoBird365_2-1617910210301.png

 

 

and this is what I got:

DamoBird365_3-1617910209947.png

 

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

View solution in original post

4 REPLIES 4
DamoBird365
Super User
Super User

Hi @calvares 

 

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

 

DamoBird365_0-1617910209776.png

 

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:

DamoBird365_1-1617910209684.png

 

 

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

 

DamoBird365_2-1617910210301.png

 

 

and this is what I got:

DamoBird365_3-1617910209947.png

 

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

View solution in original post

calvares
Continued Contributor
Continued Contributor

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.

calvares
Continued Contributor
Continued Contributor

@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 variableConverting 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 emailOn inspection of the html in the email

This is what I got:

as displayed in emailas 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?

calvares
Continued Contributor
Continued Contributor

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

Helpful resources

Announcements
UG GA Amplification 768x460.png

Launching new user group features

Learn how to create your own user groups today!

Community Connections 768x460.jpg

Community & How To Videos

Check out the new Power Platform Community Connections gallery!

Welcome Super Users.jpg

Super User Season 2

Congratulations, the new Super User Season 2 for 2021 has started!

Carousel 2021 Release Wave 2 Plan 768x460.jpg

2021 Release Wave 2 Plan

Power Platform release plan for the 2021 release wave 2 describes all new features releasing from October 2021 through March 2022.

Top Solution Authors
Users online (2,685)