Chrome Extension 開發經驗篇 19 - 如何同步 Extension 的選項設定？

之前有介紹選項頁面，該頁面會提供使用者設定個人化的選項(如：外觀樣式)，那麼要如何讓這些設定自動同步呢？

同步方法

Step 1. 在 manifest.json 設定檔中取得 storage 權限。如下所示。

manifest.json

{
  ...
  "permissions": [
    "storage"
  ],
  ...
}

Step 2. 使用 chrome.storage.sync APIs。如下所示。

chrome.storage.sync.set

// set object
chrome.storage.sync.set({
  'options1': {
    'language': 'english',
    'autoRun': false,
    'delayTime': 3000
  },
  'options2': function (params) {console.log(params);}
}, function () {
  // callback
});

說明：options2 的值原本為 function，將會被序列化為 {}。

chrome.storage.sync.get

// get all
chrome.storage.sync.get(function (obj) {
  // callback
  console.log(obj);
});

// get by string
chrome.storage.sync.get('options1', function (obj) {
  // callback
  console.log(obj);
});

// get by array of string
chrome.storage.sync.get(['options1', 'options2'], function (obj) {
  // callback
  console.log(obj);
});

// get by object
chrome.storage.sync.get({'options1': null}, function (obj) {
  // callback
  console.log(obj);
});

chrome.storage.sync.remove

// remove by string
chrome.storage.sync.remove('options1', function () {
  // callback
});

// remove by array of string
chrome.storage.sync.remove(['options1', 'options2'], function () {
  // callback
});

chrome.storage.sync.clear

// clear all
chrome.storage.sync.clear(function () {
  // callback
});

同步的限制

QUOTA_BYTES (102,400) - 可以在同步儲存區儲存的資料量大小 (以 bytes 為單位)
QUOTA_BYTES_PER_ITEM (8,192) - 同步儲存區中每個項目的大小 (以 bytes 為單位)
MAX_ITEMS (512) - 可以在同步儲存區儲存的項目數量
MAX_WRITE_OPERATIONS_PER_HOUR (1,000) - 一小時內可進行的操作次數 (set, remove, clear)
MAX_SUSTAINED_WRITE_OPERATIONS_PER_MINUTE (10) - 在連續的十分鐘內，每分鐘可進行的操作次數 (set, remove, clear)

(不知道是不是我理解錯誤，我一直覺得這裡的限制有點怪。每分鐘 10 次，十分鐘就 100 次，那一小時也才 600 次，怎麼也不會超過 1,000 次啊！)

討論

之前在實作選項設定同步時，因為有操作次數的限制，所以寫了一個半同步的方法，儲存區以 local 為主，在定期去更新 sync。不過會遇到一種情況，假如一個 Google 帳號不只一人使用，那兩個人同時設定選項時，該選擇誰的設定？ 這裡我還沒有想到比較好的做法，所以就不提供程式碼了。

結語：

同步儲存區確實好用，但一不小心沒寫好，反而會亂了選項設定值。如果您有問題，歡迎在下方留言。謝謝！