I have a html table which is updated very often. Currently we copy and paste the html code to the Google Site as embedded code. That works, but is time consuming and not each editor have the skills to do that.
Now I thought it should be possible to use embed url, but that will not work because the source file is located on a Google Drive ==> only the source code will be shown.
A colleague told me that I can use Google Apps Script (GAS), but it works only when the html table is directly in GAS. That will not work for same reasons as before.
Therefore I tried to get the file, but I receive the the error message
Exception: No HTML file named <style type="text/css">
Here my code
function doGet() {
//getting html file will not work ==> Exception: No HTML file named
var html = DriveApp.getFileById("12fozYxDoK-RDcUIf0Cxpq7Cz8mfdXNjy").getBlob().getDataAsString();
//html file saved as txt ==> Exception: No HTML file named
var txt = DriveApp.getFileById("1Ekiwc7lJPuaelMcSJ9hRtvTsunJ8h1XF").getBlob().getDataAsString();
//return HtmlService.createHtmlOutputFromFile(html);
//return HtmlService.createHtmlOutputFromFile(txt);
//works only with embedded html file
return HtmlService.createHtmlOutputFromFile('DocumentTable');
}
What can I do to show the html table from the Google Drive file?
I figures out how it works:
function doGet() {
var html = DriveApp.getFileById("12fozYxDoK-RDcUIf0Cxpq7Cz8mfdXNjy").getBlob();
return HtmlService.createHtmlOutput(html);
}
Related
I have written a script that creates a new "Report" every time it is ran. This is done by generating a new Google Spreadsheet, which then displays a filtered set of values based off inputs in the original spreadsheet it is tied to. Below is the code:
Report Script
The script is activated by a custom menu bar. An example of the menu bar is here below:
Menu Bar Code
Upon clicking into the custom menu bar, I would like the newly generated "report" spreadsheet to open. Since this script creates a new spreadsheet each time it is ran, the URL will be different each time, therefore, I am not sure how to incorporate the variable URL into an HTML file. Below are some lines of code I have used to open files upon using the custom menu bar:
HTML File Code
In the above image, "+ ssNewURL +" is where the known URL to the desired destination would go. I attempted to reference a variable I used earlier (ssNewURL) which gets the URL of the newly generated sheet, but it did not work. I have tried to get around the formatting issue of the HTML file which requires the URL to be a string; I've tried changing locations of double "" quotations,
and single '' quotations. Whatever I have tried, the HTML file refuses to open.
I am extremely new to coding, I understand the logic behind it, however, I am very unfamiliar with every function/formatting of Google Scripts coding.
Any suggestions or workarounds for getting the HTML part of the code to open the dynamically changing URL would be greatly appreciated!
When you call window.open(), the URL also needs to be enclosed in quotation marks.
let htmlOutput = HtmlService.createHtmlOutput(
"<script type='text/javascript'>" +
"window.open('" + url + "', '_blank');" +
"google.script.host.close();" +
"</script> "
);
Another option would be to pass the URL of your spreadsheet to the HtmlTemplate object as a property:
let template = HtmlService.createTemplateFromFile("popup");
template.url = url;
return SpreadsheetApp.getUi().showDialog(template.evaluate());
Calling evaluate() on an HtmlTemplate object will execute the embedded JS code and place all variables you passed to the template in scope.
popup.html
<body>
Opening your spreadsheet...
<input type='hidden' id="hidden-field" value='<?!= url ?>' />
<script>
var url = document.getElementById("hidden-field").value;
window.open(url, "_blank");
google.script.host.close();
</script>
</body>
I'm trying to build a website using Google App Script where I copy all elements from my google form and show it in my own website. I was able to get the details of all elements using : https://developers.google.com/apps-script/reference/forms except for the Image elements.
This link doesn't have the information to get the image URL :
https://developers.google.com/apps-script/reference/forms/image-item
I was able to fetch the BLOB but I couldn't fetch the image URL.
For example in the screenshot, I need the highlighted URL of the image in my form : https://lh6.googleusercontent.com/uZtoCzoraW7vkkrN2289pX83Y6wwaRmMjpgBySWHaT3Vm2p9DVAA7Voy4CclYp2hve6c6zzzLkh-rF1yAX9fFPTTd940WMjwVtjcyMF2XCbdQ7YKQhhCfYxSUyKztcKacWCitDy4C31f9lQ
I need the URL of the image to add in the source tag of my website.
Is there a method in google app script that can fetch me the URL of an image/video.
Solution
After taking a further look to your question, I found out I could use the Blob onject you get from the form image to create a drive file which then can be used to get its webContentLink url to be used in the web app using the Drive API.
To be able to use the Drive API in your Apps Scrip script please, in your script editor go to Resources -> Advanced Cloud Services and enable the Drive API in the dialog that will pop up.
This is the piece of code I have used for achieving what you aimed for with self explanatory comments (this is a simplified web app that only focuses on achieving your purpose):
Code.gs file
// Apps SCript function to serve the HTML file in the web
function doGet() {
return HtmlService.createHtmlOutputFromFile('test');
}
// Function to be called in the HTML that returns the URL to be used by the image tag
function getUrl() {
var form = FormApp.getActiveForm();
// Get image blob
var image = form.getItems()[0].asImageItem().getImage().getAs('image/jpeg');
// Use the image blob for creating a new drive file
var file = DriveApp.createFile(image);
// Use the Drive API get method to get the property webContentLink which will return the link
// of the image to be used in a website
var fileURL = Drive.Files.get(file.getId()).webContentLink;
return fileURL;
}
index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body id="body">
<h1>MY IMAGE</h1>
<script>
// Get what our function getURL returns
google.script.run.withSuccessHandler(function(URL) {
// Create HTML image tag
var img = document.createElement('img');
// Set its source to our file's sharable URL
img.src = URL;
// Attach image element to the body
document.getElementById('body').appendChild(img);
}).getURL();
</script>
</body>
</html>
I hope this has helped you. Let me know if you need anything else or if you did not understood something. :)
I am trying to create a google script that emails out a spreadsheet as html. I am trying to convert the spreadsheet to html using the export url, but currently google docs only lets you export it out as a zip. Is there a way to get the html representation of a spreadsheet worksheet?
function getDocAsHtml(docId){
var url="https://docs.google.com/spreadsheets/d/" + docId + "/exportFormat?format=html";
var fetch=UrlFetchApp.fetch(url+docId).get
return fetch;
}
Publish the sheet that you want to get the HTML out of:
File Menu, PUBLISH TO WEB
Make sure that: "Automatically Republish When Changes Are Made" is checked.
Get the URL of the published page. Use that URL in a UrlFetchApp.fetch() request.
Use UrlFetchApp to get the content of that published sheet.
function fncSheetToHTML() {
var theSheetContents = UrlFetchApp.fetch("https://docs.google.com/spreadsheets/d/YourID_Here/pubhtml?gid=123abc&single=true");
Logger.log("theSheetContents: " + theSheetContents);
}
The returned contents is a string. If you view the LOGS of what is returned from the above code, you'll see HTML tags in the content.
The published sheet is visible to anyone who uses that URL. So, if you don't want people to see the contents, this method might not be what you want. If you don't share that published URL, I don't know how likely it is that anyone will ever find it.
Is it possible to use Google app scripts to get the html code in Google docs i.e if text in the document was say bold,i could get the html code for that.
What i have so far :
function getHtml(id) {
var doc1=DocsListExtended.getFileById("1ta7zJ6SDFgzgp-UprjehxR8Tx3-4-wtJwTYqWbol1SU").getAsHTML();
var body=HtmlService.createHtmlOutput(doc1);
var cont=body.getContent();
return cont;
Logger.log(cont);
}
I don't know a simple way for that. You can navigate the elements of the document using DocumentApp API, and converting it block by block to HTML.
I already tried
DocumentApp.getActiveDocument().getAs(MimeType.HTML).getDataAsString()
but the error says doc can't be converted to html mimetype.
I am trying to show a specific privately shared drive folder in my Google page. I am using this guide: https://developers.google.com/apps-script/articles/embedding_docslist_in_sites
I am stuck on Step "8. Replace PASTE_PAGE_URL_HERE in the method getPageByUrl() by the url of your file cabinet."
I have tried every URL combination in "" and I just get a scripting error on the getPageByUrl() method.
I just tested this and it seems to work fine for me. Make sure you are using the full URL for your file cabinet page. For example, on my test site, I created a new page using 'file cabinet' in the template dropdown calling it "myfcpage". This gives me a new page with URL: "https://sites.google.com/site/mytestsite/myfcpage". Therefore my function call looks like this:
var page = SitesApp.getPageByUrl("https://sites.google.com/site/mytestsite/myfcpage");