Wie werden lokale Bilder in Chrome mithilfe des Protokolls file: // angezeigt?

69054
JSH

Ich möchte in der Lage sein, einen lokalen Dateipfad für ein Bild auf einer über http mithilfe von Chrome gelieferten Webseite anzugeben. Ist dies möglich?

Ich erinnere mich daran, das mit IE gemacht zu haben, aber ich kann mich nicht erinnern, wie! Einige vertrauenswürdige Einstellungen denke ich ...

19

7 Antworten auf die Frage

12
Diogo Cid

Sie können das Bild in Base-64-Code konvertieren, beispielsweise mit " http://duri.me/ " und das Ergebnis in den Browser kopieren! Mögen:

<img width='16' height='16' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAApklEQVQ4jWP8//8/Ay5Q4s6GU7Jn5y9GBgYGBiacuokELKTYSpQByKB68UkMMUExQ0ZkPsVeYEQPREZGRpK8gOGCdy/PwTEyH8ZGF8MbBgwMDAxC4kZ4xfAaALMFGfz//5+6gYjXBS+fXUHhaxjEMqKrQXGBglU8SgyIS+mgYHR5DAPIAYz////HavL5DQVwtmHABAyND44tZGRgwBMG2DRhAxR7AQBhgT3yD6eBRwAAAABJRU5ErkJggg=='> 
Diese Informationen können für jemanden von Nutzen sein, aber ich denke, dass sie diese Frage nicht wirklich beantworten. G-Man vor 9 Jahren 4
9
Rob Donovan

Da Sie "Chrome" erwähnt haben, können Sie dazu Chrome-Erweiterungen verwenden, um den lokalen Zugriff auf Ihre Dateien zu ermöglichen.

Folge diesen Schritten:

1) Erstellen Sie im lokalen Ordner, in dem sich Ihre Bilder befinden, diese Datei mit dem Namen 'manifest.json' und geben Sie Folgendes ein:

{ "name": "File Exposer", "manifest_version": 2, "version": "1.0", "web_accessible_resources": ["*.jpg","*.JPG"] } 

2) Setzen Sie hier Ihre Chrom-Adressleiste: Chrom: // Erweiterungen /

3) Stellen Sie sicher, dass "Entwicklermodus" aktiviert ist (oben rechts auf der Seite).

4) Klicken Sie auf die Schaltfläche 'Unpacked Extension laden'

5) Navigieren Sie zu dem lokalen Ordner, in dem sich die Bilder und die Datei manifest.json befinden, und klicken Sie auf OK

6) Die Erweiterung 'File Exposer' sollte jetzt in der Liste aufgeführt sein und ein Häkchen bei 'Aktiviert' haben. Wenn sich der Ordner auf einem Netzlaufwerk oder einem anderen langsamen Laufwerk befindet oder viele Dateien enthält, kann es 10 bis 20 Sekunden dauern, bis er in der Liste angezeigt wird.

7) Notieren Sie sich die 'ID'-Zeichenfolge, die Ihrer Erweiterung zugeordnet wurde. Dies ist die EXTENSION_ID

8) Nun können Sie in Ihrem HTML-Code auf die Datei mit den folgenden Optionen zugreifen und die 'EXTERNSION_ID' in die von Ihrer Erweiterung generierte ID ändern:

<img src='chrome-extension://EXTENSION_ID/example1.jpg'> 

Beachten Sie, dass das * .jpg rekursiv ist und automatisch Dateien im angegebenen Ordner und in allen Unterordnern übereinstimmt, die Sie nicht für jeden Unterordner angeben müssen. Beachten Sie auch die Groß- und Kleinschreibung.

Im 'img'-Tag geben Sie nicht den ursprünglichen Ordner an, sondern den relativen Ordner dieses Ordners. Daher müssen nur Unterordner angegeben werden.

Wenn Sie die Datei manifest.json ändern, müssen Sie neben der Erweiterung auf den Link 'Reload (Ctrl + R)' klicken.

6
grawity

Nicht-lokale Webseiten können nicht auf lokale Dateien in Chrome oder einen modernen Webbrowser zugreifen .

Sie können dies mithilfe von LocalLinks ( für Firefox ) überschreiben, dies funktioniert jedoch nur auf Ihrem eigenen Computer.

