readAsBinaryString mówi, że dane muszą być reprezentowane jako ciąg binarny, gdzie każdy bajt jest reprezentowany przez liczbę całkowitą w zakresie 0 255. JavaScript początkowo nie miał typu binarnego, dopóki wsparcie WebGL modułu ECMAScript 5 dla Typed Array nie zostało opisane poniżej - został zastąpiony arkuszem ArrayBuffer ECMAScript 2017, a więc udał się ze Stringiem z gwarancją, że żaden znak przechowywany w łańcuchu nie mieści się w przedziale 0 255. Moglibyśmy przeszukiwać tablicę Numbers zamiast tego, ale nie były to duże struny więcej pamięci niż dużych tablic Numbers, ponieważ Numbers są zmiennoprzecinkowe. Jeśli przykładowo czytasz plik, który jest głównie tekstem w zachodnim skrypcie głównie angielskim, na przykład ten ciąg będzie wyglądał jak tekst odczytać plik ze znakami Unicode, powinieneś zauważyć różnicę, ponieważ ciągi JavaScript są opisane poniżej w UTF-16, a więc niektóre znaki będą miały wartości powyżej 255, podczas gdy ciąg znaków binarnych według specyfikacji pliku API nie miałby żadnych wartości powyżej 255 d masz dwa indywidualne znaki dwóch bajtów punktu kodu Unicode. Jeśli odczytywasz plik, który nie jest tekstem na wszystkich obrazach, być może prawdopodobnie otrzymasz bardzo podobny wynik pomiędzy readAsText i readAsBinaryString, ale z readAsBinaryString wiesz, że nie udało się żadnej próby interpretacji sekwencji wielobajtowych jako znaków Nie wiesz, że jeśli używasz readAsText, ponieważ readAsText użyje określenia kodowania, aby spróbować dowiedzieć się, jakie jest kodowanie pliku a następnie odwzorować ją na łańcuchy znaków UTF-16 języka JavaScript. Możesz zobaczyć efekt, jeśli tworzysz plik i zapisasz go w czymś innym niż ASCII lub UTF-8 W systemie Windows możesz to zrobić za pomocą notatnika Zapisz jako jak kodowanie - w dół z Unicode na to, przez które patrząc na dane, które wydają się znaczyć UTF-16 Jestem m Mac OS i nix edytory mają podobną funkcję Here sa strona, która wysypuje wynik czytania pliku w obie strony. Jeśli go używać z plik testujący 1 2 3 przechowywany w UT F-16, oto wyniki, które dostaję. Jak widzisz, readAsText zinterpretował znaki, a więc mam 13 długości testowania 1 2 3, a readAsBinaryString nie, a więc mam 28 dwubajtowych BOM plus dwa bajtów dla każdego znaku. z przetwornikiem tablicowym responseType jest obsługiwany w HTML 5. Ciągi JavaScript są UTF-16 mogą wydawać się dziwne stwierdzenie, że są one tylko Unicode Nie, ciąg JavaScript jest serią jednostek kodu UTF-16, które można zobaczyć jako pary zastępcze jako dwa pojedyncze znaki JavaScript choć w istocie para zastępcza jako całość to tylko jeden znak Zobacz link, aby uzyskać szczegółowe informacje. digitalFresh Ciąg jest danymi binarnymi Jak komentowałeś, zamieściłem przykład, który może pomóc JavaScript nie ma typu binarnego, a więc udał się ze Stringiem z gwarancją, że żaden znak przechowywany w ciągu nie byłby poza zakresem 0 255 Mogliby jednak przejść z tablicą liczb, ale nie t Przykład pokazuje, jak uzyskać surową wartość postaci z łańcucha TJ Crowder 30 czerwca 10 w 5 09. morpheus Ponieważ to jest asynchroniczne, to może rzucać wyjątki trzeba spojrzeć na interfejs, aby sprawdzić, czy jest jakiś asynchroniczny sposób raportowania błędów I rzeczywiście, FileReader ma onerror dla tego Jeśli używasz adresu URL pliku, twoja domena dokumentu jest nieaktualna, co skłania cię do zamknięcia z wielu stron rzeczy, których nie znam, nigdy nie robię tego, szczególnie gdy SOP dostanie się do niego Jestem pewien, że to zależy od przeglądarki, przynajmniej na razie, ponieważ część bezpieczeństwa specyfikacji jest nadal tymczasowa Ale ja bym nie nie spodziewaj się, że będzie pracować TJ Crowder 5 listopada w 18 12.Man dziękuję - skasowałem mój komentarz, aby uniemożliwić innym zrozumienie mojego uproszczenia i dziękuję za wysłanie szczegółów - jestem pewien, że inni uważają, że Twoje komentarze są o wiele bardziej pomocne, a czytanie artykułu jest naprawdę dobrym pomysłem, jak mówisz, jeśli ktoś kręci się w tej dziedzinie Brian M Hunt Dec 30 14 at 14 16.Dobra używać do przesłania pliku PNG do serwera za pośrednictwem AJAX, usuniętego pliku koduObject jest obiektem zawierającym informacje na moim pliku. Za pomocą kilku pierwszych wierszy z pliku przed przesłaniem za pomocą VI daje me. The samego pliku po przesłuchaniu shows. So wygląda na problem formatowania kodowania gdzieś, próbowałem przy użyciu prostej funkcji kodowania UTF8 na surowe dane binarne. Następnie w oryginalnym code. which daje mi dane wyjściowe. Nie będę miał surowego pliku. Jak kodować proces ładowania pliku, aby uniknąć problemów z kodowaniem, więc plik otrzymany w żądaniu jest taki sam, jak plik przed jego przesłaniem. Między innymi przydatne informacje , jeśli zamiast używać używać, aby uzyskać binarne dane działają prawidłowo Ale getAsBinary działa tylko w Firefoksie Już testowałem to w Firefoksie i Chrome, zarówno na Macie, uzyskując ten sam wynik w obydwu przesyłaniach Backend są obsługiwane przez Moduł Przesyłania NGINX znowu uruchomiony na Macu Serwer i klient jest na tej samej maszynie To samo dzieje się z każdym plikiem próbuję załadować, po prostu wybrałem PNG, ponieważ był to najbardziej oczywisty przykład. asked Sep 15 11 at 13 07. Poniżej jest późna, ale pełna odpowiedź. FileReader metody wsparcia . jest przestarzały Nie używaj go Nie ma już w roboczym pliku roboczym API pliku W3C. NB Należy zauważyć, że plik jest rodzajem rozszerzonej struktury Blob. Mozilla wciąż implementuje readAsBinaryString i opisuje ją w dokumentacji MDN FileApi. Z powodu deprecacji readAsBinaryString jest mój że poniższe standardy dla łańcuchów JavaScript to DOMString, które akceptują tylko znaki UTF-8, a nie losowe dane binarne. Nie używaj readAsBinaryString, który nie jest w pełni bezpieczny i zgodny z ECMAScript. Wiemy, że łańcuchy JavaScript nie powinny przechowywać binarnych ale Mozilla w pewnym sensie może to być niebezpieczne Moim zdaniem Blob i wpisane tablice ArrayBuffer i niezapisane jeszcze, ale niekonieczne StringView zostały wymyślone w jednym celu pozwalają na użycie czystych danych binarnych, bez ograniczeń ciągów UTF-8. przesłać wsparcie. ma następujące inwokacje options. sendAsBinary nie jest standardem i może nie być obsługiwane w Chrome. Jeśli masz kilka opcji. send of fileObject Jest to bardziej skomplikowane do manipulowania musisz podać osobne przesłanie, ale to RECOMMENDED APPROACH. send of fileObject Generuje bezużyteczne narzuty i kompresję, wymaga kroku dekompresyjnego po stronie serwera, ale jest łatwa do manipulowania ciągiem w języku JavaScript. Being nietypowym i sendAsBinary pliku fileObject. The najlepszym sposobem na wysłanie zawartość binarna jak w plikach przesyłanych za pomocą metody ArrayBuffers lub Blobs w koniunktonie przy użyciu metody send Jeśli chcesz wysłać surowe dane surowe, użyj metody sendAsBinary lub StringView Non macierzysta tablica nadrzędna superclass. I m sorry to dig this po raz kolejny chcieliśmy dodać, że najprawdopodobniej najprostszym sposobem na wysyłanie danych binarnych itp. jest plik PDF i onloadloader, a nie tylko wysłanie kodu, który nie jest czystym kodowanym łańcuchem base64, który czyścisz t początkowo z regexem jak 1, a następnie przesłać prawdziwy base64 na serwer do zdekodowania user1299518 Aug 19 14 at 11 37. Ponieważ ktoś może edytować MDN, prawdopodobnie nie będę go używać jako źródła Chris Anderson 22 maja 15 w wieku 17 40 vlzvl Jesteś moim bohaterem Yster 16 listopada 15 w 16 48. user1299518, lepsze wykorzystanie,, 2 1 nie pasuje MrKsn Apr 6 16 at 17 12.The najlepszy sposób w przeglądarkach, które go obsługują, to wysłać plik jako Blob, lub przy użyciu FormData, jeśli chcesz mieć wieloczęściową formę Nie potrzebujesz programu FileReader dla tego, co jest prostsze i bardziej wydajne niż próba odczytu danych. Jeśli konkretnie chcesz wysłać go jako wieloczęściowe dane formularza, możesz użyć obiektu FormData. Można także wysyłać dane bezpośrednio, zamiast używać wieloczęściowych danych formularza Zobacz dokumentację Oczywiście będzie to wymagało zmian po stronie serwera. Obsługa przeglądarek zawiera większość przeglądarek, w tym IE 10.Reading tekst i dane binarne z czytelnych strumieni. Ten samouczek wyjaśnia wykorzystanie i tworzenie czytelnych strumieni. Informacje o wersji. Author J eff Barczewski. Published 3rd, 2017.Tags nodejs, streams. Level Intermediate. Podstawowe krypto, zdarzenia, instalowanie modułów npm. v0 10 najnowsza stabilność to v0 10 15 od tego pisma, ale strumienie zasadniczo były częścią jego początków. Streams2 może być używany ze starszymi wersjami węzła przy użyciu modułu do odczytywania strumienia npm. Stymulując lub używając odczytywalnych streams. Simple przykład odczytywania pliku i odbijania go do stdout. Creating sha1 digest pliku i echa do wyniku stdout podobne do shasum. The zdarzenie danych jest uruchamiany na odczytywalny strumień dla każdego fragmentu danych, więc aktualizacja digest z dla każdy kawałek, a następnie koniec zdarzenia jest uruchamiany, gdy strumień zakończył, dzięki czemu można wyprowadzić końcowy wynik. Uważaj, że za każdym razem, gdy zadzwonisz do rejestru słuchacza, zwraca pierwotny strumień, dzięki czemu można łańcuszowe metody easily. With 0 10 jest lepszy sposób konsumowania strumieni Interfejs Readable ułatwia pracę z strumieniami, zwłaszcza strumieni, w których chcesz zrobić inne rzeczy między utworzeniem strumienia i używaniem strumienia Te nowsze strumienie odczytu to ciągi strumieniowe, w których użytkownik żąda dat gdy czytasz dla niego, a nie na dane przekazane do Ciebie. Kluczem do zrozumienia tego przykładu jest to, że dzięki nowym strumieniom2 interfejs czytelny, czytelny wydarzenie zostanie emitowane, gdy tylko dane będą dostępne do odczytu i możesz zadzwonić odczytywać jego fragmenty Kiedy już nie ma więcej danych read zwraca null, ale wtedy ponownie czytelne zdarzenie zostanie ponownie uruchomione, gdy dane są dostępne ponownie To trwa do końca pliku, gdy koniec jest wypalany jak before. Producing czytelny strumień. Aby użyj strumieni z systemu plików lub możesz użyć rdzenia fs i metod do konstruowania strumienia, ale jak utworzyć własny strumień i wypełnić go danymi Może to być dane z bazy danych lub z dowolnej liczby źródeł. Jest to przykład utworzenia czytelnego strumienia, który jest generowany z losowych danych binarnych, a następnie mieszający go jak przed To byłoby użyteczne w tworzeniu strumieni do testowania. Notataj po przeczytaniu nazywa się, powinniśmy kontynuować czytanie, dopóki nie skończymy lub dopóki push nie zwróci fa lse. Używając Streams2 ze starszymi wersjami. Jeśli chcesz, aby ten kod działał w starszym niż 0 10, możesz dołączyć do niego zależność dla czytelnego strumienia i zmienić linię 5. Użyj tego natywnego strumienia odczytu, jeśli jest to wersja 0 10, a jeśli nie, to załaduje moduł odczytu strumienia polifill i użyje go od tamtej pory. Powstrzymaj wznowienie strumienia i strumieni2.Ponieważ strumienie mogą dostarczyć danych szybciej niż aplikacja może go zużywać, strumienie zawierają możliwość wstrzymania a dane są buforowane do czasu wznowienia strumienia Przed strumieniami 2 należy zwrócić szczególną uwagę na wstrzymywanie i wznowienie metod, a także buforowanie danych, aż zostaną wznowione. Jednak odczytywalne z strumieni 2 0 10 lub za pomocą pakietu do odczytu strumieniowego można zaimplementować to funkcjonalność dla Ciebie i strumieni jest automatycznie wstrzymywana do momentu wywołania. Możesz też zawijać stare strumienie za pomocą Odczytu, aby wdrożyć nowy interfejs na starym strumieniu. Inna sytuacja, w której musisz się martwić o wstrzymanie i res ume jest, jeśli Twój zużyty kod używa starego interfejsu stylu push, wywołującego dane, który nasłuchuje strumienia w trybie kompatybilności wstecznej i musisz zadzwonić i kontrolować szybkość transmisji danych do Twojej aplikacji. Aby uzyskać szczegółowe informacje, zapoznaj się z dokumentami interfejsu Stream API używają starszego interfejsu w Twoim kodzie. Strumień strumieni. Początkowo gdy strumienie zostały wprowadzone oficjalny interfejs API wskazywał, że przesyłane strumienie danych to Buffers lub ciągi znaków, ale wielu użytkowników stwierdziło, że świetnie jest móc strumieniować obiekty oraz Streams2 w 0 10 dodano tryb obiektu do strumieni, aby sformalizować sposób działania tego typu Jeśli w trybie obiektowym czytaj n po prostu zwraca następny obiekt ignorując n. Aby przełączyć strumień w tryb obiektowy, ustaw właściwość objectMode na wartość true w opcjach używanych do utworzenia Odczytywalny strumień. Aby można używać obiektów w strumieniach równie łatwo, jak można używać buforów i ciągów znaków, ale jedynym ograniczeniem jest to, że przedmioty przechodzące nie mogą być puste, ponieważ wskaże, że e strumień został zakończony. czytelne strumienie są elastyczne i proste. czytelne strumienie są łatwe w obsłudze, a nawet proste w budowaniu Możesz nie tylko przesyłać strumienie danych binarnych i ciągowych, ale również obiektów i nadal korzystać z funkcji strumieniowych. Mam nadzieję, że podobało Ci się to szybkie zwiedzanie czytelnych strumieni, daj nam znać, jeśli masz jakieś pytania. Dla dodatkowej read. Share tej strony. Working z plikami w JavaScript, część 5 Blobs. Posted na 5 czerwca 2017 przez Nicholas C Zakas. Up do tego momentu, w tej serii postów koncentruje się na interakcji z plików określonych przez użytkownika i dostęp za pośrednictwem obiektów File Obiekt File jest w rzeczywistości bardziej specyficzną wersją Bloba, która reprezentuje fragment danych binarnych Właściwości rozmiaru i typu istnieją w obiektach typu Blob i są dziedziczone przez plik. W większości przypadków można używać plików Blob s i plików s w tym samym miejscu Na przykład możesz przeczytać z Blob używając FileReader i możesz utworzyć adres URL obiektu z Blob używając. Niektóre z ciekawych rzeczy możesz zrobić z Blob s, a zatem także File s to utworzenie nowego Blob na podstawie sub sekcja innego Ponieważ każda Blob reprezentuje raczej wskaźniki zamiast danych, można szybko tworzyć nowe obiekty typu Blob wskazujące na podczęścia innych Wykonywane jest to przy użyciu metody plasterowania. Można znać plaster na łańcuchach i tablicach, a ten dla Blob s zachowuje się w podobny sposób Metoda akceptuje trzy argumenty przesunięcia początkowego bajtu, przesunięcia końcowego bajtu i opcjonalnego typu MIME, który ma zastosowanie do Blob Jeśli nie określono typu MIME, nowy Blob ma ten sam typ MIME, co oryginalna obsługa. Browser dla plasterków nie jest jeszcze powszechny, a Firefox obsługuje go za pośrednictwem mozSlice i webkitSlice w Chrome. Żadna z przeglądarek nie obsługuje tej metody. Oto przykład. Następnie możesz użyć tej funkcji do, na przykład podzielić duży plik, aby przesłać go w kawałki Każda nowa produkcja Blob jest niezależna od oryginału, mimo że dane każdego odnośnika mają na siebie nakładanie się Inżynierowie z Flickr używają blobów do odczytywania Informacje Exif z zdjęć przesłanych 1, zamiast czekać na niego na serwerze Po wybraniu pliku, strona przesyłania Flickr jednocześnie rozpoczyna przesyłanie pliku, a także odczytuje informacje Exif z zdjęcia To pozwala na podgląd wyodrębnione metadane na stronie podczas przesyłania pliku. Creating Blobs jest starym sposobem. Wkrótce po pojawieniu się obiektów plików w przeglądarkach deweloperzy zdali sobie sprawę, że obiekty typu Blob były w rzeczywistości dość potężne, a więc chcieli móc je tworzyć bez interakcji użytkownika W końcu wszelkie dane mogą być reprezentowane w Blobu, co niekoniecznie musi wiązać się z przeglądarką plików, która szybko odpowiedziała, tworząc typ BlobBuilder, którego jedynym celem jest owinięcie niektórych danych w obiekcie Blob. Jest to niestandardowy typ i został wdrożony w Firefoksie jako MozBlobBuilder, Internet Explorer 10 jako MSBlobBuilder i Chrome jako WebKitBlobBuilder. The. BlobBuilder działa poprzez utworzenie nowej instancji i wywołanie append metho d z ciągiem, ArrayBuffer lub Blob Gdy wszystkie dane zostały dodane, zadzwonisz do getBlob i przekazasz opcjonalny typ MIME, który powinien być zastosowany do Blob Here's przykład. Zdolność do tworzenia adresów URL dla dowolnych fragmentów danych jest niesamowicie potężny, pozwalający dynamicznie tworzyć obiekty, które mogą być adresowane jako pliki w przeglądarce Można na przykład użyć Blob do tworzenia pracownika sieci Web bez osobnego pliku kodu pracownika Ta technika została opisana w Podstawy Web Pracownicy 2. Ten kod tworzy prosty skrypt, a następnie tworzy adres URL obiektu URL obiektu jest przypisywany do pracownika sieciowego w miejsce adresu URL skryptu. Możesz dołączyć dołączyć tyle razy, ile chcesz, budując zawartość Blob. Tworzenie nowych blobów. Ponieważ twórcy stale domagali się, aby utworzyć obiekty Blob bezpośrednio, a przeglądarki przechodzące z BlobBuilder postanowiono dodać konstruktora typu Blob Ten konstruktor jest teraz częścią specyfikacji i będzie sposobem, w jaki Blob objec ts są tworzone w przyszłości. Konstruktor akceptuje dwa argumenty Pierwsza jest tablica części do łączenia w blob Te byłyby tymi samymi wartościami, które zostały przekazane do metody dołączania BlobBuilder i może to być dowolna liczba ciągów znaków, Blob s i ArrayBuffer s Drugi argument to obiekt zawierający właściwości dla nowo utworzonego bloba Obecnie istnieją dwie zdefiniowane właściwości, które określają typ MIME Blob i końcówki, które mogą być albo przezroczyste, domyślne, albo natywne Poniżej przykład. widać, jest to znacznie prostsze niż użycie BlobBuilder. The konstruktor Blob jest obecnie w nocnych wersjach Chrome i będzie w Firefoksie 13 Inne przeglądarki jeszcze nie zapowiedziały planów wdrożenia tego konstruktora, ale jest teraz częścią File API 3 standardowo i ma być wdrożony uniwersalnie. Jest to ostatnia część serii w pracy z plikami w języku JavaScript. Mam nadzieję, że dowiedziałeś się, że plik API jest niewiarygodnie potężny i otwiera zupełnie nowe sposoby f Praca z plikami w aplikacjach internetowych Nie musisz już trzymać się prostych plików do przesyłania plików, gdy użytkownicy muszą przesyłać pliki, a teraz można czytać pliki w kliencie, co otwiera wiele możliwości manipulacji klientem może zmienić rozmiar obrazu, który jest zbyt duży przed przesłaniem za pomocą programu FileReader i kanału, który można utworzyć edytorze tekstu, który działa wyłącznie w przeglądarce, którą można podzielić na duże pliki, aby przesyłać kawałki po kawałku. Możliwości nie są zupełnie nieograniczone, ale są całkiem cholernie bliskie. Zrzeczenie się Wszelkie poglądy i opinie wyrażone w tym artykule są zastrzeżeniami Nicolasa C Zakasa i nie odzwierciedlają w żaden sposób moich pracodawców, moich kolegów, wydawnictwa Wrox Publishing O Reilly lub innych osób, które mówię tylko dla siebie, a nie dla nich. Ostatnie wpisy. Informacje dodatkowe. Warunki z plikami w Javie, część 1 Podstawy. Posted dnia 8 maja 2017 przez Nicholas C Zakas. Wiele lat temu zostałem zapytany podczas rozmowy kwalifikacyjnej w Google, jakie zmiany chciałbym zrobić w sieci, aby zapewnić lepsze doświadczenia Na górze mojej listy miał jakiś sposób pracy z plikami innymi niż typ pliku wejściowego kontroli Nawet jak reszta sieci ewoluowała, sposób, w jaki zajmowaliśmy się plikami nigdy się nie zmieniło, ponieważ było po raz pierwszy wprowadzony na szczęście z HTML5 i powiązanymi z nimi interfejsami API, teraz mamy znacznie więcej możliwości pracy z plikami niż kiedykolwiek w najnowszych wersjach przeglądarek desktop iOS nadal nie obsługuje File API. Typ pliku. Typ pliku jest zdefiniowany w specyfikacja pliku API 1 i jest abstrakcyjną reprezentacją pliku Każde wystąpienie pliku ma kilka właściwości. Nazwa nazwa_pliku. size rozmiar pliku w bajtach. type typ MIME dla pliku. A obiekt pliku w zasadzie daje podstawowe informacje o pliku bez zapewnienia bezpośredniego dostępu do zawartości pliku To jest ważne, ponieważ odczytywanie plików wymaga dostępu do dysku, a w zależności od rozmiaru pliku, proces ten może potrwać znaczną ilość czasu A Obiekt pliku jest tylko odwołaniem do pliku, a pobieranie danych z tego pliku jest zupełnie osobnym procesem. Pobieranie odniesień do pliku. Oczywiście, dostęp do plików użytkownika jest surowo zabroniony w internecie, ponieważ jest to bardzo oczywisty problem związany z bezpieczeństwem Nie chcielibyście załadować stronę internetową, a następnie ją skanować na dysku twardym i dowiedzieć się, co tam jest. Musisz mieć uprawnienia od użytkownika w celu uzyskania dostępu do plików z ich komputera. Nie ma potrzeby tworzenia niechlujnych okien, ponieważ użytkownicy udzielają pozwolenia stron internetowych do odczytywania plików przez cały czas, kiedy zdecydują się coś przesłać. Kiedy używasz formantu typu pliku wejściowego, podajesz stronę internetową i uprawnienia serwera do dostępu do tego pliku Więc to ma sens, że pierwsze miejsce można pobrać plik obiekty są kontrolowane przez typ pliku wejściowego. HTML5 definiuje właściwość plików dla wszystkich typów plików wejściowych Ta kolekcja to FileList, która jest strukturą tablicową nazwaną FileList zawierającą obiekty plików dla każdego wybranego pliku w kontrola zapamiętania, HTML5 pozwala na wybór wielu plików w tych kontrolkach Więc w dowolnym momencie możesz uzyskać dostęp do plików wybranych przez użytkownika za pomocą kodu podobnego do tego. Ten stosunkowo prosty kod śledzi zdarzenie zmian w kontrolce plików pożar zdarzenia, oznacza, że wybór plików został zmieniony, a kod iteruje przez każdy obiekt File i wyświetla jego informacje Pamiętaj, że właściwość plików jest zawsze dostępna z JavaScript, więc nie musisz czekać na zmiany, aby spróbować odczytywać pliki. Przechwytywanie plików z formantów formularza nadal wymaga kontroli formatu i powiązanej z użytkownikiem akcji przeglądania, aby znaleźć interesujące pliki Na szczęście HTML5 Drag and Drop 2 zapewnia kolejny sposób użytkownikom uzyskiwanie dostępu do swoich plików przez po prostu przeciągnij plik z pulpitu do przeglądarki internetowej Wszystko, co musisz zrobić, aby skorzystać z tej funkcji, słuchaj dwóch zdarzeń. Aby odczytać pliki, które zostały upuszczone na obszar strony, musisz słuchać dla zdarzeń typu "drag & wnę" i "anuluj" i anuluj domyślne działanie obu czynności Powoduje to, że przeglądarka przeinwa akcję bezpośrednio, a nie na przykład otwórz plik obrazu. Jest to kolejny obiekt FileList, do którego można uzyskać dostęp, aby uzyskać plik informacje Kod jest prawie taki sam, jak przy użyciu formantu formatu plików i obiektów File można uzyskać w ten sam sposób. Ajax plik upload. Once masz odniesienie do pliku, możesz ponownie zrobić coś, co jest całkiem fajne przesłać plik za pośrednictwem Ajax Jest to możliwe dzięki obiektowi FormData zdefiniowanemu w Poziomie 2 3 Ten obiekt reprezentuje formularz HTML i umożliwia dodawanie par klucz-wartość, które mają zostać przesłane do serwera za pomocą metody dołączania. na temat obiektu FormData można dodać plik bezpośrednio do niego, skutecznie naśladując przesyłanie plików w formacie HTML. Wystarczy dodać odniesienie do pliku o określonej nazwie, a przeglądarka robi resztę. Na przykład w formularzu FormData obiekt zostaje przekazany wysyłaj właściwe nagłówki są automatycznie ustawiane dla Ciebie Nie musisz się martwić o ustawienie poprawnego kodowania formularza podczas korzystania z plików, dzięki czemu serwer działa tak, jakby został dostarczony zwykły formularz HTML, odczytywanie danych plików z klucza foto i tekstu dane z klucza nazwy Pozwala to na swobodne zapisywanie kodu przetwarzania na zapleczu, które może z łatwością współpracować zarówno z tradycyjnymi formami HTML, jak i formami Ajax. Wszystko to działa w najnowszej wersji każdej przeglądarki, w tym w programie Internet Explorer 10. Teraz znasz dwie metody uzyskiwania dostępu do informacji o plikach w przeglądarce przez kontrolę przesyłania plików i natywne przeciąganie i upuszczanie W przyszłości będą prawdopodobnie inne sposoby na dostęp do plików, ale na razie są to dwa potrzebne do wiem Oczywiście czytanie informacji o plikach jest tylko częścią problemu Następnym krokiem są odczytywane dane z tych plików, a to, gdzie część 2. Odbierz wszelkie zastrzeżenia i opinie wyrażone w tym artykule są thos e Mikołaja C Zakasa, a nie w żaden sposób odzwierciedlają słowa mojego pracodawcy, moich kolegów, wydawnictwa Wrox Publishing O Reilly Publishing lub inne osoby, z którymi mówię tylko dla siebie, a nie dla nich. Najczęstsze posty. Dodatkowe informacje.
No comments:
Post a Comment