html-docx-js 包产生不可读的内容答案

【问题标题】：html-docx-js package produces unreadable contenthtml-docx-js 包产生不可读的内容
【发布时间】：2020-12-19 22:43:01
【问题描述】：

最近有没有人能够让 html-docx-js 工作？

我试过了：

var newHTML =
      "<!DOCTYPE html><html><head lang='en'><meta charset='UTF-8'><title>Report</title></head><body>" +
      htmlPreview +
      "</body></html>"
    const newBlob = htmldocx.asBlob(newHTML)
    saveAs(newBlob, "example2.docx")

其中 htmlPreview 只是一个有效的 HTML 字符串。

但是，当我尝试在 Word 中打开 example2.docx 时，出现此错误：

“Word 发现不可读的内容”

当我在基本文本编辑器中打开 example2.docx 时，我得到了：

PK
      yQ               _rels/PK
      yQ               word/PK
      yQ"?!à       word/document.xml<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<w:document
  xmlns:w="http://schemas.openxmlformats.org/wordprocessingml/2006/main"
  xmlns:m="http://schemas.openxmlformats.org/officeDocument/2006/math"
  xmlns:r="http://schemas.openxmlformats.org/officeDocument/2006/relationships"
  xmlns:wp="http://schemas.openxmlformats.org/drawingml/2006/wordprocessingDrawing"
  xmlns:a="http://schemas.openxmlformats.org/drawingml/2006/main"
  xmlns:ns6="http://schemas.openxmlformats.org/schemaLibrary/2006/main"
  xmlns:c="http://schemas.openxmlformats.org/drawingml/2006/chart"
  xmlns:ns8="http://schemas.openxmlformats.org/drawingml/2006/chartDrawing"
  xmlns:dgm="http://schemas.openxmlformats.org/drawingml/2006/diagram"
  xmlns:pic="http://schemas.openxmlformats.org/drawingml/2006/picture"
  xmlns:ns11="http://schemas.openxmlformats.org/drawingml/2006/spreadsheetDrawing"
  xmlns:dsp="http://schemas.microsoft.com/office/drawing/2008/diagram"
  xmlns:ns13="urn:schemas-microsoft-com:office:excel"
  xmlns:o="urn:schemas-microsoft-com:office:office"
  xmlns:v="urn:schemas-microsoft-com:vml"
  xmlns:w10="urn:schemas-microsoft-com:office:word"
  xmlns:ns17="urn:schemas-microsoft-com:office:powerpoint"
  xmlns:odx="http://opendope.org/xpaths"
  xmlns:odc="http://opendope.org/conditions"
  xmlns:odq="http://opendope.org/questions"
  xmlns:odi="http://opendope.org/components"
  xmlns:odgm="http://opendope.org/SmartArt/DataHierarchy"
  xmlns:ns24="http://schemas.openxmlformats.org/officeDocument/2006/bibliography"
  xmlns:ns25="http://schemas.openxmlformats.org/drawingml/2006/compatibility"
  xmlns:ns26="http://schemas.openxmlformats.org/drawingml/2006/lockedCanvas">
  <w:body>
    <w:altChunk r:id="htmlChunk" />
    <w:sectPr>
      <w:pgSz w:w="12240" w:h="15840" w:orient="portrait" />
      <w:pgMar w:top="1440"
               w:right="1440"
               w:bottom="1440"
               w:left="1440"
               w:header="720"
               w:footer="720"
               w:gutter="0"/>
    </w:sectPr>
  </w:body>
</w:document>
PK
      yQ½`'N 'N    word/afchunk.mhtMIME-Version: 1.0
Content-Type: multipart/related;
    type="text/html";
    boundary="----=mhtDocumentPart"


------=mhtDocumentPart
Content-Type: text/html;
    charset="utf-8"
Content-Transfer-Encoding: quoted-printable
Content-Location: file:///C:/fake/document.html

后面是我的输入字符串。

【问题讨论】：

标签： javascript html npm ms-word docx

【解决方案1】：

html-docx-js 使用“altChunk”标记在 Docx 文件中嵌入原始 HTML 文档。

很遗憾，MacOS 或 Google 云端硬盘不支持此功能，这就是您看到的是空白文档的原因。在 Windows 上的 Word 中打开它（甚至在 Office365 上在线打开它）以使其工作。

【讨论】：