ES6 google maps api CORS probelm or NotLoadingAPIFromGoogleMapsError - google-maps

I am trying to work with google maps on ES6.
If i do :
import "https://maps.googleapis.com/maps/api/js?key=my_key"
I get a CORS error.
If I download the source code requesting https://maps.googleapis.com/maps/api/js?key=my_key > save as local_googlemaps.js . I am able to import with
import "../../thirdparty/js/google_maps.js"
But when try to load the map with location info, I got "NotLoadingAPIFromGoogleMapsError", related with the source Code is not loaded from api.googleapis.com.
Any suggestion? Thanks in advance.

Works fine with manual import :
const script = document.createElement('script');
script.src = `//maps.googleapis.com/maps/api/js?key=${apiKEY}`;
script.async = true;
document.body.append(script);
But, any other suggestion?

Related

Google Sheets Advanced Google Services URL Shortener 403 Error: Forbidden

I am trying to create a small application in in Google Sheets to sorten URLs on my personal google account. I am using the following code which I found here: Google Sheets Function to get a shortened URL (from Bit.ly or goo.gl etc.)
function onOpen() {
SpreadsheetApp.getUi()
.createMenu("Shorten")
.addItem("Go !!","rangeShort")
.addToUi()
}
function rangeShort() {
var range = SpreadsheetApp.getActiveRange(), data = range.getValues();
var output = [];
for(var i = 0, iLen = data.length; i < iLen; i++) {
//var url = UrlShortener.Url.insert({longUrl: data[i][0]});
var url = UrlShortener.Url.insert({longUrl: 'www.google.com'});
output.push([url.id]);
}
range.offset(0,1).setValues(output);
}
I created a new Google Cloud Project and enabled the URL shortener API in the project and on the Google sheet. The problem is that when I try and run the code I get an err on the line: var url = UrlShortener.Url.insert({longUrl: 'www.google.com'});
error 403, message:forbidden
when i try an execute the rangeShort() function. I have no idea how to fix this. Any ideas would be most appreciated! Thanks!
As it turns out, like Ruben mentioned, Google has moved away from their URL shortener. So after much research ans testing here is the solution:
Step 1
Migrate Google Cloud Project over to Firebase or create a new Firebase Project. See steps here
Step 2
Create a dummy project in order to create a base URL for the shortening. See this youtube video
Step 3
Get the Web API Key from your new Firebase Project (not the app you just created)
Step 4
Check the left side menu on the screen and navigate to Grow->Dynamic Links. You should see the new application you created and a URL at the top of the application. This will become the base of the new shortened URLs.
Step 5
Create the code in Google Apps Script inside the code builder from within Google Sheets. Here is the code that worked for me (I passed the url into this function) (This code is based on the answer found here):
function api_call(url){
var req='https://firebasedynamiclinks.googleapis.com/v1/shortLinks?key=[YOUR PROJECT WEB API KEY FROM STEP 3]';
var formData = {
"longDynamicLink": "[YOUR APPLICATION URL BASE FROM STEP 4]?link=" + url,
"suffix" : {
"option" : "UNGUESSABLE"
}
};
var options = {
'method': 'post',
'contentType': 'application/json',
'payload': JSON.stringify(formData)
};
var response = UrlFetchApp.fetch(req, options);
var res=JSON.parse(response);
return res.shortLink;
}
Additional Information
Documentation on Creating Dynamic Links in Firebase
Documentation on using UrlFetchApp() in Google Apps Script
If the url shortener service was used in your project before March 30,2018
Instead of
www.google.com
use
https://www.google.com
Reference: https://developers.google.com/url-shortener/v1/url/insert
but if your project was created on or after March 30, 2018
From https://developers.google.com/url-shortener/v1/
Starting March 30, 2018, we will be turning down support for goo.gl URL shortener. Please see this blog post for detailed timelines and alternatives.
Just to be clear, please note, from the linked blog post:
For developers
Starting May 30, 2018, only projects that have accessed URL Shortener
APIs before today can create short links.
I can attest to #alutz's answer here with a small addition/correction to their code.
Use encodeURIcomponent() for the input url while assigning it to the Long Dynamic Link in case you have more than one custom parameters.
"longDynamicLink": "[YOUR APPLICATION URL BASE FROM STEP 4]?link=" + encodeURIcomponent(url),
This allowed me to pass in multiple arguments for my telegram bot like chat_id, text and parse_mode.

