Menu
I am trying to embed a page that is dynamically built using Javascript in Google Apps Script into my website in an iFrame, but the iFrame's content isn't shown. Google Apps Script has a same-origin policy which prevents it from loading.
What I am trying to do is (I removed the full link):
<iframe src="https://script.google.com/a/macros/SCRIPT_ID"></iframe>
The error I am getting is:
Refused to display 'https://script.google.com/a/macros/SCRIPT_ID'
in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.
Is there a way to alter the policy and load the content in an iFrame?
414
Navigate to the page in your Site where you want to embed the web app. Click the edit icon, and then Insert > Google Apps Script. Choose the script from the list that represents your web app. If your web app is not bound to this Site, you can paste in the web app URL instead.
To embed Google Apps Script Web Apps in Google Sites, Copy the published Web App URL (For testing, you can directly copy the above live form link) Go to Google Site, choose the Embed option, paste the URL you copied, and then click Insert.
Based on feedback, Google has now added the ability to embed an entire webpage as an iframe in a new Google Site. This allows you to pull in content from other websites and Google tools like Apps Script and Data Studio. Select Embed URL from the Insert menu.
The problem with this, is that if you embed your App Script into an iframe, and a user visits the page it is embedded into and they are logged out of Google, then this happens: If you open your devtools when this happens, you will also see this descriptive error message:
Use the Embed option from the Insert panel (or the Embed option from the Disc) Enter your Google Apps Script published web app URL in in By URL tab of the Embed from the web dialogue box Choose the Whole page option Use the Insert button to complete and then you can choose to size and position the embedded script
A) The script is set to be authorized by your own account (executing as yourself), not the users, B) The script is set to be authorized by the end user (“execute the app as user accessing the web app”), but they are logged in and already authorized by the time they load the page the iframe embed is on.
Choose the script from the list that represents your web app. If your web app is not bound to this Site, you can paste in the web app URL instead. Click the Selectbutton, choose the desired options from the next dialog, and click Save. Save your changes to the page and then you should see your web app embedded in your Sites page.
Google had just recently enabled this feature. It has been under a 'feature request' status for quite a long time. Link here
You can now explicitly define X-Frame-Options.
To allow embedding under another domain, the option should be HtmlService.XFrameOptionsMode.ALLOWALL
Google documentation on the subject:
https://developers.google.com/apps-script/reference/html/html-output#setXFrameOptionsMode(XFrameOptionsMode)
Example:
function doGet() {
return HtmlService.createTemplateFromFile('form.html')
.evaluate() // evaluate MUST come before setting the Sandbox mode
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}
Hope this helps!
162
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
