Fileupload via File Dialog im Browser

K

KarlPichler

Mitglied
Hallo liebes Forum,

Hab wieder mal ne Frage!
Ich möchte gerne eine File Upload programmieren.

Der sollte wie folgt aussehen:

Wenn ich den "Browse" Button drücke, öffnet sich ein FileOpenDialog. Darin kann ich mehrere Datein auswählen.

Möchte auf jeden Fall mehrere Datein auswählen können!

Diese Dateien sollen danach auf einen FTP Server hochgeladen werden. Wünschenswert wäre eine progressBar dazu, und das ganze im Browser.

So wie der Bilderupload bei beispielsweise Facebook.
Ich hab allerdings keine Ahnung wie ich das machen kann, nicht einmal wie ich anfangen sollte. PHP, Java, keine Ahnung.

Gibt es für so etwas eine Art tuorial, oder etwas vorgefertigtes?
Bitte um Hilfe! Danke im Vorraus!


Lg
 
Mit HTML alleine geht das was Du willst schonmal nicht. HTML stellt einzig das Dateiupload-Feld zur Verfügung.

HTML: 
<input type="file" name="datei">

Damit kann man jedoch in den meisten Browsern nur eine einzige Datei hochladen. Erst HTML5 unterstützt auch die Auswahl mehrerer Dateien, was aber nur von wenigen Browsern unterstützt wird. Siehe:
http://dojotoolkit.org/documentation/tutorials/1.6/uploader/

Das Speichern wie auch ein Fortschrittsbalken musst Du mit einer Webprogrammiersprache realisieren. Weit verbreitet ist dafür PHP wo im Handbuch bereits die Grundlagen zum Speichern von Dateien beim Hochladen erklärt werden:
http://www.php.net/manual/de/features.file-upload.php
 
Leider ist eine Fortschrittsbalken so ohne weiteres nicht mit PHP möglich, da es weder die Möglichkeit gibt zu ermitteln, wie PHP seine temporären Dateien nennt, noch per PHP abzufragen, wie weit eine Datei bereits hochgeladen wurde. Letzteres liegt daran, dass erst die Datei hochgeladen wird und dann PHP ausgeführt wird. Theoretisch könntest du aber per AJAX zeitgleich mit Beginn des Hochladens eine Anfrage an ein weiteres PHP-Skript schicken, dass dann einen Abgleich aller temporärer Dateien macht samt Zeitstempel. Daraus kann man dann den (vermutlichen) Namen der temporären Datei ermitteln und somit schauen, wie groß die Datei ist. Leider kann man daraus keinen Prozentsatz ermitteln, da man zu der Zeit noch nicht weiß, wie groß die Datei insgesamt ist.

Ansonsten gibt es auch schon vor HTML5 die Möglichkeit mehrere Dateien gleichzeitig hochzuladen, in dem man per Javascript weitere Auswahlflächen ermittelt. Die Dateien kann man dann auch per AJAX (nein, es sieht nur so aus, aber eigentlich wird es in Frames hochgeladen) hochladen, ohne das ein Neuladen der gesamten Seite nötig ist.
 
Hallo, erstmal danke für die Antworten!

ist mir alles bekannt was ihr hier geschrieben habt. Einzelne Datein mit PHP hochzuladen ist ja kein problem. und mit html5 ist auch das file auswählen nicht das problem.

ich erklär meine frage nochmals: mit was programmiert man den sowas? brauch ich JSP oder gibt es in C# irgendwas, ich habe eben keine Ahnung wie ich anfangen soll und vor allem mit was. ich habe mit java, c# erfahrung, allerdings weis ich nicht wie ich ein web-plugin programmiere.

gibt es vl. irgendetwas vorgefertigtes im web?
oder habt ihr ein beispiel? oder einen link?


Lg
 
Es kommt weniger auf die Programmiersprache selbst an. Wenn der Fortschrittsbalken den tatsächlichen Stand des Hochladens repräsentieren soll, dann muss der Webserver selbst es ermöglichen die bereits bei einem Upload übertragene Datenmenge zu ermitteln. Die Daten werden ja über HTTP übertragen und sind erst komplett dem Server bekannt, wenn alles hochgeladen ist - grob gesagt.

Such mal nach "apache upload progress", da gibt es einiges dazu, auch Apache-Module glaube ich die das unterstützen. Die dabei ermittelten Werte musst Du "nur" noch mit einer Programmiersprache deiner Wahl auslesen (PHP reicht da aus, ich habe auch schon Perl dabei gesehen) und so die Ausgabe in der Webseite steuern.
 
okay danke, bezieht sich aber alles auf die progress bar.

die prgress bar ist im moment zweitrangig!

wichtig ist mir wie ich die Daten auf den server bekomm, ohne timeout, sowie es in PHP mit der POST methode der fall ist.
PHP mit FTP upload oder so, aber keinen Dunst wie.

auserdem weis ich nicht wie das input feld so programmiere das der user mehrere Dateien gleichzeitg auswählen kann, auser natürlich in HTML 5, welches ja wie schon erwähnt nicht in jedem browser funktioniert.

ich hoffe ich habe meine frage richtig formuliert.

beim googlen bin ich auf folgendes gestoßen: http://www.pixlie.de/willkommen
habs aber noch nicht ausprobiert!

Lg
 
einfach nur crack hat gesagt.:
Leider ist eine Fortschrittsbalken so ohne weiteres nicht mit PHP möglich, da es weder die Möglichkeit gibt zu ermitteln, wie PHP seine temporären Dateien nennt, noch per PHP abzufragen, wie weit eine Datei bereits hochgeladen wurde.
Zum Vergrößern anklicken....

Es gibt anscheinend doch eine Möglichkeit mit HTML 5 und der File API. Zumindest habe ich das aus der letzten Spezifikation entnommen: http://www.w3.org/TR/FileAPI/#dfn-loadend-event.


auserdem weis ich nicht wie das input feld so programmiere das der user mehrere Dateien gleichzeitg auswählen kann, auser natürlich in HTML 5, welches ja wie schon erwähnt nicht in jedem browser funktioniert.
Zum Vergrößern anklicken....
Mit JavaScript: http://jsfiddle.net/WMqrN/ oder habe ich dich falsch verstanden?
 
Hallo, danke für die antwort!
Am ja aber bei deinem JS Bsp, kann ich wieder nur eine datei auswählen!
Ich hätte aber gerne die Function wie im Windows Explorer, das ich mehrere Elemente markieren kann und dann mit dem Klck "Hinzufügen" alle ausgewählten Dateien auf den FTP Server ladet!

Sowie wenn ich bei Picasa eine neue Gallerie hinzufüge. Da muss ich auch nicht jedes Bild einzeln auswählen und hinzufügen, sondern ich markiere die Fotos die ich möcht und lade sie mit einem Schlag rauf.

Sollte das Input feld "problem" gelöst sein, frage ich mich noch immer wie ich diese Datein dann hochlade! Ich weis nicht einmal nach was ich googeln soll! ^^


Lg
 
HTML5 soll 2014 fertig sein, wurde aber vor kurzer Zeit als Last Call gekennzeichnet, was bedeutet, dass HTML5 eigentlich de facto schon vollständig ist bis auf wenige Details. Du solltest es also ohne Sorgen nutzen können und allen Nutzern mit zu altem Browser ein Fenster vor die Birne werfen, dass sie sich gefälligst mal einen zeitgemäßen Browser installieren sollen. Wenn man immer nur auf die achtet, die man vielleicht noch auf irgendwelchen Umwegen unterstützen könnte, bewegt man die Menschen doch nie dazu etwas bei sich zu ändern.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück