Datei-upload mit JQuery und ASP.NET Generische Handler - Ist das möglich?

Ich versuche zu lösen ein kleines Problem. Ich baute eine ganze web ASP.NET Anwendung, die vor allem mit client-Seite (JQuery/JavaScript -) code. Ich benutze generischen Handler, um einige der lazy loading von Daten, sowie für die auto-vervollständigen und ähnliches.

Einer der Anforderungen ist, dass eine Seite muss in der Lage sein, um eine Datei hochzuladen, sowie die Anzeige von meta-Informationen über die uploadead-Dateien.

Ich da Fragen, ob es einen Weg gibt, um eine Datei hochzuladen, die komplett aus der JQuery/JavaScript. Ich recherchierte eine ganze ot von plugins, aber Sie alle verlassen sich auf ein php-backend.

Mein Gedanke war es, einen Beitrag erstellen:

$(function(){
    $('#submit').live('click', function(event){

        $.post('/SomeOtherHandler.ashx',  //can be '/someotherpage.aspx'
        { 
            filename: $('#fileUpload').val(), 
            timestamp: (new Date()).toString() 
        }, function(data){
             //do something if the post is successful.
        });

    });
});

Wäre, dass die Arbeit? Ich weiß, dass, wenn Sie das json-Objekt { filename: value, timestamp: value } es wird zeigen, bis in der HttpContext.Request.Params - Sammlung, wo ich es Lesen kann, ohne Probleme.

Das problem ist jedoch, dass ich nicht weiß, wie dies funktionieren wird, da der FileUpload-Steuerelement für html speichert nur den Namen der Datei, in seinem Wert. Daher wäre ich senden einen string zu meinem server mit den Dateinamen, nicht ein array von bytes.

Irgendwelche Gedanken zu diesem würde sehr geschätzt werden!

Korrigiert mich wenn ich mich Irre, aber wenn ein <input type="file".../> ist eine Besondere Art von post ist erstellt: eine, wo ein mime-Typ wird mit der mitgelieferten Datei sowie einige andere Dinge. Der post passiert, was auch immer Ihre <form action="".../> Punkte zu. Wenn Sie auf ein <input type="submit".../> den gesamten Inhalt des Formulars gesendet wird über einen http-POST an die server-side-code einschließlich der Datei-bits. Ein bin nicht zu Fragen, packen die Datei in JavaScript, aber einfach zu neu zu erstellen, http-POST, so dass mein handler/Seite erhalten die Daten, die von der <input type="file".../> Feld.
javascript kann nicht post ein Formular mit einem input-Typ der Datei. Es wird nicht die Datei hochladen.
Ich habe ein ähnliches Problem. Umsetzung HTML5-drag-and-drop war ein Stück Kuchen, Dank dem File-Objekt. Aber, meine <input type='file' /> ist für Browser, die noch nicht unterstützt werden, Ziehen ein Drop (hauptsächlich IE und ältere Browser). Immer noch versuchen, einen Weg zu finden

InformationsquelleAutor bleepzter | 2011-02-11

