xmlhttprequest responseText返回空白

时间:2018-01-17 19:38:05

标签: javascript google-apps-script xmlhttprequest

我将我的表单数据发布到谷歌电子表格(它正在工作,我只是无法得到回复)并且我正在尝试返回已发送的值。电子表格有3个标题 - 名称,图像,结果。每当我发送表单数据时,我都可以在正确的标题下将值写入电子表格,我只是无法获得responseText或statusText或类似的东西。我将如何返回和控制。记录值?

[index.js]

var form = document.createElement('form'),
    node = document.createElement('input');
form.method = 'POST';
form.action = 'google apps script url';
form.style.display = 'none';

var params = {'name': name, 'image': image, 'result': result};

for (key in params)
{
  node.name = key;
  node.value = params[key];
  form.appendChild(node.cloneNode());
}

document.getElementById('formContainer').appendChild(form);
var xhr = new XMLHttpRequest();
xhr.open(form.method, form.action, true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send('name=' + name + '&image=' + image + '&result=' + result);
console.log(xhr.responseText); //returns blank...same w/ status / statusText / etc
document.getElementById('formContainer').removeChild(form);

[google apps script]

function doPost(e)
{
  var headers = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0];
  var nextRow = sheet.getLastRow() + 1;

  var row = [];

  for (i in headers)
  {
    row.push(e.parameter[headers[i]]);
  }

  sheet.getRange(nextRow, 1, 1, row.length).setValues([row]);

  return ContentService
    .createTextOutput(JSON.stringify({"result":"success", "row": nextRow, 'values': e.parameter}))
    .setMimeType(ContentService.MimeType.JSON);
}

1 个答案:

答案 0 :(得分:1)

您正在通过将async参数设置为true xhr.open(form.method, form.action, true);来发出异步请求。这意味着代码不会等待来自网页的响应并进入下一行,因此空xhr.responseText

您必须使用XMLHttpRequest.onload()函数来定义回调函数。这将在收到来自Web应用程序的响应时执行,如此

xhr.onload = function() {
           console.log(xhr.responseText);
        };

您的代码如下所示:

  xhr.open(method, action, true);
  xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xhr.onload = function() {
       console.log(xhr.responseText);
    };
  xhr.send('name=' + name + '&image=' + image + '&result=' + result);

可以找到有关异步和同步的更多详细信息here

注意:对于最新版本的Mozilla和Chrome,同步通话deprecated。因此建议不要使用它们。