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

Bu kılavuzda, IndexedDB verilerini görüntülemek ve değiştirmek için Chrome Geliştirici Araçları'nı nasıl kullanacağınız gösterilmektedir. Bu makalede, Geliştirici Araçları'nı kullanabildiğiniz varsayılmaktadır. Aksi takdirde Başlayın bölümüne bakın. Ayrıca IndexedDB ile aşina olduğunuz da varsayılır. Aksi takdirde IndexedDB'i kullanma başlıklı makaleyi inceleyin.

IndexedDB verilerini görüntüleme

  1. Uygulama panelini açmak için Uygulama sekmesini tıklayın. Kullanılabilir veritabanlarını görmek için IndexedDB menüsünü genişletin.

    IndexedDB menüsü

    Şekil 1. IndexedDB menüsü

    • Veritabanı simgesi notes - https://mdn.github.io bir veritabanını temsil eder. Bu veritabanında notes veritabanının adı, https://mdn.github.io ise veritabanına erişebilen kaynaktır.
    • Nesne Deposu simgesi notlar bir nesne deposudur.
    • title ve body dizilerdir.
  1. Bir veritabanının kaynağını ve sürüm numarasını görmek için veritabanını tıklayın.

    "notlar" veritabanı

    Şekil 2. notes veritabanı

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

    "notlar" adlı nesne deposu

    Şekil 3. notlar nesne deposu

    • Toplam giriş sayısı, nesne deposundaki anahtar/değer çiftlerinin toplam sayısıdır.
    • Anahtar oluşturma aracı değeri, kullanılabilir olan bir sonraki anahtardır. Bu alan yalnızca anahtar oluşturucular kullanılırken gösterilir.
  3. Değer sütunundaki bir hücreyi tıklayarak ilgili değeri genişletin.

    IndexedDB değerini görüntüleme

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

  4. Nesne deposunu ilgili dizinin değerlerine göre sıralamak için aşağıdaki Şekil 6'da gösterilen title veya body gibi bir dizini tıklayın.

    Nesne deposunu bir dizinle sıralama

    Şekil 5. Başlık anahtarına göre alfabetik olarak sıralanmış bir nesne deposu

IndexedDB verilerini yenileme

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

Veritabanı görüntüleme

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

IndexedDB verilerini düzenleme

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

IndexedDB verilerini snippet'lerle düzenleme

Snippet'ler, JavaScript kod bloklarını DevTools'ta depolayıp çalıştırmanın bir yoludur. Bir snippet'i çalıştırdığınızda sonuç Console'a kaydedilir. IndexedDB veritabanını düzenleyen JavaScript kodunu çalıştırmak için snippet kullanabilirsiniz.

IndexedDB ile etkileşime geçmek için snippet kullanma

Şekil 7. IndexedDB ile etkileşime geçmek için snippet kullanma

IndexedDB verilerini silme

IndexedDB anahtar/değer çiftini silme

  1. IndexedDB nesne deposunu görüntüleme.
  2. Silmek istediğiniz anahtar/değer çiftini tıklayın. DevTools, seçildiğini belirtmek için mavi renkle vurgular.

    Silmek için bir anahtar/değer çiftini seçme

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

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

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

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

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

  1. IndexedDB nesne deposunu görüntüleme.

    Nesne deposunu görüntüleme

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

  2. Nesne deposunu temizle'yi tıklayınNesne deposunu temizleme.

IndexedDB veritabanını silme

  1. Silmek istediğiniz IndexedDB veritabanını görüntüleyin.
  2. Veritabanını sil'i tıklayın.

    "Veritabanını sil" düğmesi

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

Tüm IndexedDB depolama alanını silme

  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.

    "Depolama alanını temizle" bölmesi

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