Why Google Apps Script throwing an "internal error" for Sites Services?

Here is my script, which basically iterate through drive folder, and put the file's blob as a attachment to some page on google site. It was working fine till day before yesterday, suddenly stop working after that.
function myFunction() {
var testpage = SitesApp.getSiteByUrl(siteURL).getChildByName("test");
var photofolder = DriveApp.getFolderById(folder_ID);
var filesinpf = photofolder.getFiles();
while(filesinpf.hasNext()){
var file = filesinpf.next();
var fblob = file.getBlob();
testpage.addHostedAttachment(fblob); //This line generating an error
}
}
Please help!
I had the same problem yesterday.
I have been working with this for a week, and yesterday I got an internal error in the last line:
function myFunction() {
var myFolder = DriveApp.getFolderById
("0B-ZOMOQnNEDOU9sWEV5SzlXVTQ");
var myFile =
myFolder.getFilesByName("Data.txt").next();
var myBlob = myFile.getBlob();
var myPage =
SitesApp.getSiteByUrl("https://sites.google.com/site/
demo ").getChildByName
("home/demoFileCabinet");
myPage.addHostedAttachment(myBlob);
}
Maybe a problem in Google Sites??. The code is correct.
I created an Issue Tracker too.
You can reproduce this error by using the sample code provided by google:
https://developers.google.com/apps-script/reference/sites/page#addHostedAttachment(BlobSource)
I created an enterprise support Ticket.
Keep you updated: [Case #14128120] Google Sites addHostedAttachment() not working
I got the following response from google:
Let me confirm that this is an issue on our end, filed with issue ID #68842220.
Please notice that our Engineering Team has already found the root cause for this.
At the moment, still, I can't confirm you when it will be fixed, but let me provide you with a simple workaround that will work while we wait for the fix: swap the "domain.com" and the "macros" parts of the URL when entering the URL in the dialog.
Sample, for url:
https://script.google.com/a/domain.com/macros/s/AKfycbwJfGpXIiWHfsCi-j66RuPMNx6kTFsdjYIbNOyufZptGA1tirm6/exec
try
https://script.google.com/a/macros/domain.com/s/AKfycbwJfGpXIiWHfsCi-j66RuPMNx6kTFsdjYIbNOyufZptGA1tirm6/exec

Google Script, Import HTML data

I'm trying to create a personal notifier whenever a certain website contains the word 'Indian' the script should email me.
For some reason I cannot find a script function that would import HTML data,
Is there such a function?
Yes, you can perform a URL fetch:
https://developers.google.com/apps-script/reference/url-fetch/url-fetch-app#fetch(String)
Just like Harold said, you can perform a URL fetch:
var output = UrlFetchApp.fetch("https://raw.githubusercontent.com/####");
var form = HtmlService.createHtmlOutput(output.getContentText());
SpreadsheetApp.getUI().showModalDialog(form, "Fetched HTML");
You can otherwise fetch a website using the same tactic, for example:
var output = UrlFetchApp.fetch("https://www.google.com");
var form = HtmlService.createHtmlOutput(output.getContentText());
SpreadsheetApp.getUI().showModalDialog(form, "Fetched HTML");
Upon launch, the dialog should return Google's homepage.

How do I use momentsjs in Google Apps Script?

I'm trying to utilize the momentjs library in Google Apps Script but I'm not clear on how to do so. I'm not sure how to add the library, so obviously running something like the following results in "Reference Error: 'moment' is not defined":
var a = moment([2007, 0, 29]);
var b = moment([2007, 0, 28]);
var difference = a.diff(b);
Most people try to use the library with the key ending in 48. That library is pretty dated (it is version 2.9 which is pretty old).
Using eval and UrlFetchApp.fetch moment.js or any other external library can be used easily in google app scripts.
function testMoment() {
eval(UrlFetchApp.fetch('https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js').getContentText());
var date = moment().format("MMM Do YY");
Logger.log(date)
}
You may either host the moment.js on your own server, or use a CDN like cloudflare CDN to reference the library.
For cloudflare, here is the page which shows moment.js versions and their urls:
https://cdnjs.com/libraries/moment.js/
As of writing this post 2.18.1 is the latest version.
For the example posted by OP it will look like this:
function testMomentDifference() {
eval(UrlFetchApp.fetch('https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js').getContentText());
var a = moment([2007, 0, 29]);
var b = moment([2007, 0, 28]);
var difference = a.diff(b);
Logger.log(difference);
}
The moment script ID for the Google Apps Script IDE has changed. It is now "15hgNOjKHUG4UtyZl9clqBbl23sDvWMS8pfDJOyIapZk5RBqwL3i-rlCo"
You can add moment and moment.tz to app scripts by creating a new Script file and adding the following code:
var cacheExpire = 3600;
var momentCache = "momentCache";
var momentUrl = "https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.min.js"
var momentTzCache = "momentTzCache";
var momentTzUrl = "https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.16/moment-timezone-with-data-2012-2022.min.js"
useCachedOrLive(momentCache,momentUrl);
useCachedOrLive(momentTzCache,momentTzUrl);
function useCachedOrLive(cacheToCheck, url){
var cache = CacheService.getUserCache();
var cachedData = cache.get(cacheToCheck);
console.log(cacheToCheck);
if(cachedData !== null){
console.log("using cached " + cacheToCheck)
eval(cachedData);
}
else
{
console.log("getting live " + cacheToCheck);
var response = UrlFetchApp.fetch(url).getContentText();
cache.put(cacheToCheck, response, cacheExpire);
eval(response);
}
}
This uses the cache service to reduce round trip calls and you can modify it to include a subset of data if you want.
Thanks to apadana for getting me started!
There is a better and best way to use moment
Do not use UrlFetchApp, to avoid quota exceeded, caching, and server issues
Download moment.min.js and momemt-timzone.min.js in last versions
and integrate the full files in apps script like the below screen
There is no problems in long run with this approach, just update the files any time when you need.
After adding the two files, just publish a new version and include it in any other script
For example:
I will create a script with name "MomentAPI" and include the two
files mentioned, and publish a new version.
in other script with name "myScript" I will include the library
"MomentAPI" with its script id as known
then will use it like the below examples
const moment = MomentAPI.moment; // init the library
const start = moment().startOf('day').toDate(); // Dec 06 00:00:00
const end = moment().endOf('day').toDate(); // Dec 06 23:59:59
const d = moment(1767139200000).tz('America/New_York').format('ha'); // 7am EST
Using external Javascript library is not so easy... Depending on the context in which you want to use it (a webapp of a document embedded script) the approach will be different.
I didn't try it in client JavaScript and I'm not sure caja will allow it but I found this post that shows a possible way to include it using a Google Script Library that a user has build and if I read the post it seems to work...
The "user" is a Google developper so he knows for sure what he is talking about ;) please update here if it worked for you.

Web Apps Script: No output

I am trying to display a Google Visualization GeoMap on my website. I created the code in the Code Playground and saved it as an Apps Script in my website. The page goes through the load process but nothing is displayed.
Here is the code:
function doGet() {
var app = UiApp.createApplication();
function drawVisualization() {
var query = new google.visualization.Query(
'https://docs.google.com/a/mantisnetworks.co/spreadsheet/ccc?key=0AoNHsySj5NxGdGt0dmxva3ZPb3dLYVpVZ2Z4TThNbGc&usp=drive_web#gid=0');
query.send(handleQueryResponse);
}
function handleQueryResponse(response){
if(response.isError()){
alert('Error in Query:' + response.getMessage()+''+response.getDetailedMessage());
return;
}
var data = response.getDataTable();
var geochart = new google.visualization.GeoMap(document.getElementById('visualization'));
var options = {};
options['dataMode'] = 'regions';
options['resolution'] = 'provinces';
options['region'] = 'LS';
options['width'] = '600px';
options['height'] = '300px';
geochart.draw(data, options);
}
app.close();
return app;
}
Google Apps Script is based on Javascript, but as a server-side environment it does not have access to all client-side javascript constructs. The Google visualizations, for instance, are provided as the Charts Service. Using that service, you'll find support for much of the visualization API. However, you won't find GeoMap.
The code you've provided in your question needs to be reworked considerably to work properly in Google Apps Script. Start with the example given on the Charts Service page, then adapt to your situation.
You do have another alternative within Google Apps Script, which is to use the HTML service to "host" an HTML page containing "real" javascript. Javascript that's embedded in HTML pages can be made to run on the client browser, so the example you cooked up in the playground should work. A full run-down of this option is beyond the scope of your question, but if you're interested in it you could start by scanning previous questions about the HTML Service.