Office插件開發：在Word 2016中插入圖片/圖片

Question

我想問一下在JavaScript中插入圖片/圖片到文檔的最佳方式是什麼？我正在權衡在線和離線圖像，但不知道從哪裏開始。

我試過搜索API參考，但缺乏代碼示例，我無法完全理解「如何」。

任何幫助將不勝感激。乾杯!

Answer 1

我們可以通過OOXML，Html將圖像插入到文檔中。使用Html插入在線圖像很容易。這是給你參考的例子：

function InsertImageHtml() { 

    var imgHTML = "<img " + 
" src=''" 
+ " alt ='apps for Office image1' />  "; 

    Office.context.document.setSelectedDataAsync(
     imgHTML, { coercionType: "html" }, 
     function (asyncResult) { 
      if (asyncResult.status == "failed") { 
       write('Error: ' + asyncResult.error.message); 
      } 
     }); 
} 

而且新版本Word API還支持插入與基地64個數據格式嵌入圖片的圖像。你可以參考下面的例子：

function insertImageBase64New() { 

    Word.run(function (context) { 

     var body = context.document.body; 

     body.insertInlinePictureFromBase64(getBase64(), Word.InsertLocation.start); 

     return context.sync().then(function() { 
      console.log('Added base64 pictures to the beginning of the document body.'); 
     }); 
    }) 
    .catch(function (error) { 
     console.log('Error: ' + JSON.stringify(error)); 
     if (error instanceof OfficeExtension.Error) { 
      console.log('Debug info: ' + JSON.stringify(error.debugInfo)); 
     } 
    }); 
} 

function getBase64() { 
    return "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"; 
}