IE10 및 Metro 스타일 앱을 위한 IndexedDB 업데이트

IEBlog 한국어

Windows Internet Explorer 엔지니어링 팀 블로그

IE10 및 Metro 스타일 앱을 위한 IndexedDB 업데이트

  • Comments 0

Internet Explorer 팀은 다양한 웹 커뮤니티와 함께 IndexedDB 사양을 개선하기 위한 노력을 계속해 왔습니다. IndexedDB는 심지어 인터넷 연결이 해제된 상태에서도 개발자가 사용자의 장치에 데이터를 저장하거나 검색 혹은 다시 가져올 수 있는 W3C 작업 초안입니다. IndexedDB는 Windows 8 Consumer Preview에서 IE10과 Metro 스타일 앱이 공유하는 웹 플랫폼의 기능입니다.

이 글에서는 최신 버전의 W3C 사양을 구현하기 위해 Internet Explorer 10 Consumer Preview에서 변경된 내용에 대해 설명하겠습니다.

버전 관리 변경 사항

가장 중요한 변화는 개발자가 개체 저장소, 인덱스 등의 데이터베이스 스키마를 한 버전에서 다음 버전으로 업데이트하는 방식입니다. Microsoft를 포함한 작업 그룹은 IDBDatabase.setVersionAPI를 새로운 IDBFactory.open API로 대체하기로 결정했습니다. 새 open API는 추가 매개 변수를 사용하여 개발자가 현재 데이터베이스 스키마 버전을 사용하려고 하는지 아니면 데이터베이스 스키마 버전을 업데이트하려고 하는지를 감지합니다. 이제 open API는 IDBOpenDBRequest 개체를 반환하며, 개발자는 이 개체를 사용하여 onupgradeneeded 이벤트를 등록할 수 있습니다. 개발자는 이벤트 처리기에서 개체 저장소 및 인덱스를 추가하여 데이터베이스 스키마를 업데이트할 수 있습니다.

기존 코드를 업데이트하려면 open 메서드에 version 매개 변수를 추가하여 호출을 setVersion으로 대체하고, IDBOpenDBRequest에서 새 onupgradeneeded 이벤트 처리기를 등록합니다(아래 참조).

기존 코드 예 – 영향을 받는 코드는 녹색 강조 표시

function openDBTest(dbName) {

var rq = window.msIndexedDB.open(dbName);

rq.onsuccess = successOpenningDB;

rq.onerror = failureHandler;

}

 

function successOpenningDB(evt) {

var db = evt.target.result;

var rq = db.setVersion("1");

rq.onsuccess = successHandler;

rq.onerror = failureHandler;

}

 

function successHandler(evt) {

//create schema

}

새 코드 예 – 변경된 코드는 노란색 강조 표시

function openDBTest(dbName) {

var rq = window.msIndexedDB.open(dbName, 1);

rq.onsuccess = useDB;

rq.onupgradeneeded = successHandler;

rq.onerror = failureHandler;

}

 

function successHandler(evt) {

//create schema

}

추가 변경 사항

또한 우리는 플랫폼에 다음과 같은 변경 작업을 했는데 사소해 보이지만 매우 중요한 의미가 있습니다.

  • IDBCursor.advance(count) 메서드를 추가했습니다. 개발자는 이 메서드를 사용하여 커서의 레코드를 건너뛸 수 있습니다. 따라서 페이지 매김 시나리오가 가능합니다. count 매개 변수는 데이터에 액세스하기 전에 건너뛸 레코드의 숫자를 정의합니다. 유효한 값은 1 이상입니다.
  • IDBObjectStore.count(key)IDBIndex.count(key) 메서드를 추가했습니다. 개발자는 이러한 메서드를 사용하여 특정 기준과 일치하는 레코드 수를 셀 수 있습니다. 키 값을 지정하지 않으면 인덱스 또는 개체 저장소 내의 모든 레코드 수가 반환됩니다.
  • IDBFactory.cmp(first, second) 메서���를 추가했습니다. 이 메서드는 두 키 값을 비교하여 한 값이 다른 값보다 큰지 아니면 두 값의 크기가 같은지를 확인합니다.
  • 이제 IDBKeyRangesIDBObjectStore.count, IDBObjectStore.delete, IDBIndex.count를 포함한 추가 메서드와 연동합니다. 따라서 개발자는 특정 키 값 범위에 있는 레코드를 일치시킬 수 있습니다.
  • 이제부터 데이터베이스에 추가되는 값은 이전에 정의된 모든 인덱스를 만족하지 않아도 됩니다. 따라서 개발자는 이전에 정의된 인덱스의 범위 밖에 있는 레코드를 IDBObjectStore에 추가할 수 있습니다.
  • 활성 트랜잭션의 컨텍스트 내에서 예외가 발생할 경우 해당 트랜잭션이 중단됩니다. 즉, 어떤 요청의 onsuccess 이벤트 처리기 내에서 예외가 발생할 경우 활성 트랜잭션이 중단된다는 의미입니다. 하지만 예외를 처리하면 데이터베이스 트랜잭션이 정상적으로 계속됩니다.

    // This won’t abort the transaction because there is no active transaction.

    function createTransaction() {

    var txn = db.transaction("test");

    window.aaaaaa();

    }

     

    // This will abort the transaction because the exception is thrown when there is an active transaction.

    var rq = objectStore.add(record);

    rq.onsuccess = function (event) {

    window.aaaaaa();

    }

  • Blob에 인덱스 속성이 추가되었습니다. 따라서 개발자는 웹에서 이진 데이터를 다운로드하고, 다운로드한 데이터를 로컬에 저장하고, blob 속성(예: 이름, 크기 등)을 인덱스 또는 고유한 키로 blob에 사용할 수 있습니다. 이 기능을 사용하여 오프라인으로 음악 또는 이미지/비디오 컬렉션을 감상하는 시나리오를 구현하고, blob 이름을 사용하여 컬렉션을 검색할 수 있습니다. 최신 IE 테스트 데모에서 이 기능을 사용하여 오프라인으로 Facebook 앨범을 보는 방법이 소개되었습니다.
  • IE 테스트 드라이브 데모 및 Facebook Companion의 스크린샷
    IE 테스트 드라이브 데모 Facebook Companion의 스크린샷