funktioniert nicht für Bilder Willem D'Haeseleer vor 11 Jahren 2
2
KutscheraIT

In Chrome sieht das so aus

file:///C:/sample.txt 
Ich mache so etwas, gehostet im Web, sehe mir aber die lokalen Dateien eines Benutzers an .... Beispiel

Herzlich willkommen

Hallo Welt!

JSH vor 13 Jahren 0
Ich habe gerade versucht, .html und .jpg-Dateien mit der Datei: /// -Notation, beide wurden richtig gerendert. Könnten Sie einen Screenshot mit der Adressleiste und einigen Inhalten posten? KutscheraIT vor 13 Jahren 1
Probieren Sie http://jsh.learningict.net/ aus - natürlich das Bild, das Sie nicht haben werden, aber der Code zeigt Ihnen eine Vorstellung davon, wonach ich strebe JSH vor 13 Jahren 0
Ich kann nur vermuten, dass Sie sich auf das Image-Tag beziehen, was auch gut funktioniert, wenn ich src durch c: \ test.jpg ersetze. Dies ist ein gültiges jpg in diesem Pfad und zeigt gut. KutscheraIT vor 13 Jahren 0
frage mich, ob es dann eine osx-sache ist? Der src ref funktioniert gut alleine in der Adressleiste von Chrome, nur nicht im HTML-Code JSH vor 13 Jahren 0
Verwenden Sie im HTML-Code Folgendes. , es braucht nicht "file: ///", um das Bild zu finden, dh, der Browser behandelt den Ort des Bildes, HTML anders. paradd0x vor 13 Jahren 0
@Thiago, OS X hat kein C: \ ... grawity vor 12 Jahren 0
Das Präfix der URL mit "file: ///" hat mir geholfen. Vielen Dank! Aimal Khan vor 6 Jahren 0
2
koxt

Wenn Sie ein lokales Image auf der Live-Site testen möchten, können Sie einen lokalen Webserver ausführen und die URL mithilfe von DevTools auf der Seite http://127.0.0.1:8123/img.jpg festlegen

Es gibt verschiedene Möglichkeiten, einen Webserver auszuführen: 1. Erweiterung für den Browser "Webserver für Chrome" mit definiertem Ordner https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb

  1. Wenn Sie über Python verfügen, führen Sie den eingebetteten http-Server im ausgewählten Ordner aus

    python3 -m http.server 8123 # Python 3-Version
    Python -m SimpleHTTPServer 8123 # Python 2-Version

  2. Verwenden Sie produktionsfertige Server wie Nginx, Apache

0
changokun

In meinem Fall musste ich nur sehen, wie eine kleine Bildänderung in verschiedenen Antwortgrößen aussehen würde. Es war am einfachsten, als eine komplette Webseite auf dem Desktop zu speichern und diese stattdessen zu öffnen. Ich inspiziere und bearbeite das Bild src.

Das scheint überhaupt nicht das zu sein, was OP gefragt hat, nicht einmal verwandt. Bitte lesen Sie die Fragen sorgfältig durch und beantworten oder kommentieren Sie sie nur, wenn Sie relevante Informationen hinzufügen. music2myear vor 6 Jahren 0
Aber es war, wonach ich gesucht hatte Samuel Thompson vor 5 Jahren 1
-1
user759576

Okay, Sie können nicht zulassen, dass jemand anderes auf Ihr lokales Dateisystem zugreift! Sie benötigen einen Server-Dienst wie Apache, lassen Ihren Computer 24 Stunden am Tag laufen, sorgen Sie dafür, dass er nicht überhitzt, sorgen Sie für gute Sicherheit und vieles mehr, um dies zu ermöglichen. Und weil die Server-Administration teuer und zeitaufwändig ist, lassen die meisten Leute den Pro-Host für uns arbeiten (Webhosting).

Fazit: Wenn Sie keinen eigenen Server betreiben möchten, ist es viel einfacher, ihn einfach auf den gewünschten Webhoster hochzuladen.

Es geht nicht darum, das Internet im großen Umfang auf Dateien auf dem lokalen System zugreifen zu lassen. xenoid vor 6 Jahren 1