Dov'è il mio iframe nell'applicazione web / barra laterale pubblicata?
Ho riscontrato vari errori durante il tentativo di controllare window
in DOM della mia app Web pubblicata e della barra laterale dei componenti aggiuntivi.
window.location
restituisce un URL vago e sconosciuto comen-rysutduudd.google-usercontent.com
invece 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
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:
userHtmlFrame
con èsrc
impostato su/blank
.Questo frame è annidato all'interno di un altro frame con
src
:*.googleusercontent.com
e idsandboxFrame
.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 altop
frame.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
userHtmlFrame
viene ereditata dasandboxFrame
e impostato*.googleusercontent.com
. A tutti gli effetti ( cors , origini whitelisting, richieste di recupero ), questo è il fileorigin
.Il
sandboxFrame
momento 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.top
owindow.parent
owindow.opener
dal 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 ilwindow.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-navigation
manca dagli attributi sandbox. Pertanto, non è possibile cambiare / navigare nel frame superiore (docs.google.com
) qui.