Ta strona została przetłumaczona przez Cloud Translation API.

Debugowanie interfejsu Filesystem API

Eric Bidelman

System plików HTML5 to zaawansowany interfejs API. Moc i złożoność Im większa złożoność, tym więcej błędów związanych z debugowaniem. DevTools w Chrome nie obsługują obecnie interfejsu Filesystem API. Utrudnia debugowanie. Przez „trudne” mam na myśli konieczność napisania kodu do wyświetlania listy/usuwania plików w systemie plików.

W trakcie pracy z interfejsem Filesystem API udało mi się znaleźć kilka wskazówek, które warto przekazać. Każda wskazówka ma inne ograniczenia, ale połączenie tych wskazówek pomoże Ci je osiągnąć w 90%. Oto 5 najpopularniejszych:

Upewnij się, że nie korzystasz z aplikacji file://. Jest to podstępna konstrukcja, którą wiele osób rozumie. Na stronach file:// Chrome nakłada duże ograniczenia zabezpieczeń. Wiele zaawansowanych interfejsów API plików (BlobBuilder, FileReader, Filesystem API itp.) generuje błędy lub kończy się niepowodzeniem, jeśli aplikacja jest uruchamiana lokalnie z poziomu file://. Jeśli nie masz pod ręką serwera WWW, możesz uruchomić Chrome z flagą --allow-file-access-from-files, aby obejść to ograniczenie bezpieczeństwa. Używaj tej flagi tylko do celów testowych.
Najbliższe SECURITY_ERR lub QUOTA_EXCEEDED_ERR. Zwykle dzieje się tak, gdy próbujesz zapisać dane, ale jesteś pod wpływem #1. Jeśli tak nie jest, prawdopodobnie nie masz limitu. Istnieją 2 typy limitów, z którymi można otwierać system plików: TEMPORARY i PERSISTENT. Jeśli używasz drugiej opcji, użytkownik musi jawnie przyznać aplikacji pamięć trwałą. Instrukcje, jak to zrobić, znajdziesz w tym poście.
filesystem: URL FTW. Przydatne może być otwarcie adresu URL typu filesystem: dla głównego źródła aplikacji (DirectoryEntry). Co to znaczy? Jeśli na przykład Twoja aplikacja działa w www.example.com, otwórz filesystem:http://www.example.com/temporary/ w nowej karcie. Chrome wyświetli listę tylko do odczytu plików i folderów przechowywanych w źródle aplikacji. Więcej informacji o adresach URL w usłudze filesystem: znajdziesz na https://www.html5rocks.com/en/tutorials/file/filesystem/#toc-filesystemurls.
chrome://settings/cookies jest Twoim znajomym. Ta strona umożliwia nukowanie danych przechowywanych w punkcie początkowym. Obejmuje to miejsce w bazie danych, pamięć podręczną aplikacji, pliki cookie, pamięć localStorage i inne elementy interfejsu FileSystem API. Należy jednak uważać, że wszystko albo nic. Nie możesz usunąć tylko jednego pliku lub danych.
Nie zapomnij o błędnych wywołaniach zwrotnych. Interfejs Filesystem API działa w świecie asynchronicznym (chyba że używasz wersji synchronizacji w instancjach roboczych). Zawsze używaj wywołania zwrotnego błędu w wywołaniach interfejsu API. Są opcjonalne, ale oszczędzisz sobie dużo żalu później, gdy coś się wydarzy.