如何正确设置Google Apps Script的XFrameOptionsMode实现iframe嵌入？

核心问题修正：XFrameOptionsMode调用位置错误 #

你当前代码里把html.evaluate()的结果传给HtmlService.createHtmlOutput()，这会覆盖之前的X-Frame-Options设置。正确的做法是直接对html.evaluate()返回的HtmlOutput对象调用setXFrameOptionsMode。

修正后的完整代码：

function doGet(e) {
  //URI PARAMETER VALUE(S)
  let mpage = 'mapp';
  if ('page' in e.parameters) {
    mpage = e.parameters['page'][0];
  }

  try {
    //TRY TO ENABLE THE WEB APP WITH CUSTOM DATA USAGE
    let html = HtmlService.createTemplateFromFile(mpage);
    html.data = { title: mpage, e: e };
    
    // 正确设置X-Frame-Options
    let htmlOutput = html.evaluate()
      .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
    htmlOutput.addMetaTag('viewport', 'width=device-width, initial-scale=1, shrink-to-fit=no');
    return htmlOutput;
  } catch (err) {
    //IF THERE IS AN ERROR, DISPLAY THE ISSUE
    const html = HtmlService.createHtmlOutput('Page Not Found : ' + JSON.stringify(err));
    return html;
  }
}

关键部署设置检查 #

代码修正后，必须确保Web应用的部署配置符合要求：

• 打开Apps Script编辑器，点击右上角「部署」→「新部署」
• 类型选择「Web应用」，版本选择「新建」
• 「Execute as」选择「Me（你的账号）」
• 「Who has access to the app」必须设置为**「Anyone, even anonymous」**（仅选「Anyone」可能会因域限制导致iframe加载失败）
• 部署后复制新生成的Web应用URL，替换iframe中的旧链接

额外排查要点 #

• 清除浏览器缓存：旧的X-Frame-Options响应头可能被缓存，导致新设置不生效
• 确保嵌入页面使用HTTPS：Google Apps Script Web应用仅支持HTTPS，嵌入页面如果是HTTP会被浏览器阻止（混合内容限制）
• 查看浏览器控制台错误：按F12打开开发者工具，切换到「控制台」标签，查看是否有CSP或X-Frame-Options相关的报错，精准定位问题

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