HTML5 Storage 3 - IndexedDB -

Today's Topic is Indexed Database of HTML5.

Indexed DB 도 Web Storage 중 하나인데요. Key-value 조합으로 데이터를 관리 할 수 있도록 해 줍니다.

아래 파일을 다운 받아서 브라우저에서 테스트 해 보세요.
Download below file and open it with latest Google Chrome Browser.

HTML5IndexedDB.html

Google Chrome 16.0.912.75 m  - Working well (O)
Internet Explorer 9.0.8.112        - Not Working (X)
Opera 11.60                            - Not Working (X)
Safari 5.1.2                             - Not Working (X)
FireFox 9.0.1                          - Not Working (X)

This is only working on my Google Chrome browser as above.
이 기능은 구글 크롬 브라우저에서만 동작이 제대로 됩니다.

JS

IndexedDB

var idbRequest = window.indexedDB.open('Database Name');
idbRequest.onsuccess = function(event) {
var db = event.srcElement.result;
var transaction = db.transaction([], IDBTransaction.READ_ONLY);
var curRequest = transaction.objectStore('ObjectStore Name').openCursor();
curRequest.onsuccess = ...;
};

1.  "create objectStore" ->2.  Input key and value -> 3.  click "set" -> 4. do 2 and 3  as many as you want -> 5. you can see new key and value -> 6. You can delete it -> 7. you can remove objectStore

먼저 objectStore 를 create 하고 키와 밸류를 넣은 다음 set 버튼을 누릅니다.
그러면 데이터가 브라우저에 저장이 됩니다.
데이터를 여러개 생성할 수 있습니다. 하지만 key 값은 중복 될 수 없습니다.
생성된 데이터 옆에 Delete 버튼을 누르면 데이터가 지워집니다.
remove objectStore 버튼을 누르면 전체 objectStore 가 delete 됩니다.

오직 구글 크롬 브라우저에서만 실행 되더라구요.
혹시 다른데서 실행 되시는 분은 알려 주세요.

It works on Google Chrome browser only.
Please let me know if it works on any other browser.

그럼....

Thanks