Google Apps Script XMLHttpRequest not showing parameters - google-apps-script

Question

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:
I'm aware that the "params" value is NOT the same as the form input value
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.

Answer 1

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
When you modified the Google Apps Script, please modify the deployment as a new version. By this, the modified script is reflected in Web Apps. Please be careful this.
You can see the detail of this in the report of "Redeploying Web Apps without Changing URL of Web Apps for new IDE".
Reference:
Taking advantage of Web Apps with Google Apps Script