Odpowiedzi:
możesz przekonwertować obraz na kod base-64, na przykład za pomocą „ http://duri.me/ ” i skopiować wynik do przeglądarki! Lubić:
<img width='16' height='16' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAApklEQVQ4jWP8//8/Ay5Q4s6GU7Jn5y9GBgYGBiacuokELKTYSpQByKB68UkMMUExQ0ZkPsVeYEQPREZGRpK8gOGCdy/PwTEyH8ZGF8MbBgwMDAxC4kZ4xfAaALMFGfz//5+6gYjXBS+fXUHhaxjEMqKrQXGBglU8SgyIS+mgYHR5DAPIAYz////HavL5DQVwtmHABAyND44tZGRgwBMG2DRhAxR7AQBhgT3yD6eBRwAAAABJRU5ErkJggg=='>
Ponieważ wspomniałeś o „Chrome”, możesz użyć do tego rozszerzeń Chrome, aby umożliwić lokalny dostęp do swoich plików.
Wykonaj następujące kroki:
1) W lokalnym folderze, w którym znajdują się Twoje obrazy, utwórz ten plik o nazwie „manifest.json” i wprowadź go:
{
"name": "File Exposer",
"manifest_version": 2,
"version": "1.0",
"web_accessible_resources": ["*.jpg","*.JPG"]
}
2) Umieść to jest chromowany pasek adresu: chrome: // extensions /
3) Upewnij się, że zaznaczono „Tryb programisty” (prawy górny róg strony)
4) Kliknij przycisk „Load Unpacked Extension”
5) Przejdź do lokalnego folderu, w którym znajdują się obrazy i plik manifest.json, kliknij OK
6) Rozszerzenie „File Exposer” powinno być teraz wymienione na liście i mieć zaznaczone pole wyboru „Enabled”. Jeśli folder znajduje się na dysku sieciowym lub innym wolnym dysku lub zawiera wiele plików, pojawienie się na liście może potrwać 10–20 sekund lub dłużej.
7) Zwróć uwagę na ciąg „ID”, który został powiązany z twoim rozszerzeniem. To jest EXTENSION_ID
8) Teraz w swoim HTML możesz uzyskać dostęp do pliku w następujący sposób, zmieniając „EXTERNSION_ID” na dowolny identyfikator wygenerowany przez twoje rozszerzenie:
<img src='chrome-extension://EXTENSION_ID/example1.jpg'>
Zauważ, że * .jpg jest rekurencyjny i automatycznie dopasuje pliki w określonym folderze i wszystkich podfolderach, nie musisz określać dla każdego podfolderu. Zwróć też uwagę na wielkość liter.
W znaczniku „img” nie określasz oryginalnego folderu, jego krewnego z tego folderu, więc należy podać tylko podfoldery.
Jeśli zmodyfikujesz plik manifest.json, musisz kliknąć link „Załaduj ponownie (Ctrl + R)” obok rozszerzenia.
Nielokalne strony internetowe nie mają dostępu do lokalnych plików w Chrome ani żadnej nowoczesnej przeglądarce internetowej.
Możesz to zmienić za pomocą LocalLinks ( dla Firefoksa ), ale będzie działać tylko na twoim komputerze.
about:blank
stronie i nie pozwalałem na to, zmęczony otworzyłem lokalny plik HTML i zadziałało, nawet w przypadku obrazów pomimo tego, co powiedział @ WillemD'Haeseleer. Mój kod był następujący:drawing = new Image(); drawing.src = "C:/Users/S/Videos/net.png";
w Chrome wygląda to tak
file:///C:/sample.txt
Jeśli chcesz przetestować lokalny obraz na stronie na żywo, możesz uruchomić lokalny serwer WWW i ustawić URL taki jak http://127.0.0.1:8123/img.jpg na stronie za pomocą DevTools
Istnieją różne sposoby uruchamiania serwera internetowego: 1. Rozszerzenie przeglądarki „Serwer WWW dla Chrome” ze zdefiniowanym folderem https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb
Jeśli masz Python, uruchom wbudowany serwer HTTP w wybranym folderze
python3 -m http.server 8123 # wersja
python 3 python -m SimpleHTTPServer 8123 # wersja python 2
Użyj serwera gotowego do produkcji, takiego jak Nginx , Apache
W moim przypadku musiałem tylko zobaczyć, jak będzie wyglądać jedna mała zmiana obrazu w różnych elastycznych rozmiarach. Najłatwiej było zapisać jako ... kompletną stronę na pulpicie, a następnie otworzyć ją. Sprawdzam i edytuję obraz src.
Okej, nie możesz po prostu pozwolić komuś innemu uzyskać dostęp do twojego lokalnego systemu plików! Potrzebujesz usługi serwera, takiej jak Apache, pozwól, aby komputer działał 24 godziny na dobę, upewnij się, że się nie przegrzeje, zadbaj o dobre bezpieczeństwo i wiele więcej, aby to w ogóle możliwe. A ponieważ administracja serwerami jest kosztowna i czasochłonna, większość ludzi pozwala profesjonalistom hostować nasze rzeczy dla nas (Webhosting).
Podsumowując, jeśli nie chcesz uruchamiać własnego serwera, o wiele łatwiej jest po prostu przesłać go do wybranego webhostera.