将变量（而不是表单提交）中的数据发送到Google工作表

Question

我是Vue.js和javascript的新手。我正在尝试将一些数据发送到Google工作表，但没有成功。

我找到了一些有关如何发布数据的信息，但是我的数据没有存储在表单中。因此，我为要发布的数据添加了一个空的“表单”，但没有运气。

这是来源： https://github.com/jamiewilson/form-to-google-sheets 和： Is it possible to send js variables to google sheets? (Not form data)

这是我发布数据的方式：

saveToGoogleSheet () {
  const scriptURL = 'https://script.google.com/macros/s/.../exec'
  const form = ''
  var sendingData = new FormData(form)
  sendingData.append('starRating', this.feedbackData.starRating)

  fetch(scriptURL, {method: 'POST', body: new FormData(sendingData)})
    .then(response => console.log('Success!', response))
    .catch(error => console.error('Error!', error.message))
}

这是Google脚本

var sheetName = 'Sheet1'
var scriptProp = PropertiesService.getScriptProperties()

function intialSetup () {
  var activeSpreadsheet = SpreadsheetApp.getActiveSpreadsheet()
  scriptProp.setProperty('key', activeSpreadsheet.getId())
}

function doPost (e) {
  var lock = LockService.getScriptLock()
  lock.tryLock(10000)

  try {
    var doc = SpreadsheetApp.openById(scriptProp.getProperty('key'))
    var sheet = doc.getSheetByName(sheetName)

    var headers = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0]
    var nextRow = sheet.getLastRow() + 1

    var newRow = headers.map(function(header) {
      return header === 'timestamp' ? new Date() : e.parameter[header]
    })

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

    return ContentService
      .createTextOutput(JSON.stringify({ 'result': 'success', 'row': nextRow }))
      .setMimeType(ContentService.MimeType.JSON)
  }

  catch (e) {
    return ContentService
      .createTextOutput(JSON.stringify({ 'result': 'error', 'error': e }))
      .setMimeType(ContentService.MimeType.JSON)
  }

  finally {
    lock.releaseLock()
  }
}

运行我的应用程序后，我收到一条成功消息：

Success!
Response {type: "cors", url: "https://script.googleusercontent.com/macros/echo?u…xxx", redirected: true, status: 200, ok: true, …}
body: ReadableStream
bodyUsed: false
headers: Headers
__proto__: Headers
ok: true
redirected: true
status: 200
statusText: ""
type: "cors"
url: "https://script.googleusercontent.com/macros/echo?user_content_key=..."
__proto__: Response

但不会填充Google电子表格，但是如果我进行console.log记录，则数据仍然存在。

1）我在做什么错了？

2）另外，有没有一种方法可以在不附加空表格的情况下发送数据？

3）最后，如果我想发送更多数据怎么办？

sendingData.append({
  'starRating' = this.feedbackData.starRating
  'nowReading' = this.feedbackData.nowReading
})

还是我需要做的事情：

sendingData.append('starRating', this.feedbackData.starRating)
sendingData.append('nowReading', this.feedbackData.nowReading)

还是什么？

-更新-

发布问题后，我决定重新开始使用Google表格。结果是现在我确实将数据发布到工作表中，但是尽管数据在发布前后都存在，但它还是“未定义的”：

console.log(this.feedbackData)
this.saveToGoogleSheet()
console.log(this.feedbackData)

我已经按照上面的方法尝试过单个变量，或者一次发布所有变量（大多数变量在发布时为“未定义”），如下所示：

saveToGoogleSheet () {
  const scriptURL = 'https://script.google.com/macros/s/.../exec'
  fetch(scriptURL, {method: 'POST', body: JSON.stringify(this.feedbackData)})
    .then(response => console.log('Success!', response))
    .catch(error => console.error('Error!', error.message))
}

并这样：

saveToGoogleSheet () {
  const scriptURL = 'https://script.google.com/macros/s/.../exec'
  fetch(scriptURL, {method: 'POST', body: this.feedbackData})
    .then(response => console.log('Success!', response))
    .catch(error => console.error('Error!', error.message))
}

但结果是相同的。

我的JSON.stringify（this.feedbackData）看起来像这样：

{"userName":"","userNumber":"","friendName":"","friendNumber":"","inviteMessage":"","nowReading":"S2/E1/","starRating":"4"}

Answer 1

• 您已经部署了Web Apps来接受价值。
• 您要通过将{"userName":"","userNumber":"","friendName":"","friendNumber":"","inviteMessage":"","nowReading":"S2/E1/","starRating":"4"}的对象与Javascript fetch()发送来将值放入电子表格，如下图所示。

如果我的理解是正确的，那么该修改如何？

修改点：

• 使用POST方法发送该值时，可以使用e.postData.contents从e的{​​{1}}中检索该值。
  • 但是在这种情况下，该值需要作为字符串发送。因此，请使用doPost(e)。
  • 因此，请在JSON.parse()侧使用body: JSON.stringify(this.feedbackData)}。

修改后的脚本：

请进行如下修改。

Google Apps脚本：

从：

fetch()

至：

var newRow = headers.map(function(header) {
  return header === 'timestamp' ? new Date() : e.parameter[header]
})

Javascript：

请在问题中使用上面“更新”部分的脚本。

var params = JSON.parse(e.postData.contents); // Added
var newRow = headers.map(function(header) {
  return header === 'timestamp' ? new Date() : params[header]; // Modified
});

注意：

• 当您修改Web Apps的Google Apps脚本时，请将Web Apps部署为新版本。这样，最新脚本将反映到Web Apps。请注意这一点。
• 我不确定您的实际电子表格。如果与上图不同，请根据您的情况修改脚本。

参考：

• Web Apps
• Taking advantage of Web Apps with Google Apps Script

如果我误解了您的问题，而这不是您想要的结果，我深表歉意。

Answer 2

我发现了问题：

在这里：

saveToGoogleSheet () {
  const scriptURL = 'https://script.google.com/macros/s/.../exec'
  const form = ''
  var sendingData = new FormData(form)
  sendingData.append('starRating', this.feedbackData.starRating)

  fetch(scriptURL, {method: 'POST', body: new FormData(sendingData)})
    .then(response => console.log('Success!', response))
    .catch(error => console.error('Error!', error.message))
}

我应该更改它：

fetch(scriptURL, {method: 'POST', body: new FormData(sendingData)})

对此：

fetch(scriptURL, {method: 'POST', body: sendingData})

此外，如果我放const form = ''，就不需要var sendingData = new FormData('')