또한 우리는 새 테스트 및 기존 테스트 업데이트를 포함하여 IndexedDB에 대한 100건이 넘는 테스트 사례를 W3C 작업 그룹에 제출했습니다.

사이트 및 앱의 IndexedDB 사용 방식 제어

W3C 사양의 레코드 일치 변경 작업 외에도 사용자가 자신의 장치에서 사이트 및 앱의 IndexedDB 사용 방식을 제어할 수 있도록 다음과 같이 Windows 8 Consumer Preview의 기능이 개선되었습니다.

  • indexedDB를 사용하는 Metro 스타일 앱의 제거 처리기를 도입했습니다. 최종 사용자가 이 처리기를 사용하여 응용 프로그램을 제거하면 제거 프로세스가 진행되는 동안 앱의 IndexedDB 데이터베이스에 들어 있는 관련 데이터가 자동으로 삭제됩니다.
  • 사이트의 디스크 공간이 고갈되지 않도록 할당량(저장소 한계)을 구현했습니다. IT 관리자 또는 레지스트리에 관리자 권한으로 액세스할 수 있는 사용자는 그룹 정책 설정을 통해 할당량 한계를 업데이트할 수 있습니다. 하지만 Metro 스타일 앱에는 할당량이 적용되지 않습니다.
  • 최종 사용자가 데이터베이스 및 할당량을 관리할 수 있도록 새 브라우저 인터페이스를 추가했습니다. 사용자는 캐시 및 데이터베이스 대화 상자를 사용하여 개별 데이터베이스를 제거할 수 있습니다. 또는 개발자가 검색 기록 삭제 대화 상자를 사용하여 “쿠키 및 웹 사이트 데이터” 확인란을 선택하면 모든 데이터베이스를 제거할 수 있습니다.

웹 사이트 데이터 설정 대화 상자의 새로운 캐시 및 데이터베이스 탭 스크린샷. 이 탭을 사용하여 웹 사이트에서 캐시 및 데이터베이스를 생성할지 여부와 생성되는 캐시 및 데이터베이스의 크기를 제어할 수 있습니다.웹 사이트 데이터, 특히 웹 사이트에서 생성된 데이터베이스를 포함하는 새로운 쿠키 옵션을 보여 주는 업데이트된 검색 기록 삭제 대화 상자의 스크린샷.
웹 사이트 데이터 설정 대화 상자의 새로운 캐시 및 데이터베이스 탭과 업데이트된 검색 기록 삭제 대화 상자의 스크린샷

전망

W3C WebApp 작업 그룹은 중요한 개선 작업을 수행하고 사양 변경의 가짓수와 범위를 줄임으로써 완벽한 IndexedDB를 만들기 위한 노력을 계속하고 있습니다. 이는 가까운 미래에 웹 개발자가 Windows 8 및 IE10을 포함하여 이 기술을 기반으로 개발할 수 있도록 하기 위한 중요한 단계입니다.

여러분이 사이트 및 앱에 IndexedDB를 어떻게 사용하실지 기대가 크며, IE10의 IndexedDB에 대한 많은 의견을 바랍니다.

- Internet Explorer 수석 프로그램 관리자, Israel Hilerio 박사

  • Loading...