CODEWITHSUNDEEP
htmlms-wordbase64
St. John Johnson
St. John Johnson

Reputation: 6660

How to display images in Word generated from HTML?

I'm currently creating a Word document by generating HTML and changing the header information to display as a .doc file. It's a poor man's method, but it works just fine (until now).

I was just asked to include an image in the file. My best idea was to base64 embed the image. This works fine in a browser, however Word just gives me a box with an X in it.

Suggestions on how I can embed an image into this file and have it display in Microsoft Word?

Upvotes: 13

Views: 41838

Answers (5)

Алексей Зайчиков
Алексей Зайчиков

Reputation: 1

 MIME-Version: 1.0
Content-Type: multipart/related; boundary="----=_NextPart_"

------=_NextPart_
Content-Location: file:///C:/Doc2.htm
Content-Transfer-Encoding: quoted-printable
Content-type: text/html; charset="utf-8"

<html xmlns:v=3D"urn:schemas-microsoft-com:vml">
<head>
<style>
</style>
</head>

<body>

  <v:shape style=3D'width:234.75pt;height:135.75pt;'>
     <v:imagedata src=3D"Doc2/i1.png" />
  </v:shape>

</body>

</html>


------=_NextPart_
Content-Location: file:///C:/Doc2/i1.png
Content-Transfer-Encoding: base64
Content-Type: image/png

iVBORw0KGgoAAAANSUhEUgAAATkAAAC1CAYAAAAk5IjmAAAAAXNSR0IArs4c6QAAAARnQU1BAACx
..
AAAAAElFTkSuQmCC

------=_NextPart_--

Upvotes: 0

Ashish
Ashish

Reputation: 1917

I had the similar problem. I solved it by decoding the Base64 images to disk and creating a link to the images, deploying a servlet in my application to listen to the link pointed by images on disk. Here is the solution I implemented:

How to convert HTML to well formed DOCX with styling attributes intact

Upvotes: -1

Cris Denver Labe
Cris Denver Labe

Reputation: 41

You can use this html-docx.js

You just have to call htmlDocx.asBlob("YOUR HTML")

Link to sample html to doc generation with image.

Upvotes: 3

Jeff
Jeff

Reputation: 11

I just achieved this by printing the DOCX to PDF then using Acrobat to Save As to HTML. Images showed up small, but there.

Upvotes: 1

Pekka
Pekka

Reputation: 449415

That's a tough one, Word isn't able to handle data: base64 encoded images in HTML, at least that's the outcome in this question and this MSDN discussion.

You have three options:

  • Create a folder in the location of the document, store it alongside the document, and reference images relatively (<img src='imageFolder/image1.jpg'>)

  • Work with absolute URLs or file paths (even more sucky)

  • Look into the new Word > 2003 XML based file format(s), it is definitely possible there.

The only other option I can think of is actually creating a native Word file, e.g. using OpenOffice.

Upvotes: 16

Related Questions