Lưu vào bộ nhớ đệm bằng Firebase

Mục tiêu: Tăng hiệu suất trang tổng quan và tránh giới hạn tốc độ API bên ngoài bằng cách triển khai bộ nhớ đệm tuỳ chỉnh cho trình kết nối của bạn.

Looker Studio có hệ thống lưu vào bộ nhớ đệm riêng cho báo cáo. Khi tạo trình kết nối, bạn có thể triển khai bộ nhớ đệm tuỳ chỉnh để tạo báo cáo nhanh hơn và tránh giới hạn về tốc độ APR.

Ví dụ: bạn đang tạo một trình kết nối cung cấp dữ liệu thời tiết trước đây trong 7 ngày qua cho một mã bưu chính cụ thể. Trình kết nối của bạn đang trở nên khá phổ biến nhưng API bên ngoài mà bạn đang tìm nạp dữ liệu có giới hạn nghiêm ngặt về tốc độ. API này chỉ cập nhật dữ liệu hằng ngày, vì vậy, đối với một mã bưu chính cụ thể, bạn không cần tìm nạp cùng một dữ liệu nhiều lần trong một ngày. Khi sử dụng hướng dẫn về giải pháp này, bạn có thể triển khai bộ nhớ đệm hằng ngày cho từng mã bưu chính.

Yêu cầu

• Một Cơ sở dữ liệu theo thời gian thực của Firebase. Nếu bạn không có quyền truy cập vào một dự án, hãy tạo một dự án Google Cloud Platform (GCP) rồi làm theo hướng dẫn Bắt đầu để tạo phiên bản Cơ sở dữ liệu theo thời gian thực Firebase của riêng bạn.
• Một tài khoản dịch vụ GCP để đọc và ghi dữ liệu từ Cơ sở dữ liệu thời gian thực của Firebase.
• Một Trình kết nối cộng đồng lấy dữ liệu từ một nguồn.

Các điểm hạn chế

• Bạn không thể sử dụng giải pháp này với Dịch vụ nâng cao của Looker Studio. Khi bạn sử dụng Dịch vụ nâng cao của Looker Studio, mã trình kết nối của bạn trong Apps Script sẽ không có quyền truy cập vào dữ liệu. Do đó, bạn không thể lưu dữ liệu vào bộ nhớ đệm bằng Apps Script.
• Người chỉnh sửa và người xem báo cáo không thể đặt lại bộ nhớ đệm cụ thể này.

Giải pháp

Triển khai tài khoản dịch vụ

1. Tạo một tài khoản dịch vụ trong dự án Google Cloud của bạn.
2. Đảm bảo tài khoản dịch vụ này có quyền truy cập vào BigQuery trong dự án trên đám mây.
   • Các vai trò Quản lý danh tính và quyền truy cập (IAM) bắt buộc: Firebase Admin
3. Tải tệp JSON xuống để lấy khoá tài khoản dịch vụ. Lưu trữ nội dung của tệp trong thuộc tính tập lệnh của dự án trình kết nối. Sau khi thêm các khoá, giao diện người dùng của Apps Script sẽ có dạng như sau:
   
4. Đưa thư viện OAuth2 cho Apps Script vào dự án Apps Script của bạn.
5. Triển khai mã OAuth2 bắt buộc cho tài khoản dịch vụ:

firestore-cache/src/firebase.js

Xem trên GitHub

var SERVICE_ACCOUNT_CREDS = 'SERVICE_ACCOUNT_CREDS';
var SERVICE_ACCOUNT_KEY = 'private_key';
var SERVICE_ACCOUNT_EMAIL = 'client_email';
var BILLING_PROJECT_ID = 'project_id';

var scriptProperties = PropertiesService.getScriptProperties();

/**
 * Copy the entire credentials JSON file from creating a service account in GCP.
 * Service account should have `Firebase Admin` IAM role.
 */
function getServiceAccountCreds() {
  return JSON.parse(scriptProperties.getProperty(SERVICE_ACCOUNT_CREDS));
}

