Google Apps Script remove warning banner
Asked Answered
T

5

7

I am putting a GeoChart on my Google Site using a Google Apps Script. Viewing the page when I am not logged into my google account shows a grey banner at the top with states: "This application was created by another user, not by Google." See it here.

screenshot

Is there a way to remove this banner or move it to the bottom of the page so it looks better? I found a short discussion here (see fourth comment), but this did not work with the HtmlOutput object I am using in the doGet

function doGet() {
return HtmlService.createHtmlOutputFromFile('prate').setSandboxMode(HtmlService.SandboxMode.IFRAME);
}
Trite answered 10/11, 2015 at 16:52 Comment(2)
In the FireFox dev tools I can set .warning-bar's visibility: none and the grey bar goes away. That's more-or-less what the 2011 UiService work-around was doing, so it may be possible to control this with custom CSS.Background
issuetracker.google.com/issues/63521070#comment4Udela
B
8

The two options that would seem possible for suppressing that warning from a WebApp made using HtmlService are:

  1. Custom CSS, e.g. in Stylesheet.html (assuming you've started from the WebApp script template).

    .warning-bar {
      visibility: hidden;
    }
    

    I tried this, and found it had no effect on the final display. If there is an element with class="warning-bar" inside the iframe'd HTML, that element will be hidden. Likewise if we try to modify the warning bar by id, #warning; no impact on the element outside of our iframe.

    There is no CSS support for parent elements, so this is a dead end.

  2. Use client-side JavaScript to manipulate the elements outside of our iframe. By adding code to JavaScript.html (again, assuming WebApp script template), we can try to change document elements.

    With jQuery:

    $('.warning-bar:first',parent.document).hide();
    

    With pure JavaScript:

    top.getElementById('warning').style.display = 'none';
    

    Neither of those work. The configuration that Google uses for hosting Google Apps Script blocks JavaScript running in an iframe from accessing items in the parent page. Here's the error that shows up in the JavaScript console:

    Uncaught SecurityError: Blocked a frame with origin "https://n-gtoiuxrqufcpexrnkeysovsfb7ibnjwczjyz6ii-script.googleusercontent.com" from accessing a frame with origin "https://script.google.com". Protocols, domains, and ports must match.

    They've forced our script's iframe to have a host domain that differs from that of the surrounding document, enabling the single-domain security policy to block the exact sort of actions we're trying to do.

According to the issue you linked to in your quesiton, the only option for avoiding that annoying message is to switch to a paid Google Apps Domain (e.g. Business or Education).

Background answered 10/11, 2015 at 19:25 Comment(2)
Thanks @Background for the help, not the answer I was hoping for but thats ok. I just decided to change the way I put the maps on the page so that the banner only shows up once at the very top. Seems like the best solution for now.Trite
As pointed by @AmitAgarwal, iframing the page will hide the banner but you'll have to set the page's X-Frame-Options to allow being iframed.Doublespace
C
14

For anyone who cares, i got around this by embedding a google page with this issue in an iframe and using negative margins. Cant see the bars. Just throwing it out there in-case anyone else could use the suggestion

Chutzpah answered 28/1, 2017 at 1:9 Comment(1)
Are you aware if this still is working for you in 2019?Bryan
B
8

The two options that would seem possible for suppressing that warning from a WebApp made using HtmlService are:

  1. Custom CSS, e.g. in Stylesheet.html (assuming you've started from the WebApp script template).

    .warning-bar {
      visibility: hidden;
    }
    

    I tried this, and found it had no effect on the final display. If there is an element with class="warning-bar" inside the iframe'd HTML, that element will be hidden. Likewise if we try to modify the warning bar by id, #warning; no impact on the element outside of our iframe.

    There is no CSS support for parent elements, so this is a dead end.

  2. Use client-side JavaScript to manipulate the elements outside of our iframe. By adding code to JavaScript.html (again, assuming WebApp script template), we can try to change document elements.

    With jQuery:

    $('.warning-bar:first',parent.document).hide();
    

    With pure JavaScript:

    top.getElementById('warning').style.display = 'none';
    

    Neither of those work. The configuration that Google uses for hosting Google Apps Script blocks JavaScript running in an iframe from accessing items in the parent page. Here's the error that shows up in the JavaScript console:

    Uncaught SecurityError: Blocked a frame with origin "https://n-gtoiuxrqufcpexrnkeysovsfb7ibnjwczjyz6ii-script.googleusercontent.com" from accessing a frame with origin "https://script.google.com". Protocols, domains, and ports must match.

    They've forced our script's iframe to have a host domain that differs from that of the surrounding document, enabling the single-domain security policy to block the exact sort of actions we're trying to do.

According to the issue you linked to in your quesiton, the only option for avoiding that annoying message is to switch to a paid Google Apps Domain (e.g. Business or Education).

Background answered 10/11, 2015 at 19:25 Comment(2)
Thanks @Background for the help, not the answer I was hoping for but thats ok. I just decided to change the way I put the maps on the page so that the banner only shows up once at the very top. Seems like the best solution for now.Trite
As pointed by @AmitAgarwal, iframing the page will hide the banner but you'll have to set the page's X-Frame-Options to allow being iframed.Doublespace
H
7

If you embed the Google Script web app in another website using the IFRAME tag, the warning banner will be hidden. Make sure you set the page's X-Frame-Options header to XFrameOptionsMode.ALLOWALL and it will let any site iframe the web app page.

See docs.

Hankins answered 1/12, 2019 at 12:0 Comment(0)
C
2

If you embed it in a google site the banner will not display.

Catchy answered 1/12, 2019 at 11:51 Comment(0)
S
-3

I'm successfully using the Chrome extension Custom JavaScript for websites for this. It allows you to run any JavaScript on any domain.

To hide the Google warning banner, just enter the following code in the custom JavaScript window:

document.getElementById('warning').style.display = 'none';

And hit save. It will be applied right away.

Sefton answered 31/5, 2018 at 8:37 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.