Migracja do trybu piaskownicy IFRAME

Apps Script korzysta z bezpiecznej piaskownicy zapewniająca izolację ochronną Google Workspace aplikacji w określonych sytuacjach. Wszystkie tryby piaskownicy są teraz wycofywane z wyjątkiem IFRAME. Aplikacje korzystające ze starszej piaskownicy nowe tryby IFRAME są teraz używane automatycznie.

W przypadku aplikacji, które wcześniej używały tych starszych trybów z usługą HTML, konieczne może być: wprowadź zmiany w trybie IFRAME, aby uwzględnić te różnice:

  • Musisz teraz zastąpić atrybut target linku za pomocą target="_top" lub target="_blank"
  • Pliki HTML wyświetlane przez usługę HTML muszą zawierać <!DOCTYPE html>, <html> i <body> tagi
  • Natywna biblioteka wczytywania Google api.js nie wczytuje się automatycznie w Tryb IFRAME
  • Użytkownicy, którzy wybrali opcję Wybierz, muszą zadzwonić setOrigin(), ponieważ treści są wyświetlane z nowej domeny
  • Niektóre starsze przeglądarki, w tym IE9, nie są obsługiwane.
  • Zaimportowane zasoby muszą teraz używać protokołu HTTPS
  • Przesyłanie formularzy nie jest już domyślnie zablokowane

Różnice te opisujemy w dalszej części tego artykułu.

W trybie IFRAME ustaw atrybut docelowy linku na _top lub _blank:

Code.js

function doGet() {
  var template = HtmlService.createTemplateFromFile('top');
  return template.evaluate();
}

top.html

<!DOCTYPE html>
<html>
 <body>
   <div>
     <a href="http://google.com" target="_top">Click Me!</a>
   </div>
 </body>
</html>

Możesz też zastąpić ten atrybut za pomocą tagu <base> tag w nagłówku otaczającej strony internetowej:

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
   <div>
     <a href="http://google.com">Click Me!</a>
   </div>
 </body>
</html>

Tagi HTML najwyższego poziomu

W trybie piaskownicy NATIVE (i EMULATED) niektóre tagi HTML jest automatycznie dodawany do pliku Apps Script .html, ale nie dzieje się tak w przypadku za pomocą trybu IFRAME.

Aby mieć pewność, że strony projektu będą prawidłowo wyświetlane za pomocą IFRAME, spakuj plik w następujących tagach najwyższego poziomu:

<!DOCTYPE html>
<html>
  <body>
    <!-- Add your HTML content here -->
  </body>
</html>

Biblioteka natywnego wczytywania JavaScript musi być jawnie wczytana

Skrypty, które korzystały z automatycznego wczytywania natywnej biblioteki wczytywania api.js należy zmienić, aby jawnie wczytać tę bibliotekę, jak w tym przykładzie:

<script src="https://apis.google.com/js/api.js?onload=onApiLoad">
</script>

Zmiana interfejsu Google Picker API

Jeśli korzystasz z interfejsu Google Picker API, musisz wywoływać funkcję setOrigin() podczas tworzenia za pomocą narzędzia PickerBuilder i przekazać w punkcie początkowym google.script.host.origin, jak pokazano na ilustracji w tym przykładzie:

function createPicker(oauthToken) {
  var picker = new google.picker.PickerBuilder()
      .addView(google.picker.ViewId.SPREADSHEETS) // Or a different ViewId
      .setOAuthToken(oauthToken)
      .setDeveloperKey(developerKey)
      .setCallback(pickerCallback)
      .setOrigin(google.script.host.origin) // Note the setOrigin
      .build();
  picker.setVisible(true);
}

Pełny przykład działania znajdziesz w sekcji Okna dialogowe otwierania plików.

Obsługa przeglądarek

Tryb piaskownicy IFRAME opiera się na Piaskownica iframe w HTML5. Funkcja ta nie jest obsługiwana w niektórych starszych przeglądarkach, takich jak Internet Explorer 9. Ten może stanowić problem, jeśli Twój projekt Apps Script:

  • używa HtmlService, oraz
  • poprzednio używany tryb piaskownicy EMULATED lub NATIVE

Przeniesienie tych aplikacji do trybu piaskownicy IFRAME oznacza, że mogą one przestać działać niektóre starsze przeglądarki (szczególnie IE9 i starsze), które nie obsługują elementów iframe HTML5. Piaskownica.

Aplikacje, które proszą już o tryb IFRAME lub w ogóle nie używają HtmlService,

Protokół HTTPS jest teraz wymagany w przypadku zaimportowanych zasobów

Poprzednie aplikacje, w których zasoby importowane za pomocą HTTP, trzeba zmienić na użyj protokołu HTTPS.

Przesyłanie formularzy nie jest już domyślnie zablokowane

W okresie NATIVE zablokowaliśmy możliwość przesyłania formularzy HTML w trybie piaskownicy oraz poruszanie się po stronie. W związku z tym deweloper może po prostu dodać element onclick do przycisku przesyłania i nie musisz się martwić, co stanie się później.

W trybie IFRAME można jednak przesyłać formularze HTML, a jeśli formularz nie ma określonego atrybutu action, dlatego zostanie on przesłany na pustą stronę. Co gorsza: wewnętrzny element iframe przekierowuje na pustą stronę przed tagiem onclick ma szansę skończyć.

Rozwiązaniem jest dodanie do strony kodu JavaScript, który zapobiega elementów od rzeczywistego przesłania, tak by moduły obsługi kliknięć miały czas funkcja:

<script>
  // Prevent forms from submitting.
  function preventFormSubmit() {
    var forms = document.querySelectorAll('form');
    for (var i = 0; i < forms.length; i++) {
      forms[i].addEventListener('submit', function(event) {
        event.preventDefault();
      });
    }
  }
  window.addEventListener('load', preventFormSubmit);
</script>

Pełny przykład można znaleźć w przewodniku po htmlService Komunikacja między serwerami.