Ich bin mit dem uploadify-plugin (http://www.uploadify.com/) - Jeremy sagte, es ist nicht in javascript ist Es nicht möglich. Es ist in flash. Es ist sehr einfach zu installieren.

$('#file_upload').uploadify({
   'uploader'  : '/uploadify/uploadify.swf',
   'script'    : '/uploadify/uploadify.ashx',
   'cancelImg' : '/uploadify/cancel.png',
   'folder'    : '/uploads',
   'auto'      : true,      
   'fileExt': '*.xls;*.xlsx;*.csv',
   'buttonText': 'Select your file',
   'onError'     : function (event,ID,fileObj,errorObj) {

  alert(errorObj.type + ' Error: ' + errorObj.info);

},
'onComplete'  : function(event, ID, fileObj, response, data) 
                {
                    var obj = jQuery.parseJSON(response);
                    if (obj.error != "" & obj.errror != null)
                    {
                        lblTable.html("error : " + obj.error);
                    }
                    else


                    {
                        lblTable.html(obj.table);
                       lblEditData.show();
                       lblTable.hide();
                    }

                }
 });

Und auf die uploadify.ashx :

public class uploadify : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        System.Web.HttpPostedFile file = context.Request.Files["Filedata"];

        //Check extension
        string extension = "";
        try
        {
            extension = file.FileName.Split('.')[file.FileName.Split('.').Length - 1];
            if (extension != "xls" & extension != "xlsx" & extension != "csv") throw new Exception("Error of the extension");
        }
        catch
        {
            context.Response.Write("{\"error\",\"Error with the extension of the file\"");
        }


        string linkFile = System.Web.HttpContext.Current.Server.MapPath("~") + "uploads" + "\\" + DateTime.Now.ToString("yyMMddHHmm") + APIReportPro.DocumentPDF.RandomString(4) + "." + extension;

        file.SaveAs(linkFile);


  ...etc...

Dies ist die schönste Lösung, die ich gefunden für asp.net

kurze Frage... Ist es möglich, fügen Sie den folgenden, um die Skript-url: /uploadify/uploadify.ashx?type=create&val1=val1&val2=val2... dynamisch? Ansonsten muss man race conditions. Wenn val1 und val2 sind erforderlich, zusammen mit dem Datei-stream, um gerettet zu werden, um sql - ... dann würden Sie nicht wissen, ob Sie die Datei zuerst hochgeladen oder wenn der Wert1 und Wert2 bekam es auf Zeit....
Ich bin mir nicht sicher, zu verstehen, was du meinst... ich habe nicht versucht, aber denke, dass Sie hinzufügen können, param in Ihre get-Abfrage an /upladify.ashx
Sie können mit System.IO.Pfad.GetExtension zu bekommen Datei-Erweiterung

InformationsquelleAutor Zitun

3

Haben Sie was kocht bis zu drei Optionen beim hochladen von Dateien auf einen server. Sie können den Einsatz von nativen html-Datei-upload-Funktionen, Flash oder Java. Javascript kann nicht uploaden einer Datei auf einem server, kann es nur schmücken den eingebauten html-Funktionalität. Mit dieser sagte, ich kann nur annehmen, dass Sie versuchen zu imitieren, wie ajax-Upload Funktionalität. Wenn das so ist, es ist ein Weg, um das hochladen von Dateien über ein iframe, das wird Aussehen, wie Sie mit ajax.

Erstellen Sie ein Formular
```
<form id="file_upload_form" method="post" enctype="multipart/form-data" action="upload.aspx">
    <input name="file" id="file" size="27" type="file" /><br />
    <input type="submit" name="action" value="Upload" /><br />
    <iframe id="upload_target" name="upload_target" src="" style="width:0;height:0;border:0px solid #fff;"></iframe>
</form>
```
Diese form nutzt die iframe-post die Datei, die bewirkt, dass der main-Seite auf "nie aktualisieren". Sie können hook up your jquery die Antwort zu verarbeiten iframe zurück und Griff die information der Benutzer.

Ist dies nicht der Teil der Gleichung, die Sie suchen, fühlen Sie bitte sich frei zu äußern und zu klären, was es ist, die Sie suchen zu erreichen.
- So wie du den iframe? Zeigen Sie einfach das Formular die Aktion "hochladen.aspx"?
- und Silverlight!
- silverlight ist tot...
InformationsquelleAutor Jeremy B.
2

Wenn Sie diktieren können, welche Browser Ihre app zugegriffen wird (es ist z.B. eine interne business-app), es lohnt sich, das neue Datei-API, die Teil der "HTML5" - Stapel von Technologien, die zu Beginn zu zeigen, bis in den neuesten Browsern. Dies gibt Ihnen den direkten Zugriff auf Dateien über clientseitiger Javascript ohne die post müssen Sie die Datei auf den server.

Wenn Ihre app öffentlich zugängliche dann können Sie immer noch die Datei-API, aber Sie müssen überprüfen Sie für die Unterstützung für Sie in Ihrem code, und wenden Sie eine Art von fallback-Mechanismus (wie Uploadify) für diejenigen mit älteren Browsern.

Lesen Sie mehr über die Datei-API hier und hier unter anderen stellen.
- Mann, es wäre schön, wenn dies jemals wird weithin unterstützt...wir haben eine LANGE Zeit gewartet für eine anständige Art und Weise zu handhaben uploads.
- Ich denke, das ist eine, die ist hier zu bleiben, vorausgesetzt, es nicht auf einige wichtige Fragen der Sicherheit - es ist bereits von einigen großen Webseiten (z.B. Box.net). Über die Zeit!
- Ich unterstütze diese für Chrome, Safair und Firefox auf meinen Seiten. Es funktioniert Super. Schade, IE9, ließ die Seife auf dieser. Opera bietet keine Unterstützung für die Datei-API, aber Sie unterstützen das multiple-Attribut auf die input-Datei.
- Ich ging zur post "und ratet mal, welche großen browser unterstützt es nicht anders als jeder andere browser auf dem Markt!"
- In der Tat, EI9 nicht mit dieser Funktion ist eine Enttäuschung.
InformationsquelleAutor Luke Bennett
1

Ich bin mir ziemlich sicher, dass es nicht möglich ist; wenn es ist, dann ist es ein großes Sicherheits-Loch - Javascript sollte nicht in der Lage, um die bytes von der Festplatte des Benutzers.

So steckt man sich über die native input type=file oder mit bereits vorhandenen desktop-bytes, wie Flash. Mehrere beliebte Uploader verwenden Sie diese Methode,...mein Favorit ist Uploadify. Werfen Sie einen Blick und sehen, wenn das nicht Ihren Bedürfnissen entsprechen.

HTH.
- Uploadify setzt auf php-backend.
- Überhaupt nicht - ich habe diese auf ASP.Net viele Male: uploadify.com/forums/discussion/45/....
- Yep, du bist falsch ich habe Angst bleepzter - Uploadify nicht benötigen PHP.
InformationsquelleAutor Chris B. Behrens
0

Implementierte ich eine ASP.NET Handler zum hochladen der Datei mit Valums ajax-Upload-Steuerelement. Sie können überprüfen, Lösung hier. Sie können auch upload große Datei. Diese Prozedur unterstützt IE, FF und Chrome-browser. Sie können auch drag & drop von mehreren Dateien aus FF und Chrome (HTML 5)

http://ciintelligence.blogspot.com/2011/05/aspnet-server-side-handler-for-valums.html

InformationsquelleAutor Syed Bashar

Mithilfe von jquery können Sie etwas tun:

<input type="file" name="file" id="file1" runat="server" />

$("#<%=file1.ClientID%>").change(function () {
  //Do stuff
   $(this).upload('youHandler.ashx', function (res) {
     //do stuff on success
   }
}

Nun auf yourHandler.ashx können Sie etwas tun:

public void ProcessRequest(HttpContext context)
{
   if (context.Request.Files.Count > 0)
   {
      var fileCount = context.Request.Files.Count;
      var fileStram = var file = context.Request.Files[0].InputStream;

      //Do whatever you want
   }
}

InformationsquelleAutor Vando

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.