JavaScript hộp cát

JavaScript hộp cát là một tập hợp con ngôn ngữ JavaScript đơn giản cung cấp một cách an toàn để thực thi logic JavaScript tuỳ ý từ Thẻ Google Mẫu tuỳ chỉnh của người quản lý. Để cung cấp môi trường thực thi an toàn, một số các tính năng của JavaScript bị hạn chế hoặc bị xoá. JavaScript hộp cát dựa trên trên ECMAScript 5.1. Một số tính năng của ECMAScript 6 như hàm mũi tên và Có const/let bản khai báo.

Môi trường thực thi chung

JavaScript hộp cát không được thực thi trong phương thức thực thi chung chuẩn giống như JavaScript thông thường, vì vậy, đối tượng window và các thuộc tính của đối tượng đó không có. Điều này bao gồm các phương thức được xác định trong phạm vi toàn cầu như encodeURI hoặc setTimeout, các giá trị chung như location hoặc document, và các giá trị chung được xác định bởi các tập lệnh đã tải. Thay vào đó, require toàn cục có sẵn cho tất cả JavaScript dạng hộp cát cung cấp nhiều . Bạn có thể đọc các giá trị từ cửa sổ này bằng Tiện ích copyFromWindow.

Hệ thống kiểu được đơn giản hoá

JavaScript hộp cát hỗ trợ các loại sau: null, undefined, string, number, boolean, array, object và function. Mảng và các đối tượng được tạo bằng cú pháp cố định ( [] {} ) và vì không có quyền truy cập vào môi trường thực thi toàn cục chuẩn, các hàm dựng toàn cục như Không mua được String() và Number(). Không có từ khoá new nào trong JavaScript hộp cát và các hàm không có quyền truy cập vào từ khoá this. Một số phương thức kiểu gốc cũng đã bị xoá. Hãy xem thư viện chuẩn để biết danh sách đầy đủ các phương thức kiểu gốc được hỗ trợ.

Định dạng mã mẫu tuỳ chỉnh

Mã được viết để triển khai mẫu tuỳ chỉnh đại diện cho phần nội dung của sẽ được thực thi bất cứ khi nào thẻ của bạn được kích hoạt hoặc biến của bạn là đánh giá. Hàm này có một tham số dữ liệu duy nhất (data) chứa tất cả các giá trị được định cấu hình trong giao diện người dùng cho thẻ hoặc phiên bản biến đó, với các khoá được đặt vào tên của thông số mẫu được chỉ định trong mẫu tùy chỉnh.

Triển khai thẻ beacon mẫu

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']);