Google Apps 脚本嵌入到 iFrame 时不加载

Question

我正在尝试将我的 Google Apps Script WebApp 嵌入到另一个域的 iFrame 中，但未加载该 Web 应用程序，我只看到一个白屏。 webinspector也没有报错。

Webapp 发布：作为 me 执行并且 Access 具有给定域中的任何人。

根据this，我实现了这样的 doGet 方法：

function doGet(e) {
 return HtmlService
 .createHtmlOutputFromFile('html/index')
 .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}

IFrame 如下所示：

<iframe src="https://script.google.com/a/my_domain/macros/s/ADjidojcojv/exec" title="test" width="558" height="300"></iframe>

当用户登录 Google 时，将显示 webapp。但是，当用户未登录 account.google.com refused to connect

的灰色图像时

我认为原因是有一个重定向到 google 登录不允许显示。此外，在这种情况下，还有另一个重定向到 SAML SSO 应用程序。因此，当您正常登录 google 时，您将重定向到 SAML SSO 登录。

我有哪些选择？

[编辑] 我找到了 exact same problem 的人和一个可能的解决方案。显然没有简单的方法可以做到这一点...

Answer 1

发布 web-apps 访问权限：“任何人”时，最终用户需要登录。否则，用户将被重定向到 Google 登录页面。 Google 的登录页面不允许自身被 iframed。如果您已登录，网络应用程序不会重定向到 Google 的登录页面，并且不会出现此错误，否则会出现。

可能的解决方案：

事先警告用户必须登录
使用访问权限发布：“任何人甚至匿名”
如果那不可能，可以使用 window.length（少数可跨源访问的属性之一）检测 iframed 页面是否已加载 window，这将是0 如果页面拒绝连接并且在 web-app 中超过 0，因为您的页面是 iframed。然后可以将用户重定向到登录页面。

<!DOCTYPE html>
<html>
  <body>
    body
    <iframe
      src="https://script.google.com/macros/s/[SCRIPT_ID]/exec"
      >Loading
    </iframe>
    <script>
      (() => {
        console.log("loading page");
        const f = document.querySelector("iframe");
        f.onload = (e) => {
          console.log("iframe onload");
          const fw = f.contentWindow;
          if (fw.length > 0) console.info("logged in");
          else {
            alert("Please Login!");
            window.location = "https://accounts.google.com";
          }
        };
      })();
    </script>
  </body>
</html>

参考文献：

Same origin policy

Google Apps 脚本嵌入到 iFrame 时不加载

Google Apps Script does not load when embedded into iFrame

google-apps-script

iframe

web-applications

same-origin-policy

x-frame-options

可能的解决方案：

参考文献：