IndexedDB verilerini görüntüleme ve değiştirme

Kayce Basques

Bu kılavuzda, IndexedDB verilerini görüntülemek ve değiştirmek için Chrome Geliştirici Araçları'nın nasıl kullanılacağı gösterilmektedir. Geliştirici Araçları'na aşina olduğunuz varsayılır. Değilse Başlayın başlıklı makaleyi inceleyin. Ayrıca IndexedDB hakkında bilgi sahibi olduğunuz varsayılır. Aksi takdirde IndexedDB'yi kullanma bölümüne bakın.

IndexedDB verilerini göster

1. Application (Uygulama) panelini açmak için Application (Uygulama) sekmesini tıklayın. Hangi veritabanlarının kullanılabilir olduğunu görmek için IndexedDB menüsünü genişletin.

   

   Şekil 1. IndexedDB menüsü

   • notes - https://mdn.github.io, bir veritabanını temsil eder. Burada notes, veritabanının adıdır ve https://mdn.github.io, veritabanına erişebilen kaynaktır.
   • notları bir nesne deposudur.
   • title ve body dizinlerdir.

1. Kaynak ve sürüm numarasını görmek için bir veritabanını tıklayın.

   

   2. Şekil. notes veritabanı

2. Anahtar/değer çiftlerini görmek için bir nesne deposunu tıklayın.

   

   3. Şekil. notes nesne deposu

   • Toplam giriş sayısı, nesne deposundaki anahtar/değer çiftlerinin toplam sayısıdır.
   • Bir sonraki kullanılabilir anahtar Anahtar oluşturucu değeri'dir. Bu alan yalnızca anahtar oluşturucu kullanılırken gösterilir.

3. Değer sütunundaki bir hücreyi tıklayarak ilgili değeri genişletin.

   

   4. Şekil. IndexedDB değerini görüntüleme

4. Nesne deposunu söz konusu dizinin değerlerine göre sıralamak için aşağıdaki Şekil 6'da başlık veya gövde gibi bir dizini tıklayın.

   

   5. Şekil. title anahtarına göre alfabetik olarak sıralanan nesne deposu

IndexedDB verilerini yenile

Uygulama panelindeki IndexedDB değerleri gerçek zamanlı olarak güncellenmez. Bir nesne deposunu görüntülerken verilerini yenilemek için Yenile'yi tıklayın veya bir veritabanını görüntüleyip tüm verileri yenilemek için Veritabanını yenile'yi tıklayın.

6. Şekil. Veritabanını görüntüleme

IndexedDB verilerini düzenle

IndexedDB anahtarları ve değerleri Uygulama panelinden düzenlenemez. Ancak Geliştirici Araçları, sayfa bağlamına erişebildiğinden DevTools içinde IndexedDB verilerini düzenleyen JavaScript kodunu çalıştırabilirsiniz.

IndexedDB verilerini Snippet'lerle düzenleyin

Snippet'ler, Geliştirici Araçları'nda JavaScript kod bloklarını depolayıp çalıştırmanın bir yoludur. Snippet çalıştırdığınızda sonuç Konsol'a kaydedilir. Bir IndexedDB veritabanını düzenleyen JavaScript kodunu çalıştırmak için Snippet kullanabilirsiniz.

7. Şekil. IndexedDB ile etkileşim kurmak için Snippet kullanma

IndexedDB verilerini sil

IndexedDB anahtar/değer çiftini silme

1. Bir IndexedDB nesne deposunu görüntüleyin.

2. Silmek istediğiniz anahtar/değer çiftini tıklayın. Geliştirici Araçları, seçildiğini belirtmek için bu simgeyi mavi renkle vurgular.

   

   8. Şekil. Silmek için bir anahtar/değer çifti seçme

3. Sil tuşuna basın veya Seçilenleri Sil'i tıklayın.

   

   9. Şekil. Anahtar/değer çifti silindikten sonra nesne deposunun görünümü

Bir nesne deposundaki tüm anahtar/değer çiftlerini silme

1. Bir IndexedDB nesne deposunu görüntüleyin.

   

   10. Şekil. Nesne deposunu görüntüleme

2. Nesne deposunu temizle'yi tıklayın.

IndexedDB veritabanını silme

1. Silmek istediğiniz IndexedDB veritabanını görüntüleyin.

2. Veritabanını sil'i tıklayın.

   

   Şekil 11. Veritabanını sil düğmesi

Tüm IndexedDB depolama alanını sil

1. Depolama alanını temizle bölmesini açın.
2. IndexedDB onay kutusunun etkinleştirildiğinden emin olun.

3. Site verilerini temizle'yi tıklayın.

   

   Şekil 12. Depolama alanını temizle bölmesi