Kayce Basques
이 가이드에서는 Chrome DevTools를 사용하여 웹 SQL 데이터를 검사하는 방법을 보여줍니다.
웹 SQL 데이터 보기
Sources 탭을 클릭하여 Application 패널을 엽니다. Web SQL 섹션을 펼쳐 데이터베이스와 테이블을 확인합니다. 아래 그림 1에서 html5meetup은 데이터베이스이고 rooms는 테이블입니다.
그림 1. 웹 SQL 창
표를 클릭하면 해당 표의 데이터가 표시됩니다.
그림 2. rooms 웹 SQL 테이블의 데이터 보기
웹 SQL 데이터 수정
위의 그림 2와 같이 Web SQL 테이블을 볼 때는 Web SQL 데이터를 수정할 수 없습니다. 하지만 웹 SQL 콘솔에서 테이블을 편집하거나 삭제하는 문을 실행할 수 있습니다. 웹 SQL 쿼리 실행을 참고하세요.
웹 SQL 쿼리 실행
- 데이터베이스를 클릭하여 해당 데이터베이스의 콘솔을 엽니다.
웹 SQL 문을 입력한 다음 Enter 키를 눌러 실행합니다.
그림 3. 웹 SQL 콘솔을 사용하여 rooms 테이블에서 행을 삭제합니다.
웹 SQL 테이블 새로고침
DevTools는 테이블을 실시간으로 업데이트하지 않습니다. 테이블의 데이터를 업데이트하는 방법은 다음과 같습니다.
- 웹 SQL 테이블의 데이터 보기
- 새로고침
을 클릭합니다.
Web SQL 테이블에서 열 필터링
- 웹 SQL 테이블의 데이터 보기
표시되는 열 텍스트 상자를 사용하여 표시할 열을 지정합니다. 열 이름을 CSV 목록으로 제공합니다.
그림 4. 표시되는 열 텍스트 상자를 사용하여
room_name및last_updated열만 표시
모든 웹 SQL 데이터 삭제
- Clear Storage 창을 엽니다.
웹 SQL 체크박스가 선택되어 있는지 확인합니다.
그림 5. 웹 SQL 체크박스
사이트 데이터 삭제를 클릭합니다.
그림 6. 사이트 데이터 삭제 버튼: