Setting link URL with Google Docs API doesn't result in update of image - image

I'm trying to update a placeholder image with a new image that has an updated URL. The URL in fact is a valid Google Static Map URL that I'm using in other contexts successfully. I'm using the Google Document API to manipulate the document. Following the code I've been using:
var element = body.findElement(DocumentApp.ElementType.INLINE_IMAGE).getElement();
var imageMap = element.asInlineImage();
// if there was an image found in document
if (imageMap != null) {
// get current parent and index inside parent
var parent = imageMap.getParent();
var childIndex = parent.getChildIndex(imageMap);
// remove image from paragraph
imageMap = imageMap.removeFromParent();
// get static image url for territory
var url = getStaticMapURLForTerritory(id);
Logger.log(url);
imageMap.setLinkUrl(url);
// create a new image
parent.insertInlineImage(childIndex, imageMap)
}
This seems to work fine in that it does update the image url correctly. However, the image itself (the result of the url) is not updated. When I click on the link URL it does return the correct image.
Is there a way to force a refetch of the image blob associated with the URL? I've also attempted to use UrlFetchApp but that complains about a missing size parameter (google static api) which is certainly included in the url string and within the max 640x640 bounds.
I've exhausted all my options unless....
TIA, --Paul

setLinkUrl only does that: sets the link. To actually add a new image you'll have to get its blob:
function replaceImage() {
// [...]
// get static image url for territory
const url = getStaticMapURLForTerritory(id)
const response = UrlFetchApp.fetch(url)
// create a new image
parent.insertInlineImage(childIndex, response.getBlob())
.setAltDescription(img.getAltDescription())
.setAltTitle(img.getAltTitle())
.setWidth(img.getWidth())
.setHeight(img.getHeight())
.setLinkUrl(url)
}
References
Class InlineImage (Google Apps Script reference)

Related

Insert Image into a Google Sheet with Apps Script using base64 encoded data

Given some base64 encoded data for a png file, as in the example below from the image tag.
<img src="data:image/png;base64,R0lGODlhDAAMAKIFAF5LAP/zxAAAANyuAP/gaP///wAAAAAAACH5BAEAAAUALAAAAAAMAAwAAAMlWLPcGjDKFYi9lxKBOaGcF35DhWHamZUW0K4mAbiwWtuf0uxFAgA7">
I need to create an image blob from the base64 encoded data for the insertImage() method.
sheetClass.insertImage(imageBlob, column, row)
Documentation:
Sheets Class - insertImage method
I've tried using the code below, but it throws the error:
Execution failed: Error retrieving image from URL or bad URL
The documentation states that the method needs a blob, not a URL, but it seems like it's expecting a link to an image file.
function insertImageFromBase64Src() {
var data = 'R0lGODlhDAAMAKIFAF5LAP/zxAAAANyuAP/gaP///wAAAAAAACH5BAEAAAUALAAAAAAMAAwAAAMlWLPcGjDKFYi9lxKBOaGcF35DhWHamZUW0K4mAbiwWtuf0uxFAgA7';
var imageBlob = Utilities.newBlob(Utilities.base64Decode(data), 'image/png').getBytes();
var ss = SpreadsheetApp.getActiveSpreadsheet();//This code is bound to a Sheet
var po = {
shName:'Update File',
column:1,
row:37
}
var sh = ss.getSheetByName(po.shName);
var image = sh.insertImage(imageBlob, po.column, po.row);//Insert an image and return the image
}
How about this modification?
Modification points:
insertImage can use the blob and URL which is the direct link of the image file.
In your script, imageBlob is an byte array which is "number[]". By this, I think that an error occurs.
Please add the name to the blob.
When the name is not given, an error occurs.
Modified script:
When your script is modified, it becomes as follows.
function insertImageFromBase64Src2() {
var data = 'R0lGODlhDAAMAKIFAF5LAP/zxAAAANyuAP/gaP///wAAAAAAACH5BAEAAAUALAAAAAAMAAwAAAMlWLPcGjDKFYi9lxKBOaGcF35DhWHamZUW0K4mAbiwWtuf0uxFAgA7';
var imageBlob = Utilities.newBlob(Utilities.base64Decode(data), 'image/png', 'sample'); // Modified
var ss = SpreadsheetApp.getActiveSpreadsheet(); //This code is bound to a Sheet
var po = {
shName:'Update File',
column:1,
row:37
}
var sh = ss.getSheetByName(po.shName);
var image = sh.insertImage(imageBlob, po.column, po.row);//Insert an image and return the image
}
In this modification, it supposes that data can be correctly decoded.
References:
insertImage(blobSource, column, row)
insertImage(url, column, row)
If this was not the direct solution of your issue, I apologize.

