HTML5는 이미 강력한 localStorage와 sessionStorage를 제공하지만 둘 다 단순한 데이터 구조를 저장하기 위한 데이터만 제공할 수 있으며 복잡한 웹 애플리케이션 데이터에는 무력합니다. 놀라운 점은 HTML5가 브라우저 측 데이터베이스 지원을 제공하여 JS API를 통해 직접 브라우저 측에 로컬 데이터베이스를 생성할 수 있게 하고 표준 SQL CRUD 작업을 지원하여 오프라인 웹 애플리케이션이 구조화된 데이터를 보다 편리하게 저장할 수 있게 해준다는 것입니다. 다음으로 관련 API와 로컬 데이터의 사용법을 소개하겠습니다.
로컬 데이터베이스를 운영하는 가장 기본적인 단계는 다음과 같습니다.
1단계: openDatabase 메서드: 데이터베이스에 액세스하기 위한 개체를 만듭니다.
2단계: 첫 번째 단계에서 생성한 데이터베이스 액세스 개체를 사용하여 트랜잭션 메서드를 실행합니다. 이 메서드를 통해 이벤트 응답 메서드를 설정하여 트랜잭션을 성공적으로 시작할 수 있습니다.
3단계: ExecutionSql 메서드를 통해 쿼리를 실행합니다. 물론 쿼리는 CRUD일 수 있습니다.
다음으로 해당 메소드의 매개변수와 사용법을 소개하겠습니다.
1. openDatabase 메소드
//Demo: 데이터베이스를 가져오거나 생성합니다. 데이터베이스가 없으면 생성합니다.
var dataBase = openDatabase("student", "1.0", "学生表", 1024 * 1024, function () { });
openDatabase 메소드는 기존 데이터베이스를 엽니다. 데이터베이스가 존재하지 않는 경우 데이터베이스를 생성할 수도 있습니다. 여러 매개변수의 의미는 다음과 같습니다.
데이터베이스 이름.
현재 데이터베이스 버전은 1.0이면 충분합니다. 물론 입력할 필요는 없습니다.
데이터베이스에 대한 설명입니다.
할당된 데이터베이스의 크기를 설정합니다(단위는 kb).
콜백 기능(생략가능).
2. db.transaction 메소드
는 콜백 함수를 설정할 수 있습니다. 이 함수는 우리가 시작한 트랜잭션의 개체인 매개변수를 허용할 수 있습니다. 그런 다음 이 개체를 통해 SQL 스크립트를 실행할 수 있습니다.3.executeSql 메소드는
ts.executeSql(sqlQuery,[value1,value2..],dataHandler,errorHandler)
매개변수 설명:
qlQuery: 생성, 선택, 업데이트, 삭제 등 구체적으로 실행해야 하는 SQL 문;
[value1, value2..]: sql 문에 사용되는 모든 매개 변수의 배열입니다.executeSql 메서드에서 s> 문에 사용할 매개 변수를 "?"로 바꾼 후 이러한 매개 변수의 배열을 구성하여 두 번째 매개변수
dataHandler: 성공적인 실행은 쿼리 결과 세트를 얻을 수 있는 콜백 함수입니다.
errorHandler: 실행 실패 시 호출되는 콜백 함수