0

我正在尝试获取 Word 文档中的图像集合。此页面的文档：https ://dev.office.com/reference/add-ins/word/inlinepicture 从字面上看是示例的剪切粘贴，实际上并未显示如何获取图像 - 只有第一。

每张图片我需要以下内容：


  • 任何格式的数据都可以。我看到有一种getBase64ImageSrc方法 - 这会做。
  • 文件名
    没有文件名很好 - 我可以看到 API 没有它 - 我可以使用 alt 文本或只是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
    如果字符串为空或空则返回真，否则返回假
  • Path.toFriendlyUrl
    返回带有空格转换的字符串-和一些其他改进

我目前的方法正确吗？

4

2 回答 2

2

请查看他的样品，它正在做您需要的事情。我认为你在正确的轨道上。

这是一些示例代码：

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）。我们没有图像名称，但您可以使用替代文本来存储它。

于 2018-07-10T17:59:34.747 回答
0

“正确”是有效的......我可以解决一个具体问题：获取图像类型 - 你称之为“文件名”。由于这有点长，答案是：你可以，但你必须为此努力。

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）或使用用于 JavaScript 的 Open XML SDK（http://www.ericwhite.com/blog ）分析 Word Open XML /open-xml-sdk-for-javascript/）。在这种情况下，您无法直接读取“rels”。相反，“工具”会查找相应的“包”（在本例中为“media/image1.png”）并返回该信息。如您所见，这包括属性 pkg:contentType，它为您提供文件扩展名。

<pkg:part pkg:name="/word/media/image1.png" pkg:contentType="image/png" pkg:compression="store">
于 2018-07-10T15:07:24.140 回答