function getOauthService() {
  var serviceAccountCreds = getServiceAccountCreds();
  var serviceAccountKey = serviceAccountCreds[SERVICE_ACCOUNT_KEY];
  var serviceAccountEmail = serviceAccountCreds[SERVICE_ACCOUNT_EMAIL];

  return OAuth2.createService('FirebaseCache')
    .setAuthorizationBaseUrl('https://accounts.google.com/o/oauth2/auth')
    .setTokenUrl('https://accounts.google.com/o/oauth2/token')
    .setPrivateKey(serviceAccountKey)
    .setIssuer(serviceAccountEmail)
    .setPropertyStore(scriptProperties)
    .setCache(CacheService.getScriptCache())
    .setScope([
      'https://www.googleapis.com/auth/userinfo.email',
      'https://www.googleapis.com/auth/firebase.database'
    ]);
}

Triển khai mã để đọc và ghi từ Firebase

Bạn sẽ sử dụng Firebase Database REST API để đọc và ghi vào Cơ sở dữ liệu theo thời gian thực của Firebase. Đoạn mã sau đây triển khai các phương thức cần thiết để truy cập vào API này.

Triển khai getData()

Cấu trúc cho mã getData() hiện có của bạn mà không có tính năng lưu vào bộ nhớ đệm sẽ có dạng như sau:

firestore-cache/src/without-caching.js

Xem trên GitHub

/*
 * This file is only to demonstrate how the `getData()` fucntion would look
 * like without the Firebase Realtime Database caching. It is not a part of
 * the connector code and should not be included in Apps Script / Clasp.
 */

function getData(request) {
  var requestedFields = getFields().forIds(
    request.fields.map(function(field) {
      return field.name;
    })
  );

  var fetchedData = fetchAndParseData(request);
  var data = getFormattedData(fetchedData, requestedFields);

  return {
    schema: requestedFields.build(),
    rows: data
  };
}

Để sử dụng tính năng lưu vào bộ nhớ đệm trong mã getData(), hãy làm theo các bước sau:

1. Xác định "khối" hoặc "đơn vị" dữ liệu cần được lưu vào bộ nhớ đệm.

2. Tạo một khoá duy nhất để lưu trữ đơn vị dữ liệu tối thiểu trong bộ nhớ đệm.
   Đối với ví dụ về cách triển khai, zipcode từ configparams đang được dùng làm khoá.
   Không bắt buộc: Đối với bộ nhớ đệm cho mỗi người dùng, hãy tạo một khoá kết hợp bằng khoá cơ sở và danh tính người dùng. Ví dụ về cách triển khai:
   js var baseKey = getBaseKey(request); var userEmail = Session.getEffectiveUser().getEmail(); var hasheduserEmail = getHashedValue(userEmail); var compositeKey = baseKey + hasheduserEmail;

3. Nếu có dữ liệu được lưu vào bộ nhớ đệm, hãy kiểm tra xem bộ nhớ đệm có mới hay không.
   Trong ví dụ này, dữ liệu được lưu vào bộ nhớ đệm cho một mã bưu chính cụ thể sẽ được lưu cùng với ngày hiện tại. Khi dữ liệu được truy xuất từ bộ nhớ đệm, ngày của bộ nhớ đệm sẽ được kiểm tra dựa trên ngày hiện tại.

   var cacheForZipcode = {
     data: <data being cached>,
     ymd: <current date in YYYYMMDD format>
   }
   

4. Nếu dữ liệu được lưu vào bộ nhớ đệm không tồn tại hoặc dữ liệu được lưu vào bộ nhớ đệm không mới, hãy tìm nạp dữ liệu từ nguồn và lưu trữ dữ liệu đó trong bộ nhớ đệm.

Trong ví dụ sau, main.js bao gồm mã getData() có bộ nhớ đệm được triển khai.

Mã mẫu

Sau đây là ví dụ đầy đủ về một trình kết nối sử dụng FireBase để lưu vào bộ nhớ đệm:

main.js

firestore-cache/src/main.js

Xem trên GitHub

// [start common_connector_code]
var cc = DataStudioApp.createCommunityConnector();

function getAuthType() {
  return cc
    .newAuthTypeResponse()
    .setAuthType(cc.AuthType.NONE)
    .build();
}

function getConfig(request) {
  var config = cc.getConfig();

  config
    .newTextInput()
    .setId('zipcode')
    .setName('Enter Zip Code')
    .setPlaceholder('eg. 95054');

  return config.build();
}

