Блог

Главная - Вопросы по программированию - Проверить chrome.storage расширения в devtools

Проверить chrome.storage расширения в devtools

#google-chrome #google-chrome-extension #local-storage #google-chrome-devtools

#javascript #google-chrome-расширение #google-chrome-хранилище

Вопрос:

В Chrome DevTools есть удобный инспектор для локального хранилища и хранения сеансов, но неужели нечего проверять chrome.storage.sync?

введите описание изображения здесь

chrome://sync-internals/ похоже, что не отображается фактическое содержимое синхронизированного хранилища для каждого расширения.

Ответ №1:

Расширение Storage Area Explorer предоставляет пользовательский интерфейс для просмотра, редактирования, очистки, импорта и экспорта chrome.storage.local , chrome.storage.sync localStorage и sessionStorage .

В будущем эта функция может быть реализована изначально: https://crbug.com/848752.

Предупреждение для ManifestV3: поскольку devtools для service worker не показывает хранилище, вам придется открыть любую видимую страницу вашего расширения, например всплывающее окно или параметры, щелкнуть правой кнопкой мыши страницу, затем нажать «проверить», затем перейти в Storage Explorer. Если в вашем расширении нет видимых страниц, вы можете открыть, chrome-extension://ID/manifest.json где ID — это идентификатор расширения, как показано на странице chrome://extensions. Другой метод заключается в том, чтобы щелкнуть правой кнопкой мыши любой скрипт из вашего расширения в devtools (при проверке скрипта содержимого или service worker), затем нажать «Открыть на новой вкладке». Вы можете добавить закладку для этой вкладки, чтобы быстро открыть ее в следующий раз.

скриншот

Комментарии:

1. У меня не работает. В моем случае я вижу только window.sessionStorage и window. localStorage. Но я хотел, чтобы мои данные chrome.storage.sync. Я также не смог найти никаких вариантов для его добавления.

2. Он показывает данные для текущего источника URL, поэтому вам нужно использовать их в devtools страницы расширения.

3. Могу я спросить, что вы подразумеваете под «страницей расширения»? Когда я нажимаю на синий «service worker» в «chrome: // extensions /», а затем выбираю вкладку «Storage Explorer», он говорит, что он отключен на обычных страницах или расширениях без разрешения хранилища (в то время как у моего есть разрешение хранилища). Или, может быть, вы имеете в виду devtools, которые я получаю из всплывающего окна? Это работает , но все равно, как только открывается новая вкладка, оно исчезает, потому что всплывающее окно автоматически закрывается при открытии новой вкладки. Я надеюсь, вы понимаете, что я имею в виду (?). Итак, упомянутая вами «страница расширения» — это что-то другое и, надеюсь, более удобное?

4. Service worker — это не страница. Я имею в виду любую видимую страницу расширения. Если в нем его нет, вы можете открыть chrome-extension://ID/manifest.json, где ID — это идентификатор расширения.

5. Смотрите developer.chrome.com/docs/extensions/mv3/…

Ответ №2:

  1. Посетить chrome://sync-internals/
  2. Нажмите Sync Node Browser вкладку и дождитесь ее загрузки (может появиться пустой экран или курсор в процессе)
  3. Щелкните треугольник расширения на боковой панели для Extension settings
  4. Нажмите на отдельные настройки на боковой панели, чтобы увидеть их значения и другие метаданные

скриншот внутренней страницы синхронизации

Комментарии:

1. спасибо! но почему я не вижу там расширение с локального диска? ( расширения в стадии разработки)

2. Это сработало для меня, поэтому я проголосовал за. Однако я наполовину ожидал, что содержимое будет сгруппировано по имени расширения Chrome или чему-то еще; вместо этого это было просто имя ключа.

3. Что эквивалентно FireFox? Это невозможно в FireFox?

Ответ №3:

Плохим решением является вызов get и получение всех сохраненных значений. Конечно, это не позволяет вам удобно редактировать их:

 chrome.storage.sync.get(null, function callback(items) { console.log(items) });

Для ManifestV3 в современном Chrome:

 await chrome.storage.session.get()