Ответ 1

Все зависит от того, что будет делать расширение Chrome. window.localStorage - это хранилище HTML5. Если вы не запустили его на фоновом режиме, он может позволить вам получать и устанавливать данные в хранилище для определенного домена. Это также верно для кода, введенного в DOM, поскольку он будет использовать localStorage на веб-странице.

Другими словами, вы не сможете обмениваться данными на разных веб-страницах, если вы не используете localStorage на фоновой странице, которая работает независимо от веб-страниц, поскольку в ней есть chrome://URI в качестве своего домена.

chrome.storage.local, с другой стороны, предназначен для Chrome Extensions и Chrome Apps для хранения данных в более центральном месте. Так как это недоступно для обычных веб-страниц, каждое расширение получает свое собственное хранилище. Одна из возможностей заключается в том, чтобы ваша фоновая страница справлялась с настройкой и получением данных, в то время как ваши сценарии контента касаются изменения и взаимодействия с веб-страницей.

Однако эти API работают и в сценариях контента, и оба расширения, которые я написал, используют chrome.storage.local, вызванный из сценариев содержимого.

В качестве примера я создал приложение Stack, которое сохраняет входящие элементы в Stack Exchange, пока вы их не прочитали, называемый StackInbox. Поскольку сайты Stack Exchange охватывают сотни доменов, я выбрал chrome.storage.local, потому что я мог бы сохранить учетную запись пользователя и повторно использовать ее на всех сайтах, гарантируя синхронизацию данных входящих сообщений, а также используя это непосредственно в контенте script.

В качестве простого теста поместите некоторые данные в localStorage в один домен, в контент script и попытайтесь вытащить его из другого, и вы увидите, что данных там не будет. С chrome.storage.local это не проблема.

Наконец, Chrome Extensions и Chrome Apps включены в белый список, поскольку пользователь решил установить его, поэтому они обычно могут делать больше, чем обычный веб-сайт. Например, указав разрешение "unlimitedStorage" в вашем манифесте, вы можете хранить данные значительно выше предела 5 МБ, размещенного на локальном хранилище HTML5.

Для получения дополнительной информации см. документация Google в Chrome Storage.

Ответ 2

localStorage

Плюсы:

• Синхронный и, следовательно, легче работать с: var value = localStorage[key]
• Имеет поддержку в Dev Tools: Resources> Local Storage для просмотра и изменения.

Минусы:

• JSON.stringify только строки, поэтому вам нужно сериализовать данные самостоятельно, то есть с помощью JSON.stringify
• Недоступен из сценариев контента (точнее, контекстные скрипты совместно используют его со страницей, а не с расширением), поэтому вам нужно полагаться на Messaging для передачи им значений.
• Синхронный И используется совместно с одновременно выполняющимися страницами расширения, что приводит к возможным проблемам синхронизации.

chrome.storage.local

Плюсы:

• Автоматически сериализует данные, совместимые с JSON, может хранить нестрочные строки без дополнительного шаблона.
• Полностью доступен в сценариях контента.
• Поддерживает события, которые уведомляют об изменениях: chrome.storage.onChanged
• С разрешением "unlimitedStorage" можно хранить произвольно большие объемы данных.

• Имеет хороший встроенный механизм для значений по умолчанию:

  chrome.storage.local.get({key: defaultValue}, function(value){/*...*/});
  

• Полностью поддерживается в Firefox WebExtensions и Edge Extensions.

Минусы:

• Асинхронный, поэтому немного сложнее работать с:

  chrome.storage.local.get("key", function(value){/* Continue here */});
  

• Не визуализируется в Dev Tools; нужно вызвать chrome.storage.local.get(null) чтобы получить все значения или использовать что-то вроде проводника области хранения.

chrome.storage.sync

То же, что и выше, но:

Плюсы:

• Автоматическая синхронизация между включенными экземплярами Chrome, если включена синхронизация расширений.

Минусы:

• Негибкие квоты на размер данных и частоту обновления.

• По состоянию на 2016-11-06, еще не поддерживается ни в Firefox WebExtensions или Edge Extensions, поэтому они не переносятся.

  Примечание: storage.sync теперь совместим с FF WebExtension, хотя невозможно установить синхронизацию Chrome и FF между собой.