JavaScript dengan Sandbox

JavaScript dengan sandbox adalah subkumpulan bahasa JavaScript yang disederhanakan yang menyediakan cara aman untuk mengeksekusi logika JavaScript arbitrer dari template kustom Google Tag Manager. Untuk memberikan lingkungan eksekusi yang aman, beberapa fitur JavaScript dibatasi atau dihapus. JavaScript dengan sandbox didasarkan pada ECMAScript 5.1. Beberapa fitur ECMAScript 6 seperti fungsi panah dan deklarasi const/let tersedia.

Lingkungan eksekusi global

JavaScript dengan sandbox tidak dieksekusi di lingkungan eksekusi global standar seperti JavaScript normal, sehingga objek window dan propertinya tidak tersedia. Ketidaktersediaan ini mencakup metode yang ditentukan dalam cakupan global seperti encodeURI atau setTimeout, nilai global seperti location atau document, dan nilai global yang ditentukan oleh skrip yang dimuat. Sebagai penggantinya, fungsi require global tersedia untuk semua JavaScript dengan sandbox yang menyediakan banyak fungsi tersebut. Nilai dapat dibaca dari jendela dengan utilitas copyFromWindow.

Catatan: copyFromWindow membuat salinan nilai yang mendalam, sehingga bisa menjadi operasi yang mahal untuk meneruskan nilai tersebut ke dalam dan keluar dari sandbox.

Sistem jenis yang disederhanakan

JavaScript dengan sandbox mendukung jenis berikut: null, undefined, string, number, boolean, array, object, dan function. Array dan object dibuat menggunakan sintaksis literal ( [] {}), dan karena tidak ada akses ke lingkungan eksekusi global standar, konstruktor global seperti String() dan Number() tidak tersedia. Tidak ada kata kunci new di JavaScript dengan sandbox, dan fungsi tidak memiliki akses ke kata kunci this. Beberapa metode jenis native juga telah dihapus. Lihat library standar untuk mengetahui daftar lengkap tentang metode jenis native yang didukung.

Format kode template kustom

Kode yang ditulis untuk menerapkan template kustom mewakili isi fungsi yang akan dieksekusi setiap kali tag Anda diaktifkan atau variabel dievaluasi. Fungsi ini memiliki parameter data tunggal (data) yang menyimpan semua nilai yang dikonfigurasi di UI untuk tag atau instance variabel tersebut, dengan kunci yang ditetapkan ke nama parameter template yang ditentukan dalam template kustom.

Contoh penerapan tag beacon

const sendPixel = require('sendPixel');
const encodeUri = require('encodeUri');
const encodeUriComponent = require('encodeUriComponent');

let url = encodeUri(data['url']);

if (data['useCacheBuster']) {
  const encode = require('encodeUriComponent');
  const cacheBusterQueryParam = data['cacheBusterQueryParam'] || 'gtmcb';
  const last = url.charAt(url.length - 1);
  let delimiter = '&';
  if (url.indexOf('?') < 0) {
    delimiter = '?';
  } else if (last == '?' || last == '&') {
    delimiter = '';
  }
  url += delimiter +
      encodeUriComponent(cacheBusterQueryParam) + '=' + encodeUriComponent(data['randomNumber']);
}
sendPixel(url, data['gtmOnSuccess'], data['gtmOnFailure']);