Udostępniaj strony internetowe jako jeden plik przez Bluetooth i uruchamiaj je offline w kontekście źródła
Zgrupowanie całej witryny w jednym pliku i udostępnienie jej otwiera nowe przypadki użycia w internecie. Wyobraź sobie świat, w którym możesz:
- Twórz własne treści i rozpowszechniaj je na różne sposoby, nie ograniczając się do sieci.
- Udostępnianie aplikacji lub treści z internetu znajomym przez Bluetooth lub Wi-Fi Direct
- Noś swoją witrynę na własnym dysku USB lub nawet hostuj ją we własnej sieci lokalnej
Interfejs Web Bundle API to najnowocześniejsze rozwiązanie, które pozwala Ci na to wszystko.
Zgodność z przeglądarką
Interfejs Web Bundle API jest obecnie obsługiwany tylko w przeglądarkach opartych na Chromium z flagą eksperymentalną.
Przedstawiamy interfejs Web Bundle API
Pakiet internetowy to format pliku służący do umieszczania w jednym pliku danych o zasobach HTTP. Może zawierać jeden lub więcej plików HTML, JavaScript, obrazów lub arkuszy stylów.
Pakiety internetowe, inaczej nazywane pakietami Exchange HTTP, wchodzą w skład oferty Pakietów internetowych.
Zasoby HTTP w pakiecie Web Bundle są indeksowane według adresów URL żądań i opcjonalnie mogą mieć podpisy, które potwierdzają działanie zasobów. Podpisy umożliwiają przeglądarkom rozpoznawanie i weryfikowanie pochodzenia poszczególnych zasobów oraz traktowanie każdego z nich jako pochodzącego z prawdziwego pochodzenia. Ta zasada jest podobna do obsługi podpisanych giełd HTTP, funkcji służącej do podpisywania pojedynczego zasobu HTTP.
W tym artykule opisujemy, czym jest pakiet internetowy i jak z niego korzystać.
Omówienie pakietów internetowych
Pakiet Web Bundle to plik CBOR z rozszerzeniem .wbn
(zgodnie z konwencją), który tworzy pakiet zasobów HTTP do formatu binarnego i jest udostępniany z typem MIME application/webbundle
. Więcej informacji na ten temat znajdziesz w sekcji Struktura najwyższego poziomu w wersji roboczej specyfikacji.
Pakiety internetowe mają wiele unikalnych funkcji:
- Zawiera wiele stron, co umożliwia zgrupowanie całej witryny w jeden plik.
- Włącza wykonywalny kod JavaScript, w przeciwieństwie do MHTML
- Wykorzystuje warianty HTTP do negocjowania treści, co umożliwia internacjonalizację za pomocą nagłówka
Accept-Language
, nawet jeśli pakiet jest używany offline. - Ładuje się w kontekście swojego pochodzenia po podpisaniu kryptograficznie przez wydawcę
- Ładuje się niemal natychmiast, gdy jest wyświetlany lokalnie
Te funkcje przydają się w różnych scenariuszach. Jednym z typowych scenariuszy jest tworzenie samodzielnej aplikacji internetowej, którą można łatwo udostępnić i korzystać z niej bez połączenia z internetem. Załóżmy na przykład, że jedziesz razem ze znajomymi w samolocie z Tokio do San Francisco. Nie lubisz rozrywki podczas lotu. Twój znajomy gra w ciekawą grę internetową PROXX i mówi Ci, że przed wejściem na pokład samolotu pobrał ją jako pakiet internetowy. Działa bez problemów offline. Przed pakietami Web Bundles historia się kończyła i trzeba było grać w grę na zmianę na urządzeniu znajomego lub znaleźć coś innego, co miło spędza czas. Oto, co możesz teraz zrobić dzięki pakietom internetowym:
- Poproś znajomego o udostępnienie pliku
.wbn
z grą. Taki plik można na przykład łatwo udostępnić metodą peer-to-peer za pomocą aplikacji do udostępniania plików. - Otwórz plik
.wbn
w przeglądarce, która obsługuje pakiety internetowe. - Zacznij grać na własnym urządzeniu i spróbuj pobić rekord znajomego.
Oto film, który wyjaśnia tę sytuację.
Jak widać, pakiet internetowy może zawierać wszystkie zasoby, dzięki czemu może on działać w trybie offline i od razu się ładować.
Tworzenie pakietów internetowych
Interfejs wiersza poleceń go/bundle
jest obecnie najprostszym sposobem łączenia witryny w pakiety. go/bundle
to referencyjna implementacja specyfikacji pakietów internetowych utworzonej w Go.
- Zainstaluj Go
Zainstaluj aplikację
go/bundle
.go get -u github.com/WICG/webpackage/go/bundle/cmd/...
Skopiuj repozytorium preact-todomvc i utwórz aplikację internetową, aby przygotować się do pakietu zasobów.
git clone https://github.com/developit/preact-todomvc.git cd preact-todomvc npm i npm run build
Do utworzenia pliku
.wbn
użyj poleceniagen-bundle
.gen-bundle -dir build -baseURL https://preact-todom.vc/ -primaryURL https://preact-todom.vc/ -o todomvc.wbn
Gratulacje! TodoMVC to teraz pakiet internetowy.
Dostępne są też inne opcje grupowania, a wkrótce wprowadzimy kolejne. Interfejs wiersza poleceń go/bundle
pozwala utworzyć pakiet internetowy przy użyciu pliku HAR lub niestandardowej listy adresów URL zasobów. Odwiedź repozytorium GitHub, aby dowiedzieć się więcej o funkcji go/bundle
. Możesz też wypróbować eksperymentalny moduł Node.js do grupowania: wbn
. Pamiętaj, że usługa wbn
jest wciąż na wczesnym etapie rozwoju.
Różne pakiety internetowe
Aby wypróbować pakiet internetowy:
- Otwórz
about://version
, aby sprawdzić, jakiej wersji Chrome używasz. Jeśli używasz wersji 80 lub nowszej, pomiń następny krok. - Jeśli nie korzystasz z Chrome w wersji 80 lub nowszej, pobierz Chrome Canary.
- Otwórz pokój
about://flags/#web-bundles
. Ustaw flagę Pakiety internetowe na Włączone.
Uruchom ponownie Chrome.
Przeciągnij plik
todomvc.wbn
i upuść go w Chrome, jeśli korzystasz z komputera, lub kliknij go w aplikacji do zarządzania plikami, jeśli używasz urządzenia z Androidem.
Wszystko działa magicznie.
Możesz też wypróbować inne przykładowe pakiety internetowe:
- web.dev.wbn to zrzut całej witryny web.dev (stan na 15 października 2019 r.).
- proxx.wbn: PROXX to klon Sapera, który działa offline.
- squoosh.wbn: Squoosh to wygodne i szybkie narzędzie do optymalizacji obrazów, które umożliwia bezpośrednie porównanie różnych formatów kompresji obrazów, a także obsługę zmiany rozmiaru i konwersji formatu.
Prześlij opinię
Implementacja interfejsu Web Bundle API w Chrome jest w fazie eksperymentalnej i nie została ukończona. Nie wszystko działa, może też ulec awarii lub awarii. To dlatego kryje się za tym eksperymentem. Interfejs API jest jednak gotowy i możesz zacząć go używać w Chrome. Opinie programistów stron internetowych mają kluczowe znaczenie dla wyglądu nowych interfejsów API, więc warto je wypróbować i powiedzieć osobom pracującym nad pakietami Web Bundle, co o nich myślisz.
- Wyślij ogólną opinię na adres webpackage-dev@chromium.org.
- Jeśli chcesz przesłać opinię na temat specyfikacji, odwiedź stronę https://github.com/WICG/webpackage/issues/new, aby zgłosić nowy problem ze specyfikacją, lub wyślij e-maila na adres wpack@ietf.org.
- Jeśli zauważysz problemy z działaniem Chrome, wejdź na https://crbug.com/new, by zgłosić błąd Chromium.
- Zachęcamy też do udziału w dyskusjach na temat specyfikacji i tworzeniu narzędzi. Jeśli chcesz wziąć udział w tym wydarzeniu, odwiedź repozytorium ze specyfikacją.
Podziękowania
Chcemy szczerze podziękować niesamowitemu zespołowi inżynierów Chrome: Kunihiko Sakamoto, Tsuyoshi Horo, Takashi Toyoshima, Kinuko Yasuda i Jeffreya Yasskina, którzy pracowali nad specyfikacją, rozbudowując tę funkcję w wersji Canary i sprawdzając ten artykuł. W procesie standaryzacji Dan York pomógł w przeprowadzeniu dyskusji w ramach IETF, a także Dave Cramer był doskonałym źródłem informacji na temat tego, czego wydawcy faktycznie potrzebują. Chcemy również podziękować Jasonowi Millerowi za wspaniałą preakcję todomvc i jego nieustające wysiłki w zakresie ulepszania platformy.