Proxtx: Problem mit der Vorschau von Input type="File"

SELF-Forum

Problem mit der Vorschau von Input type="File"

Proxtx (Versionen)
– Informationen zu den Bewertungsregeln

Hallo ich möchte das der Benutzer eine Datei von seinem Gerät auswählen kann und dann eine kleine Vorschau bekommt:

<!DOCTYPE = html>
<html>
<head>
	<title>Test</title>
	<link rel="stylesheet" href="style.css">
</head>
<script src="main.js">
</script>
<body>
	<img src="">
	<input id="Hallo" type="file" name="PIC" onchange="document.images[0].src=this.value">
	<button onclick="alert(document.getElementById('Hallo').value)">
		Hallo
	</button>
</body>
</html>

leider bekomme ich (bis her nur auf Android getestet (Chrome, Firefox)) als Antwort nur C:\fakepath\oct.jpg aber wieso fakepath?

Fakepath steht da 1:1 ist das bei euch auch so?

LG Proxtx

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Problem mit der Vorschau von Input type="File"

    Matthias Apsel Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo Proxtx,

    <!DOCTYPE = html>

    Der Doctype ist falsch.

    aber wieso fakepath?

    Einige Browser haben eine Sicherheitsfunktion, die Javascript daran hindert, den vollen Pfad zu erkennen. Diese Sicherheitsfunktion verhindert, dass externe Server das Dateisystems Ihres lokalen Computers erkennen können. Wäre super, wenn das alle Browser so handhaben würden.

    Bis demnächst
    Matthias

    --
    Pantoffeltierchen haben keine Hobbys.
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Problem mit der Vorschau von Input type="File"

      Proxtx (Versionen)
      – Informationen zu den Bewertungsregeln

      Gibt es denn eine andere Möglichkeit weil sonst ist es doch ganz unmöglich eine Vorschau zu erstellen ohne reload?❓

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Problem mit der Vorschau von Input type="File"

        Matthias Apsel Homepage des Autors (Versionen)
        – Informationen zu den Bewertungsregeln

        Hallo Proxtx,

        Gibt es denn eine andere Möglichkeit weil sonst ist es doch ganz unmöglich eine Datei hochzuladen

        Trotz des falsch angezeigten Pfads wird die Datei jedoch korrekt hochgeladen.

        oder eine Vorschau zu erstellen?

        Du kannst mMN. im Browser nur die hochgeladene Datei als Vorschau anzeigen.

        EDIT: https://code.i-harness.com/de/q/440b73

        Bis demnächst
        Matthias

        --
        Pantoffeltierchen haben keine Hobbys.
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

      2. Problem mit der Vorschau von Input type="File"

        TS Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Hello,

        Gibt es denn eine andere Möglichkeit weil sonst ist es doch ganz unmöglich eine Vorschau zu erstellen ohne reload?

        Doch gibt es. Siehe hier.

        Müssen wir in unserem Wiki auch mal ergänzen...

        Glück Auf
        Tom vom Berg

        --
        Es gibt nichts Gutes, außer man tut es!
        Das Leben selbst ist der Sinn.
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. Problem mit der Vorschau von Input type="File"

          Matthias Apsel Homepage des Autors
          – Informationen zu den Bewertungsregeln

          Hallo TS,

          Müssen wir in unserem Wiki auch mal ergänzen...

          Nö. https://wiki.selfhtml.org/wiki/JavaScript/File_Upload#Auswahl_mit_Bildvorschau

          Bis demnächst
          Matthias

          --
          Pantoffeltierchen haben keine Hobbys.
          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

  2. Problem mit der Vorschau von Input type="File"

    pl Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo ich möchte das der Benutzer eine Datei von seinem Gerät auswählen kann und dann eine kleine Vorschau bekommt:

    Kein Problem. Du kriegst per FileAPI::files jede eingefügte Datei, nimmst die und erstellst über URL einen BlobURL.

    Und je nach Type weist Du den BlobURL entweder an <img> oder </object> dann hast Du die Vorschau noch bevor der Anwender die Dateien hochlädt.

    .

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln