HTML5 파일 시스템은 강력한 API입니다. 강력한 힘에는 복잡성이 수반됩니다. 복잡성이 높아질수록 디버깅에 대한 불만이 커집니다. 안타깝게도 현재 Chrome DevTools에서는 Filesystem API를 지원하지 않습니다. 디버깅이 더 어려워집니다. 어렵다는 것은 파일 시스템에서 파일을 나열/삭제하는 코드를 작성해야 한다는 것을 의미합니다.
Filesystem API를 사용해 노력하는 과정에서 몇 가지 팁을 얻었으며, 이를 공유하고자 합니다. 각 도움말에는 자체적인 한계가 있지만 이를 조합하여 사용하면 90% 의 문제를 해결할 수 있습니다. 상위 5개는 다음과 같습니다.
file://에서 실행하고 있지 않은지 확인합니다. 많은 사람들이 당하는 교활한 사기입니다. Chrome은file://에 주요 보안 제한사항을 적용합니다.file://에서 앱을 로컬에서 실행하면 많은 고급 파일 API (BlobBuilder,FileReader, Filesystem API 등)가 오류를 발생시키거나 자동으로 실패합니다. 웹 서버가 없는 경우--allow-file-access-from-files플래그를 사용하여 Chrome을 시작하면 이 보안 제한을 우회할 수 있습니다. 이 플래그는 테스트 목적으로만 사용하세요.무서운
SECURITY_ERR또는QUOTA_EXCEEDED_ERR이는 일반적으로 데이터를 쓰려고 시도할 때 #1의 영향을 받는 경우에 발생합니다. 그렇지 않은 경우 할당량이 없는 것일 수 있습니다. 파일 시스템을 열 수 있는 할당량에는TEMPORARY와PERSISTENT의 두 가지 유형이 있습니다. 후자를 사용하는 경우 사용자는 앱에 영구 저장소를 명시적으로 부여해야 합니다. 방법은 이 게시물을 참고하세요.filesystem:URL FTW 앱 출처의 루트DirectoryEntry의filesystem:URL을 여는 것이 편리합니다. 이게 무슨 의미일까요? 예를 들어 앱이www.example.com에 있는 경우 새 탭에서filesystem:http://www.example.com/temporary/를 엽니다. Chrome에 앱 출처에 저장된 파일/폴더의 읽기 전용 목록이 표시됩니다.filesystem:URL에 관한 자세한 내용은 https://www.html5rocks.com/en/tutorials/file/filesystem/#toc-filesystemurls를 참고하세요.chrome://settings/cookies은 내 친구입니다. 이 페이지에서는 출처에 저장된 데이터를 삭제할 수 있습니다. 여기에는 데이터베이스 저장소, AppCache, 쿠키, localStorage, FileSystem API의 항목이 포함됩니다. 단, 이 기능은 '전부 또는 전혀' 적용됩니다. 하나의 파일이나 데이터만 삭제할 수는 없습니다.오류 콜백을 잊지 마세요. Filesystem API는 비동기 환경에 있습니다 (Worker에서 동기화 버전을 사용하지 않는 경우). API 호출 시 항상 오류 콜백을 사용하세요. 이 단계는 선택사항이지만 나중에 문제가 발생했을 때 많은 고생을 덜 수 있습니다.