我的 iframe 在已发布网站 application/sidebar 中的什么位置？

Question

在尝试控制我已发布的网络应用程序和插件侧边栏的 DOM 中的 window 时，我运行遇到了各种错误。

window.location returns 一个模糊的未知 url 像 n-rysutduudd.google-usercontent.com 而不是我发布的网络应用程序 url script.google.com/[SCRIPT_ID]/exec
尝试将我发布的网络应用程序重定向到新的 url 失败 window.location.href=www.google.com
Web 应用程序中的表单，提交后重定向到空白页面。

经过研究，我认为这是由于 iframe 中提供的网络内容所致。除了 webapp 在 iframe 中被沙盒化之外，文档没有显示太多内容。

我研究过的相关文档：

我调查过的一些相关问题：

我的具体问题是：我的 iframe window 在已发布的网络应用程序中或我在边栏上的添加到底在哪里？

Answer 1

              PUBLISHED WEB APP
+---------------------------------------------+
|              script.google.com              |
|                                             |<------- [#0] window.top The top frame
|                                             |
|     +---------------------------------+     |
|     |     *.googleusercontent.com     |<----+-------- [#1] Outer Sandboxed Iframe
|     |         sandboxFrame            |     |
|     |    +-----------------------+    |     |
|     |    |        /blank         |    |     |
|     |    |    userHtmlFrame      |    |     |
|     |    |                       |    |     |
|     |    |     Where the html    |<---+-----+-------- [#2] Inner Sandboxed Iframe
|     |    |    file you created   |    |     |
|     |    |       is loaded       |    |     |
|     |    |                       |    |     |
|     |    |                       |    |     |
|     |    |                       |    |     |
|     |    |                       |    |     |
|     |    |                       |    |     |
|     |    +-----------------------+    |     |
|     |                                 |     |
|     |                                 |     |
|     +---------------------------------+     |
|                                             |
|                                             |
|                                             |
+---------------------------------------------+

你是对的。大多数错误是由于 iframe 由 Google 完成的沙盒。回答你的问题，

您的 window 位于 ID 为 userHtmlFrame 的 iframe 中，其 src 设置为 /blank。
此框架嵌套在具有 src 的另一个框架内：*.googleusercontent.com 和 ID sandboxFrame.
最后，sandboxFrame嵌套在主框架内：script.google.com

备注：

window在您发布的应用中指的是最里面的框架。
这个最里面的框架有它自己的 cookies, storage 和 window.
独有的大多数其他属性
遗憾的是，无法在其他地方导航此内部框架。
所有 window 导航必须在最外层框架上完成：script.google.com。这就是 documentation asks you to set base or anchor's target 到 top 框架的原因。
没有 action are submitted to the inner frame /blank. Therefore, you're redirected to a blank page. The documentation 状态的表格，

With IFRAME mode however HTML forms are allowed to submit, and if a form element has no action attribute specified it will submit to a blank page. Worse, the inner iframe will redirect to the blank page before the onclick handler has a chance to finish.

origin of your iframe userHtmlFrame is inherited from sandboxFrame and set to *.googleusercontent.com. For all intents and purposes(cors, whitelisting origins, fetch个请求），这是有效的origin。
sandboxFrame目前有following feature policy：allow

accelerometer *; ambient-light-sensor *; autoplay *; camera *; encrypted-media *; fullscreen *; geolocation *; gyroscope *; magnetometer *; microphone *; midi *; payment *; picture-in-picture *; speaker *; usb *; vibrate *; vr *

目前，它有以下sandbox attributes，这限制了您对其他框架的操作：

allow-downloads allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-top-navigation-by-user-activation

外部windows/other windows 可以从内部框架使用window.top 或window.parent 或window.opener 引用。但是，由于 same origin policy，存在多项限制。跨源访问主要受到限制。需要特别注意的是 window.postMessage，它允许帧之间进行通信。

            SIDEBAR/MODAL DIALOG
+---------------------------------------------+
|              docs.google.com                |
|  +--------------------------------------+   |<------- [#0] window.top The top frame
|  |      /macros/.../iframedAppPanel     |<--+-------- [#1] Frame1 Same origin 
|  |  +---------------------------------+ |   |
|  |  |     *.googleusercontent.com     |<|---+-------- [#2] Outer Sandboxed Iframe
|  |  |         sandboxFrame            | |   |
|  |  |    +-----------------------+    | |   |
|  |  |    |        /blank         |    | |   |
|  |  |    |    userHtmlFrame      |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |     Where the html    |<---+-|---+-------- [#3] Inner Sandboxed Iframe
|  |  |    |    file you created   |    | |   |
|  |  |    |       is loaded       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    +-----------------------+    | |   |
|  |  |                                 | |   |
|  |  |                                 | |   |
|  |  +---------------------------------+ |   |
|  |                                      |   |
|  +--------------------------------------+   |
|                                             |
+---------------------------------------------+

以上针对网络应用程序的所有说明也适用于在侧边栏或模式对话框中使用 HtmlService 发布的网络内容。然而，

这里多了一层嵌套的iframe
沙盒属性中缺少 allow-top-navigation。因此，这里无法change/navigate顶框(docs.google.com)。

变更日志：

Sep 1, 2021：删除了 allow-top-navigation 并添加了 allow-top-navigation-by-user-activation。以开发人员的便利为代价提高了最终用户的安全性。

我的 iframe 在已发布网站 application/sidebar 中的什么位置？

Where is my iframe in the published web application/sidebar?

iframe

web-applications

google-apps-script

备注：

变更日志：