Firebase ile önbellek oluşturma

Amaç: Bağlayıcınız için özel bir önbellek uygulayarak kontrol paneli performansını artırın ve harici API hız sınırlarından kaçının.

Looker Studio'nun raporlar için kendi önbellek sistemi vardır. Bağlayıcınızı oluştururken daha hızlı raporlar oluşturmak ve APR hız sınırlamalarını önlemek için özel bir önbellek uygulayabilirsiniz.

Örneğin, belirli bir posta kodu için son 7 güne ait geçmiş hava durumu verilerini sağlayan bir bağlayıcı oluşturuyorsunuz. Bağlayıcınız oldukça popüler hale geliyor ancak verileri getirdiğiniz harici API'de katı hız sınırları var. API verilerini yalnızca günlük olarak güncellediğinden, belirli bir posta kodu için aynı verilerin gün içinde birden fazla kez getirilmesine gerek yoktur. Bu çözüm kılavuzunu kullanarak her posta kodu için günlük önbellek uygulayabilirsiniz.

Şartlar

• Firebase Realtime Database Erişiminiz yoksa Google Cloud Platform (GCP) projesi oluşturun ve kendi Firebase Realtime Database örneğinizi oluşturmak için Başlangıç kılavuzundaki adımları uygulayın.
• Firebase Realtime Database'den veri okumak ve veriye yazmak için bir GCP hizmet hesabı.
• Bir kaynaktan veri getiren Topluluk Bağlayıcısı.

Sınırlamalar

• Bu çözüm, Looker Studio Gelişmiş Hizmetleri ile kullanılamaz. Looker Studio Gelişmiş Hizmetleri'ni kullandığınızda Apps Script'teki bağlayıcı kodunuz verilere erişemez. Bu nedenle, Apps Komut Dosyası'nı kullanarak verileri önbelleğe alamazsınız.
• Rapor düzenleyiciler ve görüntüleyenler bu belirli önbelleği sıfırlayamaz.

Çözüm

Hizmet hesabı uygulama

1. Google Cloud projenizde bir hizmet hesabı oluşturun.
2. Bu hizmet hesabının, bulut projesinde BigQuery erişimine sahip olduğundan emin olun.
   • Gerekli Identity and Access Management (IAM) Rolleri: Firebase Admin
3. Hizmet hesabı anahtarlarını almak için JSON dosyasını indirin. Dosyanın içeriğini bağlayıcı projenizin komut dosyası özelliklerinde saklayın. Anahtarlar eklendikten sonra Apps Komut Dosyası kullanıcı arayüzünde şu şekilde görünmelidir:
   
4. Apps Komut Dosyası projenize Apps Komut Dosyası için OAuth2 kitaplığını ekleyin.
5. Hizmet hesabı için gerekli OAuth2 kodunu uygulayın:

firestore-cache/src/firebase.js

GitHub'da göster

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

Firebase'den okuma ve yazma için kod uygulama

Firebase Realtime Database'e okuma ve yazma işlemleri yapmak için Firebase Database REST API'yi kullanacaksınız. Aşağıdaki kod, bu API'ye erişmek için gereken yöntemleri uygular.

getData() işlevini uygulama

Önbelleğe alma olmadan mevcut getData() kodunuzun yapısı şu şekilde görünmelidir:

firestore-cache/src/without-caching.js

GitHub'da göster

/*
 * 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
  };
}

getData() kodunuzda önbelleğe almayı kullanmak için aşağıdaki adımları uygulayın:

1. Önbelleğe alınması gereken veri "parçasını" veya "birimini" belirleyin.

2. Önbellekteki minimum veri birimini depolamak için benzersiz bir anahtar oluşturun.
   Örnek uygulamada anahtar olarak zipcode configparams kullanılıyor.
   İsteğe bağlı: Kullanıcı başına önbellek için temel anahtarla ve kullanıcı kimliğiyle birleşik anahtar oluşturun. Örnek uygulama:
   js var baseKey = getBaseKey(request); var userEmail = Session.getEffectiveUser().getEmail(); var hasheduserEmail = getHashedValue(userEmail); var compositeKey = baseKey + hasheduserEmail;

3. Önbelleğe alınan veriler varsa önbelleğin güncel olup olmadığını kontrol edin.
   Örnekte, belirli bir posta koduna ait önbelleğe alınmış veriler geçerli tarihle kaydedilir. Veriler önbellekten alındığında, önbelleğin tarihi geçerli tarihle karşılaştırılır.

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

4. Önbelleğe alınmış veri yoksa veya önbelleğe alınmış veri güncel değilse verileri kaynaktan getirin ve önbellekte depolayın.

Aşağıdaki örnekte, main.js, önbelleğe alma işleminin uygulandığı getData() kodunu içerir.

Örnek kod

Aşağıda, önbelleğe alma için Firebase'i kullanan bir bağlayıcıya ilişkin eksiksiz bir örnek verilmiştir:

main.js

firestore-cache/src/main.js

GitHub'da göster

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

GitHub'da göster

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

Ek kaynaklar

Chrome UX Connector, yaklaşık 20 GB'lık bir BigQuery tablosuna dayalı bir kontrol panelini binlerce kullanıcıya sunar. Bu bağlayıcı, iki katmanlı bir önbelleğe alma yaklaşımı için Apps Komut Dosyası Önbellek Hizmeti ile birlikte Firebase Realtime Database'i kullanır. Uygulama ayrıntıları için koda bakın.