Migracja do trybu piaskownicy IFRAME

Apps Script używa bezpiecznego piaskownicy, aby zapewnić izolację aplikacji w określonych sytuacjach. Wszystkie tryby piaskownicy są teraz wycofywane z użycia z wyjątkiem IFRAME. Aplikacje korzystające ze starszych trybów piaskownicy automatycznie korzystają teraz z nowego trybu IFRAME.

Aplikacje, które wcześniej używały tych starszych trybów w usłudze HTML Service, mogą wymagać wprowadzenia zmian w trybie IFRAME, aby uwzględnić te różnice:

  • Teraz musisz zastąpić atrybut target linku za pomocą atrybutu target="_top" lub target="_blank".
  • Pliki HTML obsługiwane przez usługę HTML muszą zawierać tagi <!DOCTYPE html>, <html> i <body>.
  • Natywna biblioteka wczytywacza Google api.js nie wczytuje się automatycznie w trybie IFRAME
  • Użytkownicy Pickera muszą wywołać funkcję setOrigin(), ponieważ treści są dostarczane 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 blokowane

Te różnice opisujemy w następnych sekcjach.

W trybie IFRAME musisz ustawić atrybut link target 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> w sekcji head 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 są automatycznie dodawane do pliku .html w Google Apps Script, ale nie dzieje się tak w trybie IFRAME.

Aby mieć pewność, że strony projektu są wyświetlane prawidłowo za pomocą IFRAME, owiń zawartość strony w te tagi najwyższego poziomu:

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

Natywna biblioteka ładowarki JavaScript musi być wczytana wprost.

Skrypty, które korzystały z automatycznego wczytywania natywnej biblioteki ładowarki api.js, muszą zostać zmienione, aby wczytywać tę bibliotekę w sposób jawny, jak w tym przykładzie:

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

Zmiana interfejsu Google Picker API

Jeśli używasz interfejsu Google Picker API, musisz teraz wywołać funkcję setOrigin() podczas tworzenia obiektu PickerBuilder i przekazać w nim źródło google.script.host.origin, jak 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 znajdziesz w artykule Okno otwierania plików.

Obsługa przeglądarek

Tryb piaskownicy IFRAME opiera się na funkcji piaskownicy elementu iframe w HTML5. Ta funkcja nie jest obsługiwana w niektórych starszych przeglądarkach, takich jak Internet Explorer 9. Może to być problemem, jeśli Twój projekt Apps Script:

  • używa HtmlService,
  • wcześniej używane EMULATED lub NATIVE piaskownicy

Przeniesienie tych aplikacji do trybu piaskownicy IFRAME może spowodować, że przestaną one działać w niektórych starszych przeglądarkach (zwłaszcza IE9 i starszych), które nie obsługują funkcji piaskownicy iframe w HTML5.

Ten problem nie dotyczy aplikacji, które już wymagają trybu IFRAME lub w ogóle go nie używają.HtmlService

W przypadku zaimportowanych zasobów wymagany jest teraz protokół HTTPS

Wcześniejsze aplikacje, które importowały zasoby za pomocą HTTP, muszą zostać zmienione tak, aby używały protokołu HTTPS.

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

W przypadku odizolowanego środowiska NATIVE formularze HTML nie mogły być przesyłane ani nie można było nawigować po stronie. W takim przypadku deweloper mógłby po prostu dodać do przycisku przesyłania element onclick obsługujący i nie musiałby się martwić, co się stanie później.

W trybie IFRAME można jednak przesyłać formularze HTML, a jeśli element formularza nie ma określonego atrybutu action, zostanie przesłany na pustą stronę. Co gorsza, wewnętrzny iframe przekieruje na pustą stronę, zanim moduł obsługi onclick skończy działanie.

Rozwiązaniem jest dodanie do strony kodu JavaScript, który uniemożliwi przesyłanie elementów formularza, aby dać wystarczająco dużo czasu elementom przetwarzającym kliknięcia:

<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 znajdziesz w przewodniku HtmlService Komunikacja klient–serwer.