function getFields() {
  var fields = cc.getFields();
  var types = cc.FieldType;
  var aggregations = cc.AggregationType;

  fields
    .newDimension()
    .setId('zipcode')
    .setName('Zip code')
    .setType(types.TEXT);

  fields
    .newDimension()
    .setId('date')
    .setName('Date')
    .setType(types.YEAR_MONTH_DAY);

  fields
    .newMetric()
    .setId('temperature')
    .setName('Temperature (F)')
    .setType(types.NUMBER)
    .setIsReaggregatable(false);

  return fields;
}

function getSchema(request) {
  return {
    schema: getFields().build()
  };
}
// [end common_connector_code]

// [start caching_implementation]
function getData(request) {
  var requestedFields = getFields().forIds(
    request.fields.map(function(field) {
      return field.name;
    })
  );

  var cacheUpdateNeeded = true;
  var url = buildFirebaseUrl(request.configParams.zipcode);
  var cache = firebaseCache('get', url);

  if (cache) {
    var currentYmd = getCurrentYmd();
    cacheUpdateNeeded = currentYmd > cache.ymd;
  }

  if (cacheUpdateNeeded) {
    var fetchedData = fetchAndParseData(request);
    cache = {};
    cache.data = fetchedData;
    cache.ymd = currentYmd;
    firebaseCache('delete', url);
    firebaseCache('post', url, cache);
  }

  var data = getFormattedData(cache.data, requestedFields);

  var requestedFields = getFields().forIds(
    request.fields.map(function(field) {
      return field.name;
    })
  );

  var cache = getCachedData(request);
  var data = getFormattedData(cache, requestedFields);

  return {
    schema: requestedFields.build(),
    rows: data
  };
}

function getCachedData(request) {
  var cacheUpdateNeeded = true;
  var url = buildFirebaseUrl(request.configParams.zipcode);
  var cachedData = getFromCache(url);
  var currentYmd = getCurrentYmd();

  if (cachedData) {
    cacheUpdateNeeded = currentYmd > cachedData.ymd;
  }

  if (cacheUpdateNeeded) {
    var fetchedData = fetchAndParseData(request);
    freshData = {};
    freshData.data = fetchedData;
    freshData.ymd = currentYmd;
    deleteFromCache(url);
    putInCache(url, freshData);
    cachedData = freshData;
  }

  return cachedData.data;
}

function getCurrentYmd() {
  var currentDate = new Date();
  var year = currentDate.getFullYear();
  var month = ('0' + (currentDate.getMonth() + 1)).slice(-2);
  var date = ('0' + currentDate.getDate()).slice(-2);
  var currentYmd = year + month + date;
  return currentYmd;
}

// [end caching_implementation]

// [start common_getdata_implementation]
function fetchAndParseData(request) {
  // TODO: Connect to your own API endpoint and parse the fetched data.
  // To keep this example simple, we are returning dummy data instead of
  // connecting to an enpoint. This does not affect the caching.
  var parsedData = sampleData;
  return parsedData;
}

function getFormattedData(fetchedData, requestedFields) {
  var data = fetchedData.map(function(rowData) {
    return formatData(rowData, requestedFields);
  });
  return data;
}

function formatData(rowData, requestedFields) {
  var row = requestedFields.asArray().map(function(requestedField) {
    switch (requestedField.getId()) {
      case 'date':
        return rowData.date;
      case 'zipcode':
        return rowData.zipcode;
      case 'temperature':
        return rowData.temperature;
      default:
        return '';
    }
  });
  return {values: row};
}
// [end common_getdata_implementation]

var sampleData = [
  {
    date: '20190601',
    zipcode: '95054',
    temperature: 80
  },
  {
    date: '20190602',
    zipcode: '95054',
    temperature: 82
  },
  {
    date: '20190603',
    zipcode: '95054',
    temperature: 82
  },
  {
    date: '20190604',
    zipcode: '95054',
    temperature: 85
  },
  {
    date: '20190605',
    zipcode: '95054',
    temperature: 84
  },
  {
    date: '20190606',
    zipcode: '95054',
    temperature: 83
  },
  {
    date: '20190607',
    zipcode: '95054',
    temperature: 81
  }
];

firebase.js

firestore-cache/src/firebase.js

Xem trên GitHub

// [start firebase_access_implementation]

var FIREBASE_REALTIME_DB_BASE_URL = '.firebaseio.com';
var FIREBASE_REALTIME_DB_COLLECTION = '/cache';