ABCPdf - Image not a suitable format

In the end, my goal is to send a raw image data from the front-end, then split that image into however many pages, and lastly send that pdf back to the front-end for download.
But every time I use the theDoc.addImageFile(), it tells me that the "Image is not in a suitable format". I'm using this as reference: https://www.websupergoo.com/helppdfnet/source/5-abcpdf/doc/1-methods/addimagefile.htm
To troubleshoot, I thought that the image might not be rendering correctly, so I added a File.WriteAllBytes to view the rendered image and it was exactly what I wanted, but still not adding to the PDF. I also tried sending the actual path of a previously rendered image thinking that the new image might not have been fully created yet, but it also gave me the same error. Lastly, I thought PNGs might be problematic and changed to JPG but it did not work.
Here is the code:
[HttpPost]
public IActionResult PrintToPDF(string imageString)
{
// Converts dataUri to bytes
var base64Data = Regex.Match(imageString, #"data:image/(?<type>.+?),(?<data>.+)").Groups["data"].Value;
var binData = Convert.FromBase64String(base64Data);
/* Ultimately will be removed, but used for debugging image */
string path = Environment.GetFolderPath(Environment.SpecialFolder.MyDocuments);
string imgName= "Test.jpg";
string filename = Path.Combine(path, imgName);
System.IO.File.WriteAllBytes(filename, binData);
/***********************************************************/
using (Doc theDoc = new Doc())
{
// Using explicit path
theDoc.AddImageFile(#"C:\Users\User\Documents\Test.jpg", 1);
// Using variable
//theDoc.AddImageFile(filename, 1);
// What I really want
//theDoc.AddImageFile(binData , 1);
theDoc.Page = theDoc.AddPage();
theDoc.AddText("Thanks");
Response.Headers.Clear();
Response.Headers.Add("content-disposition", "attachment; filename=test.pdf");
return new FileStreamResult(theDoc.GetStream(), "application/pdf");
}
}
Try something like this (not tested, but cleaned up from my own code):
public int AddImageFile(Doc doc, byte[] data, int insertBeforePageID)
{
int pageid;
using (var img = new XImage())
{
img.SetData(data);
doc.Page = doc.AddPage(insertBeforePageID);
pageid = doc.Page;
doc.AddImage(img);
img.Clear();
}
return pageid;
}
To add a JPEG from a byte array you need Doc.AddImageData instead of Doc.AddImageFile. Note that AddImageFile / AddImageData do not support PNG - for that you would definitely need to use an XImage. The XImage.SetData documentation has the currently supported image formats.

Static route image showing broken (Google Maps Directions API)

I'm attempting to retrieve a static image of a route from Google Maps directions API.
// addresses
$from_address = "Mobile,AL"
$to_address = "Athens,GA"
// build static image url
$url_route_json = "https://maps.googleapis.com/maps/api/directions/json?origin=$from_address&destination=$to_address&mode=driving&key=$goog_map_dist_api_key";
// replace any spaces in the route address with + signs
$url_route_json = str_replace(' ', '+', $url_route_json);
// get the json response
$resp_json = file_get_contents($url_route_json);
// decode the json
$jsondata = json_decode($resp_json, true);
// URL encode overview_polyline
$overview_polyline = urlencode($jsondata['routes'][0]['overview_polyline']['points']);
// build image URL
$url_route_img = "https://maps.googleapis.com/maps/api/staticmap?size=600x400&path=enc%3A$overview_polyline&key=$goog_map_dist_api_key";
url_route_img becomes:
https://maps.googleapis.com/maps/api/staticmap?size=600x400&path=enc:wknnEvj%7B%7DN%7CA%60DYRgDxBZx%40hArC%60A%7CBtEtKzEfLrBhF%7E%40dD%7CGtRJ%5CrD_Bh%40K%60%40FjAbBVZJJXk%40d%40%7D%40Zm%40f%40y%40%7C%40eAtK%7BHtGoEv%40i%40HDP%40pAWvABjGn%40%7CGp%40%60F%60%40zMrAfEf%40pCf%40lEzAhCrAtMtIvBnAzB%60A%7EBt%40%7EJzBtOpDbFnAdK%60ClEz%40nOnDlCh%40bDZhDB%7CCSbCc%40j%40Oj%40N%7EEr%40jA%60%40%7E%40x%40%60LzM%60C%7CBn%40RfBN%7CBJhFj%40vD%60%40jB%5ChBbAfB%7EBpFjTpBlH%60%40%7C%40t%40%7E%40vCtBl%40j%40FXBTB%60%40iD%7EOwJdd%40%7BLxj%40sB%7CHkBvFoC%60HoC%7EFwX%7Ej%40gD%60IoCfIqCrKsBpJwNhq%40mOds%40%7DYxtAmM%60m%40iArFgBpK_BnMiCdYaFxh%40oJ%7EcAsGpr%40cC%60XsCj%5By%40bQQnIChJWnx%40e%40riB%7D%40faDIxXU%7CE%7B%40rGaA%7EDsAxDcBjDuB%7ECcCjCiYhXgMlNeFvGmChDmCnFuBpG%7DAtHkA%60K%5B%60HEdDFjFNrDf%40nFt%40dF%7EAhH%7EF%7CUv%40%7EE%5C%7EDb%40zWLvJRvNj%40bOhA%7CNpAxLfBpOlDr%5BzEfc%40lQn_BtFlg%40%60BrMb%40xBr%40dCfArCjGxJxEvHjG%60L%60NzWlZzk%40lEhJj%40zAnB%7EFbBbHxChO%7EKtj%40fAdGfApKb%40vIHlHIbGoJlnB%7BPtiDyCrj%40a%40jFcAdIgArHy%40vFSbCB%7CEPvBf%40hC%7C%40hCrCfFfBbDfClFfB%7EEdEnMzOzg%40lIfUjIbTfHfRnEjM%40%5C%3FXCTM%5EgAp%40aC%7CAwFhDeHhEgUdN_DlBeCpBgD%7CD%7BBjDyEpI%7BDdFiArAaL%7CLmFjGoKfNwMbRiCrCyCjCcGvD%7DHfEqWrNyXtPgJvFqB%7E%40%7BBb%40yBBmAMmEaAkA%3FmAPs%40RuBnAoC%60BgDxAeB%5EoBJa%40%40iEm%40cGwAoGcAuBOuBBsBZuAd%40yA%60AuAzAy%40jAIf%40_AdCiB%60FmE%7ELq%40%60DY%60DAbAHfERtHEbBk%40nDuAjDwBjCuBxByAzBq%40bAsAbEqAbFmBfJo%40bCuAzCmA%60BgB%7EA%7DDtBgLrFoDfBoBnAoC%7EByDpF%7DDlGwGjKeJbOoHrNyC%7CDkGnG%7DAjCw%40fBwBnGqAbCq%40x%40wAhAsFzDwBxB%7BA%60CcGhKs%40%7EAgAnDuAjGcAlCaAbBsCfD%7DN%7EPwH%60JaExFiEbGyAzAwCtBkAj%40qDpAmLbEwBdAeHdEcIbFcJ%7CFeCdBkAlAgFfJq%40nAwBpC%7DBfBoQjKaMxHmBlBqAvBk%40%7CAaAtEyBjLiG%7E%60%40kA%7CGcAjEaBbGiWh_AgJx%5Cs%40lCeAjFo%40tE%5DhDOfCUd%40c%40L&key=AIzaSyBUjR5xuzBIA_BGGkxnUeHFvLRslstJOU0
That goes in an img tag like so:
<img src="$url_route_img">
Included in an img tag, I see this:
My key is only valid for our server's IP, which is entered in the API key config screen under Restrictions. I've also specifically allowed the Directions and Static Maps APIs on the same key config (the directions part works fine).
What am I missing to get a static image of a route to appear?
Static Maps API requires HTTP based restriction, while Directions was looking for IP based restriction.
I created a second API key specifically for Static Maps and configured using HTTP restriction.
Image now loads perfectly.

How do i display images in Microsoft bot framework with only the base64 encoded string of the image?

i tried the below code, and here is the output i get in emulator
message.Attachments.Add(new Attachment()
{
ContentUrl = $"data:image/jpeg;base64,xxxx"
});
There appears to be a max size for data uri images, however your initial code looks good to me and isn't throwing an explicit internal server error (as it would if the datauri is too large).
I've implemented something similar:
var reply = message.CreateReply("Here's a **datauri image attachment**");
reply.Attachments = new List<Attachment> {
new Attachment()
{
ContentUrl = "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAAQABAAD/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/2wBDAQMDAwQDBAgEBAgQCwkLEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBD/wAARCAAQABADAREAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAACAUH/8QAJhAAAQMDAwQCAwAAAAAAAAAAAQIDBQQGEQcIEgATISIUMRUjUf/EABYBAQEBAAAAAAAAAAAAAAAAAAMBBP/EAB8RAAICAQQDAAAAAAAAAAAAAAECAAMRBBITIiFB8P/aAAwDAQACEQMRAD8AubjdVbtj5cQFi3tX2lS/ka16Rko9pZqHHfklplgKAylJPNR/vEZPWyvTpUN7jMyK3M21fE03ZLuQ1Gmbyc0j1Dudq7o8RztXFzXEGtacZeQhxipKT7D9qcKUOQ+skfRWKrdqxj71HI4erHME97633Fc+pF10c64pIg7ll6CldoEcHEoTVL7fMZ9se2CPOekdkCiSjIYmLvYvMRdLQPXDG3FGSEzK1iKB4rYCnaan7oVwcCQCHVqGTkkeEefGOgbTtjccyW6sM4QAT//Z",
ContentType = "image/jpg",
Name = "datauri"
}
};
Which results in the emulator showing this image (I need more rep to embed images.. ugh..)
Update: a data uri version of a ~20kb image works just fine, however a data uri version of a ~140kb image fails with a "500 internalservererror" in the emulator. Guess there is a size limit after all..
As such, can you validate that he datauri you're using is a valid image? Can you create a simple html page with an img element, paste in the value in your ContentUrl and see the image in the html page? Or even just paste it into a browser address bar.
When you want to display images you can use markdowns.
var replyMessage = "[ImgName](" + ImagesUrl + ")";
return message.CreateReplyMessage(replyMessage);
Bot Framework Markdown Documentation
================= Convert Base64 string to Image ==========================
public void SaveImage(string base64)
{
using (MemoryStream ms = new MemoryStream(Convert.FromBase64String(base64)))
{
using (Bitmap bm2 = new Bitmap(ms))
{
bm2.Save("SavingPath" + "ImageName.jpg");
}
}
}
Then you can use the URL.

Windows phone 8 retrieving image from web service?

I'm trying to set the source attribute of an Image element to an image in my localhost, basically what I'm doing is display a list with items, their description, price and an image. I get all these values from a web service which returns the url where the image is in the local server Eg: http://localhost/roses.png, when the list of items is displayed all values are set correctly but the Image element does not show the image.
Web service returns the data in JSON format. Eg:
[{"ImagenUrl":"http://localhost/roses3.png", .... ]
code on client_actionCompleted method:
if (e.Result != null)
{
dynamic jsonObj = JsonConvert.DeserializeObject(e.Result);
foreach(var v in jsonObj)
{
Debug.WriteLine("IMAGE URL ==> " + (string)v.ImagenUrl);
FlowersItems fi = new FlowersItems();
fi.fi_name.Text = (string)v.Nombre;
fi.fi_price.Text = (string) v.Precio;
BitmapImage tn = new BitmapImage(new Uri((string)v.ImagenUrl, UriKind.Absolute));
fi.fi_image.Source = tn;
FlowersItemsListbox.Items.Add(fi);
}
}
As I said before the fi_name and fi_price text is set correctly but the fi_image is not displayed even though I can view the image in my browser going to the url returned by the web service just fine.
Any ideas on how to make this work?
Edit: just in case, I also tried new Uri((string)v.ImagenUrl)
without the UriKind.Absolute parameter.

Resources