How to insert a webp image into a document?

Question

I am trying to insert a webp format image into a table in a document - however it's giving me an error. When I try with a jpg file, I am able to insert the image at the top of the file (I don't know how to insert inside the table - I have {image1} text in the position where I want to insert the image.)

My code is, which works fine:

  var product_image = UrlFetchApp.fetch("https://laz-img-cdn.alicdn.com/images/ims-web/TB1HKyxaMFY.1VjSZFqXXadbXXa.png").getBlob();
  body.replaceText('{image1}', "img");
  body.insertImage(0, product_image);

But when I change the URL to a webp image, it gives mean an invalid data error. For examples this code:

  var product_image = UrlFetchApp.fetch("https://my-test-11.slatic.net/original/ed9960ec66acc822e34fdeac570211e0.jpg_340x340q80.jpg_.webp").getBlob();

Answer 1

I don't think you can do this, see documentation:

contentType String The MIME type to convert to. For most blobs, 'application/pdf' is the only valid option. For images in BMP, GIF, JPEG, or PNG format, any of 'image/bmp', 'image/gif', 'image/jpeg', or 'image/png' are also valid.

Answer 2

This answer is not offered as an explanation of how to insert a webp image into a table in Google Docs. Cătălin George Feștilă has already answered that question.

You mentioned, in passing, that you didn't know how to "insert [the image] inside the table".

Google Script - Insert image in a Google Doc Table from StackOverflow addresses this issue specifically. I've merely adapted it to your data.

FWIW, I deliberately added a second table to demonstrate that the script would only insert the image where/when it found "{image1}". So, it's unnecessary to know which table/row/column to use; the script will handle this because as it loops through the tables looking for a match on the image variable.

---

function myFunction() {
  
  // get the image
  var product_image = UrlFetchApp.fetch("https://laz-img-cdn.alicdn.com/images/ims-web/TB1HKyxaMFY.1VjSZFqXXadbXXa.png").getBlob();
  
  // Get the document to which this script is bound.
  var doc = DocumentApp.getActiveDocument();
  var body = doc.getBody();
  var tables = body.getTables();
  // Logger.log(tables); // DEBUG
  
  for (var k in tables){
   var table = tables[k];
   // Logger.log("DEBUG: table#="+k)
   var tablerows=table.getNumRows();
     for ( var row = 0; row < tablerows; ++row ) {
       var tablerow = table.getRow(row);
       // Logger.log("DEBUG: row#="+row)
        for ( var cell=0; cell < tablerow.getNumCells(); ++cell) {
            // Logger.log("DEBUG: cell#"+cell);
            var celltext = tablerow.getChild(cell).getText();
            // Logger.log(DEBUG: celltext);
            if(celltext == "{image1}") {
              table.replaceText("{image1}", "");
              table.getCell(row, cell).insertImage(0, product_image);
            }
         }
      }
    }
}

---

Before

---

After