向Google Apps Script发送POST请求时遭遇CORS策略错误求助

核心问题点 #

• Web App部署权限配置错误：若部署时未选择「任何人，甚至匿名」，Google会优先触发认证拦截，导致你自定义的CORS响应头无法返回给客户端。
• 未处理OPTIONS预检请求：由于你的POST请求携带Content-Type: application/json，浏览器会先发起OPTIONS预检请求验证权限，但服务端缺少对应的处理函数，直接引发CORS错误。
• no-cors模式的局限性：启用该模式后浏览器会返回不透明响应，无法读取响应内容，仅适用于无需处理返回结果的场景。

修正后的服务端Google Apps Script代码 #

function doPost(e) {
  var result;
  dosomething(); // 确保此函数已定义实现
  Logger.log("doPost called");

  var headers = {
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
    'Access-Control-Allow-Headers': 'Content-Type',
  };

  return ContentService.createTextOutput(JSON.stringify({ result: result }))
    .setMimeType(ContentService.MimeType.JSON)
    .setHeaders(headers);
}

// 添加OPTIONS预检请求处理函数
function doOptions(e) {
  var headers = {
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
    'Access-Control-Allow-Headers': 'Content-Type',
  };
  return ContentService.createTextOutput('')
    .setMimeType(ContentService.MimeType.TEXT)
    .setHeaders(headers);
}

关键部署设置修正 #

重新部署Web App：

• 点击「部署」→「新部署」
• 类型选择「Web应用」
• 「谁可以访问此应用」选择**「任何人，甚至匿名」**
• 部署后复制新的Web App URL替换客户端代码中的webAppUrl

客户端代码调整（如需读取响应） #

无需设置mode: 'no-cors'，保持原有请求模式即可（服务端修正后会处理CORS）：

function sendRequestToAppsScript(action) {
  console.log('heard');
  fetch(webAppUrl, {
    method: 'POST',
    body: JSON.stringify({ action: action }),
    headers: new Headers({'Content-Type': 'application/json'}),
  })
  .then(response => response.json()) // 解析JSON格式响应
  .then(data => {
    console.log('Response from Google Apps Script:', data);
  })
  .catch(error => console.error('Error:', error));
}

验证步骤 #

1. 确认Web App部署权限为「任何人，甚至匿名」
2. 测试客户端请求，检查控制台是否仍有CORS错误
3. 查看Google Apps Script日志（查看→日志），确认doPost或doOptions是否被正常调用

内容的提问来源于stack exchange，提问作者tim