I’m working on a web application that embeds Google Docs using their API. The document loads inside a modal popup using an iframe implementation.
Everything functions correctly, but I’m facing an issue when users click the Save and Close button within the Google Docs interface. Instead of just closing the modal, it redirects my main page to the Google Docs website.
Is there a way to intercept this action and simply close the modal window without the unwanted redirection? I want users to stay on my application after saving their changes.
Any suggestions or workarounds would be greatly appreciated.
Had this exact problem six months ago building a document management system. Google Docs treats closing the iframe like a navigation event in the parent window, which triggers the redirect. I fixed it with a beforeunload event listener plus proper iframe communication protocols. You’ve got to override the default window behavior by catching the navigation attempt before it runs. Another thing that worked was wrapping the iframe in a div with pointer-event controls, then watching for DOM changes that show the save finished. Bottom line: stop the parent window from getting that redirect command while letting the save complete.
Google Docs redirects because it tries to navigate the parent window after saving. I fixed this with a postMessage listener between the iframe and parent window. Watch for specific message events from the Google Docs iframe and handle the close manually. Also try setting the iframe’s referrerpolicy to ‘no-referrer’ - it blocks some navigation attempts. If you’ve got access to the Google Docs API, use the onSave callback instead. You get way more control over what happens after saving. Bottom line: catch the communication before the default redirect kicks in.
i ran into that too! make sure ur iframe is set up with the sandbox attribute - it stops some actions. also try catching the click event on the ‘Save and Close’ button. hope that helps!