Script Block - fetch bug?

Ah good catch! It will actually work if you run the script, the editor just doesn’t know about fetch right now, which is why it’s complaining. We’ll get this fixed, thanks.

Thanks @Kasra - I don’t think the script would work for me (I certainly tried it) but will try again.

JB

I’m having a similar issue with fetch() and it’s unrelated to the fact that the editor is unable to perform codesense validation on it.

I haven’t nailed down the cause yet, but working on it as time permits today.

I believe you fellers over at Airtable have a regression issue introduced post-pre-beta.

@Kasra,

I did a number of HTTP GET and POST tests and I could not find any issues (except my own).

Here’s the entire script I used to test your example, a GET, and a POST (via Google Cloud Platform). It all seems to work fine.

output.markdown('# FETCH Tests');

//
// simple http get test (Airtable example)
//
output.markdown('## Simple HTTP GET Test (Airtable Example)');

const response = await fetch('https://dog.ceo/api/breeds/list/all');
const jsonTest = await response.json();
output.inspect(jsonTest);

// establish the cgp web service endpoint
let gcpUrl = "https://script.google.com/macros/s/AKfycbxGO0QVOYEiiBkseEh3AUSnHFMpS0OXidRtAUMTNIjj_EaFdBo/exec";

//
// http get test (from GCP)
//
output.markdown('## HTTP GET Test (from GCP)');

let getOptions = {
    method: "get",
    headers: {
        'Accept'       : 'application/json',
    }
}

const getResults = await fetch(gcpUrl + "?field=name&value=Bill%20French", getOptions);
const getJson    = await getResults.json();

output.markdown("Display JSON Object");
output.inspect(getJson);
output.markdown(getJson.field + " = " + getJson.value);


//
// http post test (from GCP)
//
output.markdown('## HTTP POST Test (from GCP)');

let payload = {
    "field" : "name",
    "value" : "Bill French"
}

let postOptions = {
    method: "post",
    headers: {
        'Accept' : 'application/json',
    },
    body: JSON.stringify(payload)
}

const postResults = await fetch(gcpUrl, postOptions);
const jsonPost    = await postResults.json();

output.markdown("Display JSON Object");
output.inspect(jsonPost);
output.markdown(jsonPost.field + " = " + jsonPost.value);

output.markdown('# FETCH Tests');

//
// simple http get test (Airtable example)
//
output.markdown('## Simple HTTP GET Test (Airtable Example)');

const response = await fetch('https://dog.ceo/api/breeds/list/all');
const jsonTest = await response.json();
output.inspect(jsonTest);

// establish the cgp web service endpoint
let gcpUrl = "https://script.google.com/macros/s/AKfycbxGO0QVOYEiiBkseEh3AUSnHFMpS0OXidRtAUMTNIjj_EaFdBo/exec";

//
// http get test (from GCP)
//
output.markdown('## HTTP GET Test (from GCP)');

let getOptions = {
    method: "get",
    headers: {
        'Accept'       : 'application/json',
    }
}

const getResults = await fetch(gcpUrl + "?field=name&value=Bill%20French", getOptions);
const getJson    = await getResults.json();

output.markdown("Display JSON Object");
output.inspect(getJson);
output.markdown(getJson.field + " = " + getJson.value);


//
// http post test (from GCP)
//
output.markdown('## HTTP POST Test (from GCP)');

let payload = {
    "field" : "name",
    "value" : "Bill French"
}

let postOptions = {
    method: "post",
    headers: {
        'Accept' : 'application/json',
    },
    body: JSON.stringify(payload)
}

const postResults = await fetch(gcpUrl, postOptions);
const jsonPost    = await postResults.json();

output.markdown("Display JSON Object");
output.inspect(jsonPost);
output.markdown(jsonPost.field + " = " + jsonPost.value);

Thanks for checking, glad to hear it’s working!

Hi @Kasra - just tried this again and can’t get fetch to work. This is my script:

 // send an email via Sendgrid

let messageContent = "Message to go in email"

const sendgrid_url = 'https://api.sendgrid.com/v3/mail/send';

const headers = {
  "Content-Type": "application/json",
  "Authorization": "Bearer MY_BEARER_TOKEN"
};

var email = 'jonathan@example.com'

var content = {
    "personalizations": [
      {
          "to": [
          {
              "email": email
          }
          ],
          "subject": "Hello, World! " + email
      }
      ],
      "from": {
        "email": "jonathan@example.com",
        "name": "Jonathan Bowen"
      },
      "content": [
      {
          "type": "text/plain",
          "value": messageContent
      }
    ]
}

let response = await fetch(sendgrid_url, {
    method: "post",
    headers: headers,
    body: JSON.stringify(content)
  });

console.log(email, response.ok);

(Just adding this to show you what it is doing).

This script works correctly on the pre-beta release base, but doesn’t work on the current beta release base. As you say, the fetch command is highlighted in the code editor, but when I run it in the current beta release, I’m also getting this as an error message:

Edit: Note that I have stripped out getting table records for the purposes of testing. I would read email addresses from the base in reality, but I stripped this code out for now just to be able to test it in the pre- and current release bases

JB

Betting a bag of doughnuts that changing this…

"Content-Type": "application/json",

to this …

'Accept' : 'application/json',

Will fix it.

@Bill.French hmmm…doesn’t seem to (and Content-Type did work on the pre-beta)

Okay - I can replicate a facsimile outcome like this -

If I change it back to ‘Accept’ : ‘application/json’ … it works again.

In any case, is there a debugging log on the SendGrid side that can offer a clue?

@JonathanBowen It looks like SendGrid doesn’t allow client-side requests: https://sendgrid.com/docs/for-developers/sending-email/cors/#browser-only-applications

Yep, that’s what I feared.

So, one approach @JonathanBowen -

• Stand up a Google Apps Script web service or perhaps a Heroku NodeJS app as a proxy
• Make your block requests into your proxy service
• Let the proxy service call into SendGrid