Як я можу зберігати інформацію локально у своєму розширенні chrome?


81

Я хочу, щоб моє розширення chrome зберегло деяку інформацію, і я не знаю, як запустити код ... Це потрібно для збереження рядків. Наприклад - користувач вводить рядок (у текстовій області над спливаючим вікном), і цей рядок відображається у спливаючому вікні Коли користувач виходить із нього і повертається, я хочу, щоб рядок залишився незмінним. (Я вважаю, що він повинен це зберегти) Я не хочу зберігати його на своєму сервері або щось подібне, я хочу, щоб це зберігалося в кеші користувачів чи щось інше.


Коли користувач виходить, ви маєте на увазі закриття цього спливаючого вікна або закриття браузера?
serg

Це насправді має значення? Це має працювати, коли він закриває браузер.
Аріель

Гаразд, тоді localStorege - це відповідь (інакше ви можете просто зберігати значення на фоновій сторінці)
serg

Якщо вміст, який ви намагаєтеся зберегти, походить із форми (наприклад, опцій ), я пропоную webext-options-sync . Він заснований на, chrome.storage.syncале також дбає про автоматичне збереження та автоматичне відновлення форми.
fregante

Відповіді:


130

Тепер ви також можете використовувати storageAPI Google Chrome для цього. На відміну від localStorageцього, це доступно також із сценаріїв вмісту.

//  Somewhere in your manifest...

{
    "permissions": [
        "storage"
    ]
}

//  Usage:

//  PERSISTENT Storage - Globally
//  Save data to storage across their browsers...

chrome.storage.sync.set({ "yourBody": "myBody" }, function(){
    //  A data saved callback omg so fancy
});

chrome.storage.sync.get(/* String or Array */["yourBody"], function(items){
    //  items = [ { "yourBody": "myBody" } ]
});

//  LOCAL Storage

// Save data to storage locally, in just this browser...

chrome.storage.local.set({ "phasersTo": "awesome" }, function(){
    //  Data's been saved boys and girls, go on home
});

chrome.storage.local.get(/* String or Array */["phasersTo"], function(items){
    //  items = [ { "phasersTo": "awesome" } ]
});

Більше інформації про те, як працюють ці шахраї, тут: https://developer.chrome.com/extensions/storage#type-StorageArea

Колишня відповідь:

Використовуйте localStorage . Google Chrome реалізує деякі функції HTML5, і це одна з них.

//Pull text from user inputbox
var data = document.getElementById("this_input").value;
//Save it to the localStorage variable which will always remember what you store in it
localStorage["inputText"] = data; 

Зверніть увагу, що ви можете отримати доступ до свого сховища лише з фонової сторінки (без сценаріїв вмісту), тому для цього доведеться використовувати обмін повідомленнями.


4
Дякую! Ще одне - де це збережено? (Де я можу знайти ці файли місцевого зберігання, в основному)
Аріель

Нема проблем. :) Хм ... я не впевнений. Це те, про що вам доведеться запитати, якщо воно існує. До речі, перевірте мою відповідь, якщо я допоміг.
mattsven

1
@BeauCielBleu Ви маєте рацію, дякую. Оновлено. Перевір це?
mattsven

@mattsven Так. І дякую за пояснення синхронізації / локальної різниці;)
BeauCielBleu

1
@mattsven Можливо, це дурне запитання, але як мені витягнути предмет із зворотного виклику? Я намагаюся повернути змінну звідти або встановити глобальну змінну, і вона не працює.
Правда

2

Зараз існує конкретний API, перевірте це тут: https://developer.chrome.com/extensions/storage

Зверніть увагу, що він доступний лише на вашій фоновій сторінці і працює в ізольованому світі (ви не отримуєте доступ до значень, що містяться в HTML5 localStorage веб-сайту).


7
Це дуже заплутане формулювання. Однією з головних переваг є те, що він РОБОТІ працює у сценаріях вмісту без додаткових зусиль, як обмін повідомленнями.
Xan
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.