摘要:初體驗特點對象形式存儲異步防止鎖死瀏覽器,是同步的支持事物只要有一步失敗,整個事物回滾同源限制不能跨域訪問數據庫存儲空間比大大的多支持二進制存儲我寫了一個通訊錄的項目,利用在瀏覽器持續化端存儲通訊錄數據學習自阮一峰瀏覽器數據庫我貼出大概示例
IndexedDB初體驗 特點:
對象形式存儲
異步 (防止鎖死瀏覽器,localstorage是同步的
支持事物 (只要有一步失敗,整個事物回滾
同源限制 (不能跨域訪問數據庫
存儲空間比localstorage大 (大的多
支持二進制存儲
我寫了一個通訊錄的項目,利用indexeddb在瀏覽器持續化端存儲通訊錄數據我貼出大概示例: 安裝:
學習自: 阮一峰瀏覽器數據庫 & indexedDB API
yarn install運行:
yarn start
// DB.ts interface Idb { database: string; // 數據庫名稱 version: number; // 版本號 db: any; // 數據庫創建成功后的對象 store: any[]; // 初始化存儲數據 tables: any[]; // 表選項 open(): void; // 打開數據庫方法 add(): void; // 插入一條數據 read(i): void; // 讀取指定數據 readAll(): void; // 讀取全部數據 remove(i): void; // 移除指定數據 update(o): void; // 更新指定數據 }
init.ts
import IndexedDB from "./DB"; var db_person = new IndexedDB("db_test", 1); db_person.open(); // 初始化數據庫操作
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/108577.html
背景 隨著前端技術日新月異地快速發展,web應用功能和體驗也逐漸發展到可以和原生應用媲美的程度,前端緩存技術的應用對這起到了不可磨滅的貢獻,因此想一探前端的緩存技術,這篇文章主要會介紹在日常開發中比較少接觸的IndexedDB IndexedDB 什么是IndexedDB IndexedDB簡單理解就是前端數據庫,提供了一種在用戶瀏覽器中持久存儲數據的方法,但是和前端關系型數據不同的是,Index...
摘要:在不指定的情況下,默認版本號為。具體示例如下在需要更新數據庫的模式時,需要更新版本號。此時我們指定一個高于之前版本的版本號,就會觸發事件。數據操作事務在中,我們也能夠使用事務來進行數據庫的操作。 概述 本文通過對IndexedDB的使用方法和使用場景進行相關介紹,對常見的問題進行解答。 同時,因為MDN中的相關文檔缺乏相關邏輯性,所以不容易理解。本文將通過項目中常見的數據存儲和操作需求...
摘要:概述是一個事務型數據庫系統,類似于基于的。然而不同的是它使用固定列表,是一個基于的面向對象的數據庫。參考文檔瀏覽器數據庫入門教程 概述 IndexedDB 是一個事務型數據庫系統,類似于基于 SQL 的 RDBMS。 然而不同的是它使用固定列表,IndexedDB 是一個基于 JavaScript 的面向對象的數據庫。現有的瀏覽器數據儲存方案,都不適合儲存大量數據:Cookie 的大小...
摘要:版本號必須為整數更新版本,打開版本為的數據庫新數據庫版本號為我們通過監聽請求對象的事件來定義數據庫版本更新時執行的方法。 前言 在 HTML5 的本地存儲中,有一種叫 indexedDB 的數據庫,該數據庫是一種存儲在客戶端本地的 NoSQL 數據庫,它可以存儲大量的數據。從上篇:HTML5 進階系列:web Storage ,我們知道 web Storage 可以方便靈活的在本地存取...
閱讀 1176·2023-04-26 00:34
閱讀 3347·2023-04-25 16:47
閱讀 2109·2021-11-24 11:14
閱讀 3092·2021-09-26 09:55
閱讀 3682·2019-08-30 15:56
閱讀 3211·2019-08-29 16:57
閱讀 1903·2019-08-26 13:38
閱讀 2663·2019-08-26 12:22