Bermigrasi ke Mode Sandbox IFRAME

Apps Script menggunakan sandbox keamanan untuk menyediakan isolasi perlindungan bagi Google Workspace aplikasi dalam situasi tertentu. Semua mode sandbox sekarang dihentikan kecuali untuk IFRAME. Aplikasi yang menggunakan sandbox lama kini menggunakan mode IFRAME yang lebih baru secara otomatis.

Aplikasi yang sebelumnya menggunakan mode lama ini dengan Layanan HTML mungkin perlu melakukan perubahan untuk mode IFRAME, untuk mengatasi perbedaan berikut:

  • Anda sekarang harus mengganti atribut target link menggunakan target="_top" atau target="_blank"
  • File HTML yang ditayangkan oleh Layanan HTML harus menyertakan <!DOCTYPE html>, <html>, dan <body> tag
  • Library loader native Google api.js tidak dimuat secara otomatis di Mode IFRAME
  • Alat pilih yang perlu dipanggil pengguna setOrigin() karena konten ditayangkan dari domain baru
  • Beberapa browser lama, termasuk IE9, tidak didukung
  • Resource yang diimpor kini harus menggunakan HTTPS
  • Pengiriman formulir tidak lagi dicegah secara default

Perbedaan ini dijelaskan di bagian berikut.

Dalam mode IFRAME, Anda perlu menetapkan atribut target link ke _top atau _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>

Anda juga dapat mengganti atribut ini menggunakan atribut <base> tag di bagian head laman web yang terlampir:

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

Tag HTML tingkat atas

Di bawah mode sandbox NATIVE (dan EMULATED), tag HTML tertentu akan menjadi otomatis ditambahkan ke file .html Apps Script, tetapi ini tidak terjadi saat menggunakan mode IFRAME.

Untuk memastikan halaman proyek Anda ditayangkan dengan benar menggunakan IFRAME, gabungkan konten halaman dalam tag level teratas berikut:

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

Library loader JavaScript native harus dimuat secara eksplisit

Skrip yang mengandalkan pemuatan otomatis library loader native api.js harus diubah untuk memuat library ini secara eksplisit, seperti dalam contoh berikut:

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

Perubahan Google Picker API

Saat menggunakan Google Picker API, Anda sekarang harus memanggil setOrigin() saat membuat PickerBuilder dan teruskan google.script.host.origin asal, seperti yang ditunjukkan dalam contoh berikut:

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);
}

Untuk contoh yang berfungsi penuh, lihat Dialog pembukaan file.

Dukungan browser

Mode sandbox IFRAME didasarkan pada sandboxing iframe di HTML5. Ini tidak didukung pada beberapa browser lama, seperti Internet Explorer 9. Ini dapat menjadi masalah jika project Apps Script Anda:

  • menggunakan HtmlService, dan
  • sandbox EMULATED atau NATIVE yang sebelumnya digunakan

Jika Anda memigrasikan aplikasi ini ke mode sandbox IFRAME, aplikasi tersebut mungkin tidak berfungsi lagi di beberapa browser lama (terutama IE9 dan versi sebelumnya) yang tidak mendukung iframe HTML5 dalam fitur sandboxing.

Aplikasi yang sudah meminta mode IFRAME atau tidak menggunakan HtmlService sama sekali tidak terpengaruh oleh masalah ini.

HTTPS kini diperlukan untuk resource yang diimpor

Aplikasi sebelumnya yang mengimpor resource menggunakan HTTP harus diubah agar menggunakan HTTPS.

Pengiriman formulir tidak lagi dicegah secara default

Dalam NATIVE formulir HTML sandbox tidak dapat benar-benar dikirim dan menavigasi halaman. Dengan demikian, developer dapat menambahkan onclick ke tombol {i>submit<i} dan tidak perlu khawatir tentang apa yang terjadi setelahnya.

Namun, formulir HTML diizinkan untuk dikirim dengan mode IFRAME, dan jika formulir tidak memiliki atribut action yang ditentukan yang akan dikirimkan ke halaman kosong. Selain itu, iframe dalam akan dialihkan ke halaman kosong sebelum onclick memiliki kesempatan untuk menyelesaikan.

Solusinya adalah dengan menambahkan kode JavaScript ke halaman Anda yang mencegah formulir dari pengiriman, sehingga pengendali klik punya waktu untuk {i>function<i}:

<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>

Contoh lengkap dapat ditemukan di panduan HTMLService Komunikasi Klien ke Server.