你遇到的Origin not allowed by Access-Control-Allow-Origin错误，核心原因是用fetch发起了跨域AJAX请求，而Google Apps Script（GAS）的Web应用默认不支持跨域fetch调用——你设置的XFrameOptionsMode.ALLOWALL只控制页面能否被嵌入iframe，和CORS（跨域资源共享）权限完全无关。

下面给你两种可行的解决方案：

方案一：用iframe提交表单（无需fetch，最简单） #

你的代码里已经尝试用iframe，但有一处关键错误：document.body.innerHTML = iframe.innerHTML是把iframe的内部内容替换了body，而不是把iframe添加到页面里。修正后的前端代码如下：

document.getElementsByTagName("form")[0].setAttribute("target", "Response");
document.addEventListener("submit", e => {
  e.preventDefault();
  const form = e.target;
  // 创建隐藏的iframe用于接收响应
  const iframe = Object.assign(document.createElement("iframe"), {
    name: "Response",
    style: "display: none;" // 隐藏iframe，不影响页面
  });
  document.body.appendChild(iframe); // 把iframe添加到页面
  // 提交表单到iframe（这种方式不会触发CORS检查）
  form.submit();
  
  // 可选：监听iframe加载完成，做后续处理
  iframe.addEventListener("load", () => {
    console.log("表单提交完成！");
    document.body.removeChild(iframe); // 提交完成后移除iframe
  });
});

这种传统的iframe提交方式完全绕开了CORS限制，适合大多数场景。

方案二：强制开启CORS支持（适合必须用fetch的场景） #

如果你一定要用fetch，需要在GAS端添加CORS响应头，并且处理浏览器发送的OPTIONS预检请求：

1. 修改GAS的代码 #

function doPost(e) {
  // 1. 处理表单数据，写入Google Sheet
  const sheetId = "10VHS6bozcdNFYcRskkoONMT8Rt-2CwJ_LJGQWdkTJq4";
  const sheet = SpreadsheetApp.openById(sheetId).getSheetByName("Sheet1");
  // 处理复选框的数组值（如果用户选了多个，e.parameter.Foobar是数组）
  const foobarValues = Array.isArray(e.parameter.Foobar) 
    ? e.parameter.Foobar 
    : [e.parameter.Foobar || "无选择"];
  sheet.appendRow([new Date(), foobarValues.join(", ")]);

  // 2. 设置CORS响应头
  const output = HtmlService.createHtmlOutput("提交成功");
  output.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
  const blob = output.getBlob();
  blob.setHeaders({
    "Access-Control-Allow-Origin": "https://example.com", // 替换成你的域名，或者用"*"允许所有（不推荐）
    "Access-Control-Allow-Methods": "POST, OPTIONS",
    "Access-Control-Allow-Headers": "Content-Type"
  });
  return blob;
}

// 处理浏览器的OPTIONS预检请求（必须添加）
function doOptions(e) {
  const blob = ContentService.createTextOutput("");
  blob.setHeaders({
    "Access-Control-Allow-Origin": "https://example.com",
    "Access-Control-Allow-Methods": "POST, OPTIONS",
    "Access-Control-Allow-Headers": "Content-Type"
  });
  return blob;
}

2. 确认Web应用部署设置 #

确保你的GAS Web应用部署时：

• 执行身份选择“以你自己的身份执行”（因为需要读写你的Google Sheet）
• 谁可以访问应用选择“任何人，甚至匿名用户”

关键知识点 #

• XFrameOptionsMode.ALLOWALL：仅控制你的GAS页面能否被其他网站的iframe嵌入，和跨域AJAX请求（fetch/XHR）无关。
• CORS错误是浏览器的安全机制：当你用fetch从https://example.com请求https://script.google.com时，浏览器会先发送OPTIONS预检请求，只有GAS返回允许的跨域头，才会继续执行POST请求。

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