/**
 * Returns the URL for a file in a firebase database.
 *
 * @param {string} fileName The filename in the database
 * @returns {string} The url for the file in the database
 */
function buildFirebaseUrl(fileName) {
  var serviceAccountCreds = getServiceAccountCreds();
  var projectId = serviceAccountCreds[BILLING_PROJECT_ID];

  if (fileName) {
    fileName = '/' + fileName;
  }
  var urlElements = [
    'https://',
    projectId,
    FIREBASE_REALTIME_DB_BASE_URL,
    FIREBASE_REALTIME_DB_COLLECTION,
    fileName,
    '.json'
  ];
  var url = urlElements.join('');
  return url;
}

/**
 * Generic method for handling the Firebase Realtime Database REST API.
 * For `get`: returns the data at the given url.
 * For `post`: posts the data in in firestore db at the given url and returns `undefined`.
 * For `delete`: deletes the data at the given url and returns `undefined`.
 *
 * @param {string} method Method for the REST API: `get`, `post`, or `delete`
 * @param {string} url REST endpoint
 * @param {string} [data] Data to be stored for `post` method
 * @returns {undefined|object} Returns data from the REST endpoint for `get`
 *          method. For other methods, returns `undefined`.
 */
function firebaseCache(method, url, data) {
  var oAuthToken = getOauthService().getAccessToken();

  var responseOptions = {
    headers: {
      Authorization: 'Bearer ' + oAuthToken
    },
    method: method,
    contentType: 'application/json'
  };

  // Add payload for post method
  if (method === 'post') {
    responseOptions['payload'] = JSON.stringify(data);
  }

  var response = UrlFetchApp.fetch(url, responseOptions);

  // Return value only for `get`.
  if (method === 'get') {
    var responseObject = JSON.parse(response);
    if (responseObject === null) {
      return null;
    } else {
      var autoKey = Object.keys(responseObject)[0];
      var returnValue = responseObject[autoKey];
    }
    return returnValue;
  }
}

function getFromCache(url) {
  return firebaseCache('get', url);
}

function deleteFromCache(url) {
  return firebaseCache('delete', url);
}

function putInCache(url, data) {
  return firebaseCache('put', url, data);
}

// [end firebase_access_implementation]

var SERVICE_ACCOUNT_CREDS = 'SERVICE_ACCOUNT_CREDS';
var SERVICE_ACCOUNT_KEY = 'private_key';
var SERVICE_ACCOUNT_EMAIL = 'client_email';
var BILLING_PROJECT_ID = 'project_id';

var scriptProperties = PropertiesService.getScriptProperties();

/**
 * Copy the entire credentials JSON file from creating a service account in GCP.
 * Service account should have `Firebase Admin` IAM role.
 */
function getServiceAccountCreds() {
  return JSON.parse(scriptProperties.getProperty(SERVICE_ACCOUNT_CREDS));
}

function getOauthService() {
  var serviceAccountCreds = getServiceAccountCreds();
  var serviceAccountKey = serviceAccountCreds[SERVICE_ACCOUNT_KEY];
  var serviceAccountEmail = serviceAccountCreds[SERVICE_ACCOUNT_EMAIL];

  return OAuth2.createService('FirebaseCache')
    .setAuthorizationBaseUrl('https://accounts.google.com/o/oauth2/auth')
    .setTokenUrl('https://accounts.google.com/o/oauth2/token')
    .setPrivateKey(serviceAccountKey)
    .setIssuer(serviceAccountEmail)
    .setPropertyStore(scriptProperties)
    .setCache(CacheService.getScriptCache())
    .setScope([
      'https://www.googleapis.com/auth/userinfo.email',
      'https://www.googleapis.com/auth/firebase.database'
    ]);
}

Tài nguyên khác

Chrome UX Connector hỗ trợ một trang tổng quan dựa trên bảng BigQuery có dung lượng khoảng 20 GB cho hàng nghìn người dùng. Trình kết nối này sử dụng Cơ sở dữ liệu theo thời gian thực của Firebase cùng với Dịch vụ lưu vào bộ nhớ đệm của Apps Script cho phương pháp lưu vào bộ nhớ đệm hai lớp. Hãy xem mã để biết thông tin chi tiết về cách triển khai.