HTML5의 로컬 스토리지에는 IndexEddb라는 데이터베이스가 있습니다. 이전 부분에서 : HTML5 Advanced Series : Web Storage는 웹 스토리지가 로컬 액세스에서 간단한 데이터에 쉽게 액세스 할 수 있지만 많은 수의 구조 스토리지의 경우 IndexedB의 장점이 훨씬 더 분명합니다. 다음으로 INDEXEDDB가 데이터를 저장하는 방법을 살펴 보겠습니다.
데이터베이스를 연결하십시오하나의 웹 사이트에는 여러 개의 indexeddb 데이터베이스가있을 수 있지만 각 데이터베이스의 이름은 고유합니다. 데이터베이스 이름을 통해 특정 데이터베이스를 연결해야합니다.
var research = indexeddb.open ( 'dbname', 1); // dbname database request를 엽니 다. } request.
INDEXEDDB.OPEN 메소드를 사용하여 데이터베이스는 두 개의 매개 변수를 수신하고 두 번째는 데이터베이스 버전입니다. 이 메소드는 idbopendBrequest 객체를 반환하여 데이터베이스를 요청하는 요청 객체를 나타냅니다. 요청 객체의 onsuccccess 및 onerror 이벤트를 모니터링하여 연결이 성공적이거나 실행되지 않는 메소드를 정의 할 수 있습니다.
데이터베이스의 데이터웨어 하우스는 데이터베이스 창고가 동일한 버전으로 변경되는 것을 허용하지 않기 때문에 새 버전 번호는 동일한 버전으로 데이터베이스를 반복적으로 수정하지 않도록 indexeddb.open 메소드에서 버전을 업데이트해야합니다. 버전 번호는 정수 여야합니다!
var research = indexeddb.open ( 'dbname', 2); // 2 2 데이터베이스를 사용하여 데이터베이스를 엽니 다. is = is = is = = = ' + e.newversion);}
요청 오브젝트의 Onupgradeneed 이벤트를 모니터링하여 데이터베이스 버전이 업데이트 될 때 실행 된 메소드를 정의합니다.
데이터베이스를 끕니다IndexedB.open을 사용하여 데이터베이스 성공에 연결하면 idbopendBrequest 객체가 반환됩니다.
var research = indexeddb.open ( 'dbname', 2); close (); confect.log ( '데이터베이스가 닫혔다');}데이터베이스를 삭제하십시오
indexeddb.deletedatabase ( 'dbname'); '데이터베이스가 삭제되었습니다');객체 창고를 만듭니다
Object Store는 IndexedDB 데이터베이스의 기초입니다. indexedDB에는 데이터베이스 테이블이 없으며 객체 창고는 데이터베이스 테이블과 같습니다.
var research = indexeddb.open ( 'dbname', 3); 'userId', 자동화 : false});
DB.CreateObjectStore 메소드는 두 개의 매개 변수를 수신합니다. 첫 번째는 객체 창고 이름, 두 번째 매개 변수는 선택적 매개 변수이며 값은 js 객체입니다. 이 객체의 키패스 속성은 기본 키이며, 데이터베이스 테이블의 ID와 동일합니다. AutoIincrement 속성은 False이므로 기본 키 값이 자체적으로 증가하지 않으면 기본 키 값을 지정해야합니다.
참고 : 데이터베이스에서 객체 창고 이름을 반복 할 수 없습니다. 그렇지 않으면 브라우저가 오류를보고합니다.
인덱스를 만듭니다indexeddb 데이터베이스에서 데이터베이스에서 검색 할 때 인덱스가 인덱스로 만 검색 될 수 있습니다.
var research = indexeddb.open ( 'dbname', 4); 'userId', autoincrement : false};
Store.createIndex 메소드는 3 개의 매개 변수를 수신하고 두 번째는 데이터 객체의 속성입니다 값은 JS 객체입니다. 이 객체의 고유 한 속성은 사실입니다. 즉, 인덱스 값이 동일 할 수 없음, 즉 두 데이터의 사용자 이름은 동일 할 수 없으며 False는 동일 할 수 있음을 의미합니다.
사무IndexedDB에서 모든 데이터 작업은 업무에서만 수행 할 수 있습니다. 데이터베이스가 성공한 후에는 IdbopendBrequest 객체의 트랜잭션 방법을 사용하여 트랜잭션을 읽거나 읽고 읽는 것만 열 수 있습니다.
var research = indexeddb.open ( 'dbname', 5); tx.oncomplete = function (e) {console.log ( '트랜잭션이 끝났다');} tx.onabort = function (e) {console.log ( '트랜잭션이 중단되었습니다');}}
DB.Transaction 메소드는 두 개의 매개 변수를 수신합니다. 첫 번째 매개 변수는 문자열 또는 배열 일 수 있고, 문자열은 객체 창고 이름이며, 배열의 객체 창고 배열은 창고가 작동합니다. 두 번째 매개 변수는 트랜잭션 모드가 readonly로 전송되면 객체 창고의 작동 만 읽을 수 있으며 작동을 쓸 수 없습니다. 작전 및 쓰기 작업을 위해 읽기 위원으로 전송할 수 있습니다.
운영 데이터var research = indexeddb.open ( 'dbname', 5); ',', ','readwrite '); var var value = {'username ':'linxin ','age ': var reput ( 값); / / 저장 var repk2 = store.get (1); DELETE (1); // 색인 데이터 삭제 1 Data req3.onsuccess = function () {console.log ( 'DELET DETA DECUCTE'); }}}}}}
ADD 및 PUT의 역할은 데이터를 저장하면 데이터의 기본 키가 이미 데이터베이스에서 동일한 기본 키를 갖는 경우 데이터베이스에서 주 키의 해당 객체를 수정한다는 것입니다. 그리고 추가를 사용하여 데이터를 저장하십시오. 기본 키가 이미 존재하는 경우 보존이 실패했습니다.
검색 데이터우리는 위의 get () 메소드를 사용하여 데이터를 얻을 수 있지만 주요 키 값이 필요하다는 것을 알고 있습니다. 다양한 데이터를 얻으려면 커서를 사용할 수 있습니다. 커서는 객체 창고의 Opencursor 방법에 의해 생성되고 열렸습니다.
OpenCursor 방법은 두 개의 매개 변수를 수신합니다.
// boundRange는 1에서 10까지의 1 차 키 값 모음을 나타냅니다 (1 및 10 포함). // 세 번째 매개 변수가 true 인 경우 최소 키 값이 1이 아님을 의미합니다. 네 번째 매개 변수가 참이면 최대 키 값 10을 포함하지 않고 기본값은 falsevar boundRange = idbkeyrande.bound임을 의미합니다. (1, 10, false, false); 유일한 () 매개 변수는 주요 키 값, 정수 유형입니다. varmingrange = idbkeyrange.ly (1); // 두 번째 매개 변수는 선택 사항입니다. 이는 True가 최소 기본 키 1을 포함하지 않으며 False가 포함되어 있으며, 거짓말로 Logerrange = idbkeyrange (1, false). 10 에센스 미만의 기본 키 값 중 // 두 번째 매개 변수는 선택 사항입니다. 이는 True가 가장 큰 기본 키 10 및 False 포함을 포함하지 않으며, 기본값은 FalseVar 어퍼 레인지 = idbkeyrange.upeperbound (10, false)입니다.
OpenCursor 메소드의 두 번째 매개 변수는 주로 다음이 있습니다.
var research = indexeddb.open ( 'dbname', 6); ',', ',', 'readwrite'); ction () {var cursor = if (cursor) {console.continue (); }
검색 조건을 충족하는 데이터가 있으면 업데이트 방법을 통해 데이터를 업데이트 할 수 있습니다.
cursor.updata ({userId : cursor.key, 사용자 이름 : 'hello', age : 18});
이 데이터는 삭제 방법을 통해 삭제 될 수 있습니다.
cursor.delete ();
Constinue 메소드를 통해 다음 데이터를 계속 읽을 수 있습니다. 그렇지 않으면 첫 번째 데이터를 읽은 후에도 계속 읽지 않습니다.
cursor.continue ();요약
데이터베이스 연결, 객체 창고, 인덱스 작성, 작동 및 검색 데이터에 이르기까지 INDEXEDDB 액세스 데이터의 전체 프로세스를 완료하십시오. 아래는 INDEXEDDB 데이터베이스를 더 잘 파악하기 위해 완전한 예를 통해 아래입니다. 코드 주소 : indexeddb-demo
위는이 기사의 모든 내용입니다.