獲取Word文檔中的所有圖像

Question

我正在嘗試獲取Word文檔中圖像的集合。 此頁面的文檔： https ://dev.office.com/reference/add-ins/word/inlinepicture從字面上看是對示例的剪貼，並不實際顯示如何獲取圖像-僅顯示第一。

每個圖像我需要以下內容：

• 數據
  任何格式都可以。 我看到有一個getBase64ImageSrc方法-可以。
• 文件名
  沒有image_{n}文件名-我可以看到API沒有它-我可以使用替代文本或僅使用image_{n}來構建它， 其中{n}是圖像索引 ，但是我看不到獲取擴展名的方法-是這在數據中作為data:image/jpeg;blahblah ??? 我不知道文檔沒有此級別的信息。

到目前為止，我有以下代碼，但實際上不確定是否會起作用：

Word.run(

async (context) =>
{
    // Create a proxy object for the pictures.
    const allPictures = context.document.body.inlinePictures;

    // Queue a command to load the pictures
    context.load(allPictures);

    // Synchronize the document state by executing the queued commands,
    // and return a promise to indicate task completion.
    return context.sync().then(() => allPictures);
})
.then((allPictures) =>
{
    const images: IFileData[] = [];
    let picture: Word.InlinePicture | undefined;
    let imageCount = 0;

    while (undefined !== (picture = allPictures.items.pop()))
    {
        const data = picture.getBase64ImageSrc();
        const extension = ""; // TODO: no idea how to find this
        const filename =
            (
                Strings.isNullOrEmpty(picture.altTextTitle)
                    ? `image_${imageCount++}`
                    : Path.toFriendlyUrl(picture.altTextTitle)
            )

        images.push({
            filename: filename + extension,
            data: data
        });
    }

    resolve(images);
})
.catch((e) => reject(e));

我在這里使用一些自定義幫助程序，它們會執行以下操作：

• Strings.isNullOrEmpty
  如果string為null或為空，則返回true，否則返回false
• Path.toFriendlyUrl
  返回將空格轉換為-的字符串以及其他一些改進

---

我目前的方法正確嗎？

Answer 1

請檢查他正在做您需要的樣品 。 我認為您的路線正確。

這是一些示例代碼：

 async function run() { await Word.run(async (context) => { let myImages = context.document.body.inlinePictures; myImages.load("imageFormat"); await context.sync(); if (myImages.items.length >0) console.log(myImages.items[0].imageFormat); else console.log("no image found.") }); } 

注意，我們有一個imageFormat屬性，問題是我們在預覽CDN上有它。 （使用https://appsforoffice.microsoft.com/lib/beta/hosted/office.js ）。 我們沒有圖片名稱，但是您可以使用替代文字來存儲它。

Answer 2

“正確”是有效的...我可以解決一個特定的問題：獲取圖像類型-您所謂的“文件名”。 由於時間有點長，答案是：可以，但是您必須為此付出一點努力。

這樣，Word並不總是為文檔中的圖像存儲文件名，除非該圖像鏈接到外部源。 但是，它存儲的是圖像本身以及在Word Open XML文檔中進行管理所需的信息。 存儲的信息的一部分是圖形圖像類型 ，它是文檔和圖像二進制代碼之間內部關系的一部分。

對象模型（無論是JS還是COM）都不提供對此信息的任何直接訪問。 但是，可以從文檔的Word Open XML中讀取它。 此代碼可以獲取OPC平面文件格式的InlineShape的特定Word Open XML字符串：

    const range = context.document.body.inlinePictures.getFirst();
    var sXML = range.getRange("Whole").getOoxml();
    range.load("Ooxml");

    await context.sync();

    console.log(sXML.value);

在Open XML的document.xml部分中，按如下方式（部分）引用了InlineShape －請參閱具有屬性r:embed="rId6"最后一個元素。

<w:p><w:r><w:drawing><wp:inline distT="0" distB="0" distL="0"
distR="0"><wp:extent cx="2944608" cy="1753392"/><wp:effectExtent l="0"
t="0" r="8255" b="0"/><wp:docPr id="1" name="Picture 1"/>
<wp:cNvGraphicFramePr><a:graphicFrameLocks noChangeAspect="1" 
xmlns:a="http://schemas.openxmlformats.org/drawingml/2006/main"/>
</wp:cNvGraphicFramePr><a:graphic xmlns:a="http://schemas.openxmlformats.org/drawingml/2006/main">
<a:graphicData uri="http://schemas.openxmlformats.org/drawingml/2006/picture">
<pic:pic xmlns:pic="http://schemas.openxmlformats.org/drawingml/2006/picture">
<pic:nvPicPr><pic:cNvPr id="0" name="Schweiz.png"/><pic:cNvPicPr/></pic:nvPicPr>
<pic:blipFill><a:blip r:embed="rId6">...

rId6是關系ID-它告訴Word在哪里可以查找有關嵌入式圖像的詳細信息。 可以在<pkg:part pkg:name="/word/_rels/document.xml.rels" ，如下所示：

<Relationship Id="rId6" 
Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/image" 
Target="media/image1.png"/>

如您所見，文件類型在此處可用。 如果使用標准XML工具來解析XML字符串，則可以獲得類似的信息。

使用標准XML技術的替代方法是使用標准Microsoft Open XML SDK（C＃或VB.NET）分析Word Open XML，或使用JavaScript的Open XML SDK（ http://www.ericwhite.com/blog / open-xml-sdk-for-javascript / ）。 在這種情況下，您將無法直接讀取“相關”。 而是，“工具”查找相應的“包”（在本例中為“ media / image1.png”）並返回該信息。 如您所見，其中包括屬性pkg：contentType，該屬性為您提供文件擴展名。

<pkg:part pkg:name="/word/media/image1.png" pkg:contentType="image/png" pkg:compression="store">