LocalStorage nasıl görüntülenir veya düzenlenir

259

Bir Chrome uzantısı oluşturdum ve veri depolamak için localStorage kullanıyorum.

"Background_page" üzerinden localStorage'a erişiyorum.

İyi çalışıyor, ancak değerlerini manuel olarak nasıl görüntüleyebilirim? Firefox'ta Firebug'u kullanabilirsiniz.

Herhangi birinin önerisi varmı?

google-chrome local-storage

— Joe Doe
kaynak

270

Basit. Düğmesine basarak geliştirici araçlarına F12gitmeniz ve ardından Uygulama sekmesine gitmeniz yeterlidir. In Depolama bölümündeki genişletmek Yerel Depolama . Bundan sonra, tarayıcınızın tüm yerel depolama alanını orada görürsünüz.

— Giorgi Gzirishvili
kaynak

33

Chrome 60 sürümünde yeni öğeleri değiştiremez veya ekleyemezsiniz, bunu konsoldan yapmanız gerekir velocalStorage.setItem('key', 'value')

— Jim Aho

9

Chrome sürüm 65'te yeni öğeleri manuel olarak değiştirebilir ve ekleyebilirsiniz. Yeni bir değer eklemek için Uygulama> Yerel Depolama'daki anahtar / değer çifti listesindeki son anahtar / değer çiftinin altına çift tıklayın.

— Rose Perrone

169

Düğmesine basarak Geliştirici Araçlarını açmanız yeterlidir F12.

Tıklayın Uygulama (eski Kaynaklar) sekmesini ve localStorage içeriğini göreceksiniz. Buradan anahtar / değer girişlerini manuel olarak ekleyebilir / düzenleyebilir / silebilirsiniz.

localStorage kaynakları sekmesi

OS X'te tuşlar: ⌥+ ⌘+i

Başka bir kombinasyon: Ctrl+ Shift+i

EDIT: Chrome 56'da şöyle görünür:

resim açıklamasını buraya girin

— Simone
kaynak

4

Evet zaten denedi ama localStorage boş. Belki açılmamış uzantı yüklediğim için?

— Joe Doe

Bu size yardımcı olabilir: stackoverflow.com/questions/3598669/…

— Simone

3

Simone, JS ile localStorage'ı nasıl ayarlayacağımı ve okuyacağımı biliyorum, ancak manuel olarak düzenlemem / silmem gerekiyor

— Joe Doe

JS ile yapmanıza gerek yok, kullanıcı arayüzünden giriş eklemek / düzenlemek / silmek mümkündür

— Simone

17

Şu anda krom Sürüm 52.0.2743.82 m kullanıyorum. Chrome'un şu anki en son sürümünde, "Geliştirici Araçları" nı başlatıp "Uygulama" sekmesine bakarak yerel depolama değerlerini görebilirsiniz.

— Luke P. Issac
kaynak

15

Chrome: // chrome / extensions adresine gidebilirsiniz ve arka plan sayfanızın başlattıktan sonra localStorage öğelerini görmek için Geliştirme Araçları'nı kullanabileceğiniz bir bağlantı olacaktır.

— Ryan S
kaynak

@Ryan S cevap için teşekkürler ama localStorage boş Ben böyle ayarladımlocalStorage['xy'] = JSON.stringify(xy);

— Joe Doe

2

Chrome konsolunda şunları yapabilirsiniz localStorage.setItem('xy', JSON.stringify(xy))ve bu, öğeyi localStorage'da ayarlayacaktır

— Ryan S

2

chrome: // chrome-urls /, ardından yerel depolama birimini yapın

— khaled_webdev

2

Ya buradaki insanların ne yapmaya çalıştığını anlamıyorum ve yaptığım şey bu değil ve / veya Chrome geliştirici araçları değişti ve bu bağlamda kırıldı.

Uzantımın içerik komut dosyası aşağıdaki gibi verileri depolar:

chrome.storage.local.set(packet);

Uzantının arka plan sayfasının Uygulama sekmesini görüntülediğimde ve Depolama> Yerel Depolama'yı genişlettiğimde, uzantımı listede görüyorum, ancak tıklandığında veri gösterilmiyor.

Bulduğum tek çözüm bunu arka plan sayfasının konsolunda çalıştırmaktır:

chrome.storage.local.get(null, function(data) {console.log(data);})

Bu, uzantıyı nasıl okuduğuna benzer (yalnızca istediğim adı almak için bir anahtar adı yerine tüm anahtarları almak için null iletmek dışında) ve iyi çalışır, her seferinde yazmak gariptir. Benim için işe yaramayan tüm bu cevapların olması da garip.

Windows 10'da Chrome 73.0.3683.103 (Resmi Derleme) (64 bit) kullanıyorum. Uzantı, ilgilise hala açılmış, ancak bu, geliştirme aşamasında bunu yapmak isteyebileceğiniz en olası zamandır.

— enigment
kaynak