Dov'è il mio iframe nell'applicazione web / barra laterale pubblicata?

Aug 24 2020

Ho riscontrato vari errori durante il tentativo di controllare windowin DOM della mia app Web pubblicata e della barra laterale dei componenti aggiuntivi.

  • window.locationrestituisce un URL vago e sconosciuto come n-rysutduudd.google-usercontent.cominvece dell'URL della mia app web pubblicatascript.google.com/[SCRIPT_ID]/exec

  • I tentativi di reindirizzare la mia app web pubblicata a un nuovo URL falliscono window.location.href=www.google.com

  • I moduli nell'app Web, quando inviati vengono reindirizzati a una pagina vuota.

Dopo la ricerca, ho pensato che ciò fosse dovuto al contenuto web offerto in un iframe. La documentazione non mostra molto tranne che la webapp è in sandbox in un iframe.

Documentazione pertinente che ho ricercato:

  • https://developers.google.com/apps-script/migration/iframe
  • https://developers.google.com/apps-script/guides/html/restrictions

Alcune delle domande rilevanti che ho esaminato:

  • window.location.href = window.location.href restituisce una pagina vuota
  • L'app web di Google Script diventa una pagina vuota dopo l'invio
  • Come impedire che l'URL reindirizzato venga mascherato?

La mia domanda specifica è: dove si trova esattamente la mia finestra iframe nell'app Web pubblicata o il mio componente aggiuntivo sulla barra laterale?

Risposte

6 TheMaster Aug 24 2020 at 03:45
              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       |    |     |
|     |    |                       |    |     |
|     |    |                       |    |     |
|     |    |                       |    |     |
|     |    |                       |    |     |
|     |    |                       |    |     |
|     |    +-----------------------+    |     |
|     |                                 |     |
|     |                                 |     |
|     +---------------------------------+     |
|                                             |
|                                             |
|                                             |
+---------------------------------------------+

Hai ragione. La maggior parte degli errori sono dovuti al sandboxing iframe eseguito da Google. Per rispondere alla tua domanda,

  • La tua finestra si trova in un iframe con id: userHtmlFramecon è srcimpostato su /blank.

  • Questo frame è annidato all'interno di un altro frame con src: *.googleusercontent.come id sandboxFrame.

  • Infine, The sandboxFrameè annidato all'interno del frame principale:script.google.com

Appunti:

  • window nella tua app pubblicata fa riferimento al frame più interno.

  • Questa cornice più interna ha i propri cookie , memoria e molti altri attributi esclusivi di una finestra.

  • Sfortunatamente, questo frame interno non può essere spostato altrove.

  • Tutto navigazione finestra deve essere fatto sul telaio esterno: script.google.com. Questo è il motivo per cui la documentazione ti chiede di impostare baseo ancoraretarget al topframe.

  • I moduli senza actionvengono inviati al telaio interno /blank. Pertanto, verrai reindirizzato a una pagina vuota. La documentazione afferma,

Con la modalità IFRAME, tuttavia, i moduli HTML possono essere inviati e se un elemento del modulo non ha un attributo di azione specificato, verrà inviato a una pagina vuota. Peggio ancora, l'iframe interno reindirizzerà alla pagina vuota prima che il gestore onclick abbia la possibilità di terminare.

  • L' origine del vostro iframe userHtmlFrameviene ereditata da sandboxFramee impostato *.googleusercontent.com. A tutti gli effetti ( cors , origini whitelisting, richieste di recupero ), questo è il file origin.

  • Il sandboxFramemomento ha la seguente politica caratteristica :allow

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

  • Attualmente, ha i seguenti attributi sandbox , che limitano ciò che puoi fare ad altri frame:

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

  • Le finestre esterne / altre finestre possono essere referenziate utilizzando window.topo window.parento window.openerdal telaio interno. Ma ci sono più restrizioni imposte a causa della stessa politica di origine . L'accesso alle origini incrociate è per lo più limitato. Di particolare rilievo sarebbe il window.postMessage, che consente la comunicazione tra i frame.

            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       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    |                       |    | |   |
|  |  |    +-----------------------+    | |   |
|  |  |                                 | |   |
|  |  |                                 | |   |
|  |  +---------------------------------+ |   |
|  |                                      |   |
|  +--------------------------------------+   |
|                                             |
+---------------------------------------------+

Tutte le note precedenti per l'app Web sono valide anche per i contenuti Web pubblicati utilizzando HtmlService nella barra laterale o nelle finestre di dialogo modali. Però,

  • C'è un ulteriore livello nidificato di iframe qui.
  • Il allow-top-navigationmanca dagli attributi sandbox. Pertanto, non è possibile cambiare / navigare nel frame superiore ( docs.google.com) qui.