IndexedDB

 

IndexedDB란?

 

자바스크립트 기반 많은 양의 데이터를 저장하기 위해 사용되는 웹 저장소이다.

자바스크립트 기반이므로 객체 지향 데이터베이스이다.

비동기 API이다. 

 

​

 

 

IndexedDB 사용 과정

1. 데이터베이스 열기 : const request = indexedDB.open("storename", version number );
2. 객체 저장소(object store) 생성: let objectStore = db.createObjectStore("tableName", { keyPath : "id" });
3. 트랜잭션으로 데이터베이스 작업: let store = db.transaction("tableName", "readwrite");
4. EventListener로 결과 요청

 

1. 데이터베이스 열기

 

- 데이터베이스를 열고 이름과 버전이 맞으면 오픈, 아니면 에러표시해준다.

 

const request = indexedDB.open("myDB", 1);

 

request.onsuccess = () => {
console.log('Success creating or accessing db')
}
request.onupgradeneeded = () => {
const database = request.result
}
request.onerror = () => {
console.log('Error creating or accessing db')
}

 

 

 

2. Object Store 생성

 

database.createObjectStore(‘table name’, {keyPath: ‘id’})

또는

database.createObjectStore(‘table name’, {autoIncrement: true})

또는
database.createObjectStore(‘table name’, {keyPath: ‘id’, autoIncrement: true})

 

 - 데이터베이스를 열 때 사용한 onupgradeneeded로 아래와 같이 객체 저장소를 생성, 변경할 수 있음.

 

request.onupgradeneeded = () => {
   const database = request.result
   const objectStore = database.createObjectStore(‘table name’, {keyPath: ‘id’})
}

 

 

 

3. Transaction 시작하기 (데이터 추가 / 제거 / 수정)

 

데이터 직접 추가, 사용자 직접 추가 등 다양한 방법이 있음.

 

아래의 코드로 transaction 시작

 

const transaction = database.transaction(“store name”, 'transaction mode')  mode ex: readwrite