Andres Alvarez
Andres Alvarez

Reputation: 137

Google Apps Script XMLHttpRequest not showing parameters

I am able to make the POST request to my google apps script web app, but I can't access my e.parameters when I log them.

HTML CODE:

<form onsubmit="submitForm(event)">
  <input type="text" name="fname" required>
  <button type="submit">Submit</button>
</form>

JS CODE:

function submitForm(e){
  e.preventDefault()

   var url = "https://xxxxxxxxxxxxxxxxxxxxxx/exec"
   var params = "employeeStatus='Active'&name='Henry'";
 
   var xhr = new XMLHttpRequest()

   xhr.open("POST",url,true)
  
   xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded")
  
   xhr.onreadystatechange = ()=>{
     var readyState = xhr.readyState 
     var status = xhr.status

     if(readyState == 4 && status == 200){
      var response = JSON.parse(xhr.responseText)
      console.log(response)
     }
   }

  xhr.send(params)
}

APPS SCRIPT CODE:

function doPost(e){
  var values = e.parameters;
  Logger.log(values)
  return ContentService.createTextOutput(JSON.stringify({"a":5,"b":2}))
}

Can anyone please tell me what I'm doing wrong here? I've iterated the apps script code to try and log the e.parameters but I'm unable to get anything to work.

***NOTES:

  1. I'm aware that the "params" value is NOT the same as the form input value
  2. I return the JSON string just to ensure that the code is running all the way through and I can practice JSON.parse/JSON.stringify on the client-side.

Upvotes: 0

Views: 587

Answers (1)

Tanaike
Tanaike

Reputation: 201388

When I saw your script, I think that your value of e.parameters is {"employeeStatus":["'Active'"],"name":["'Henry'"]}.

About I've iterated the apps script code to try and log the e.parameters but I'm unable to get anything to work., I think that the reason for your issue is due to that your request of "XMLHttpRequest" include no access token. From your request, I thought that the settings of Web Apps might be Execute as: Me and Who has access to the app: Anyone with V8 runtime. If my understanding is correct, the reason for your issue is due to that.

If you want to show Logger.log(values) in the log, please include the access token to the request header as follows.

Modified script:

function submitForm(e) {
  e.preventDefault();

  var url = "https://script.google.com/macros/s/###/exec"; // Your web apps URL.
  url += "?access_token=###your access token###";

  var params = "employeeStatus=Active&name=Henry";
  var xhr = new XMLHttpRequest();
  xhr.open("POST", url, true);
  xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xhr.onreadystatechange = () => {
    var readyState = xhr.readyState;
    var status = xhr.status;
    if (readyState == 4 && status == 200) {
      var response = JSON.parse(xhr.responseText);
      console.log(response);
    }
  }
  xhr.send(params);
}
  • In this case, as a test, you can simply retrieve your access token by the following Google Apps Script. // DriveApp.getFiles() is put for automatically detecting the scope of Drive API for accessing Web Apps. The expiration time of this access token is 1 hour. Please be careful about this. When the expiry time is over, please retrieve the access token again.

      const sample = _ => {
        console.log(ScriptApp.getOAuthToken());
        // DriveApp.getFiles()
      }
    
  • When the above script is run, the following value is shown in the log by Logger.log(values).

    • {access_token=[###], employeeStatus=[Active], name=[Henry]} : This is due to Logger.log.
    • When console.log(values) is used, { access_token: [ '###' ], employeeStatus: [ 'Active' ], name: [ 'Henry' ]} is shown.

Note:

  • As another approach, for example, when you want to check the value of e of doPost, I think that you can store the value in a Spreadsheet as a log as follows. By this, when doPost is run, the value of e is stored in the Spreadsheet as a log. In this case, the access token is not required to be used.

      function doPost(e) {
        SpreadsheetApp.openById("###spreadsheetId###").getSheets()[0].appendRow([new Date(), JSON.stringify(e)]);
        return ContentService.createTextOutput(JSON.stringify({ "a": 5, "b": 2 }))
      }
    

Note

Reference:

Upvotes: 2

Related Questions