To ciekawe, jak niektóre rzeczy zatoczyły koło. We wczesnych latach istnienia Internetu przeglądarki automatycznie pobierały łącza do plików, które nie były stronami internetowymi, takich jak obrazy, pliki PDF i dokumenty. Następnie przeglądarki stały się tak zaawansowane, że były w stanie otworzyć prawie każdy plik w czasie rzeczywistym. Stworzyło to jednak problem dla programistów. Jak zmusisz przeglądarkę do pobrania pliku, zamiast go otwierać? Pojawiło się kilka hacków i obejść, aby rozwiązać problem, ale żadne nie było prawdziwym rozwiązaniem. Wszystko zmieniło się w HTML5, gdy Pobierz atrybut został wprowadzony.
Teraz programiści mogą dodać specjalny atrybut pobierania do swoich znaczników kotwicy HTML, aby powiedzieć przeglądarkom, aby traktowały łącze jako pobieranie zamiast otwierania pliku docelowego. Istnieje kilka różnych sposobów korzystania z atrybutu pobierania do kontrolowania sposobu, w jaki przeglądarki obsługują łącza pobierania. Co więcej, wszystkie nowoczesne przeglądarki obsługują atrybut pobierania, więc nie powinieneś widzieć żadnych problemów z kompatybilnością ani potrzebą rezerwy.
Istnieje kilka różnych sposobów obsługi atrybutu pobierania. Każdy ma swoje zalety i wszystkie działają płynnie w różnych przeglądarkach.
Atrybut zwykłego pobierania
Najprostszym sposobem użycia atrybutu pobierania jest umieszczenie go w najbardziej podstawowej formie w tagach kotwicy. Nie musisz podawać dodatkowej nazwy pliku ani żadnych dodatkowych informacji. Wynik wygląda następująco:
<a href="/path/to/download.pdf" download> Pobierz teraz! </a>
Włączając „pobieranie”, mówisz dowolnej przeglądarce czytającej stronę, aby zamiast otwierania ją pobrać docelowy link. W tym przypadku przeglądarka pobierze plik dokładnie w takiej postaci, w jakiej jest o tej samej nazwie.
Zmiana nazwy pliku
Co się stanie, jeśli rzeczywiście zechcesz zmienić nazwę. Jest wiele okazji, w których chciałbyś to zrobić. Dobrym przykładem są automatycznie generowane nazwy plików. Zwykle mają śmiesznie długie nazwy z ciągami śmieciowych znaków. To nie jest doświadczenie, którego oczekujesz od swoich gości. Możesz ustandaryzować rzeczy za pomocą atrybutu pobierania.
Aby określić nazwę pliku, ustaw atrybut pobierania na taką samą wartość. Wyklucz rozszerzenie pliku. Przeglądarka nie może i nie chce przekonwertować typu pliku, więc nie ma sensu próbować.
<a href="/path/to/download.pdf" download="your-file"> Pobierz teraz! </a>
Twoi goście pobiorą plik jako twój-plik.pdf.
Pobieranie obrazu
Wraz z tym pojawia się uproszczony sposób, aby umożliwić użytkownikom bezpośrednie pobieranie obrazów. Nie jest to rewolucyjne i prawdopodobnie możesz je złożyć samodzielnie, ale możesz użyć atrybutu download, aby utworzyć link do obrazu do pobrania.
Zacznij od ustawienia obrazu tak, jak zwykle na swojej stronie. Będzie to oczywiście obraz dostępny do pobrania.
<img src = "/ path / to / image.jpg" alt = "my image">
Następnie umieść całość w tagu kotwicy, łączącym się ze ścieżką obrazu.
<a href="/path/to/image.jpg">
<img src = "/ path / to / image.jpg" alt = "my image">
</a>
Na koniec dodaj atrybut pobierania do tagu kotwicy. Jeśli chcesz, możesz zmienić nazwę swojego obrazu.
<a href="/path/to/image.jpg" download="image-download">
<img src = "/ path / to / image.jpg" alt = "my image">
</a>
Teraz, gdy użytkownik kliknie obraz, automatycznie pobierze go bezpośrednio z Twojego serwera. Nie jest to konieczne i może wydawać się przesadą dla programisty, ale ilu odwiedzających witrynę pomyślałoby o kliknięciu obrazu prawym przyciskiem myszy, aby go wyświetlić lub pobrać?