Ladevorgang der Seite mit JavaScript anzeigen

Question

Ich lade eine Liste von Dateien von einem Webdienst ab und zeige sie als Links an. Wenn jemand auf den Link klickt, sollte die Datei heruntergeladen werden. Das Problem besteht darin, dass kein direkter Zugriff auf die Datei besteht. Hier ist der Prozess eine Datei zum Download:

1. Der Nutzer klickt auf den Link
2. Server ruft Web-Service-Datei abrufen
3. Browser wird so lange geladen, wie es die Datei wieder aus dem Web-Service zu bringen dauert
4. Browser bietet schließlich Datei an Benutzer zum Download

um die ungünstigen Benutzererfahrung mit der Web-Service-Schalter zu warten, bevor der Download beginnt, würde Ich mag ein, um „Loading ...“ fe Edback-Dialog, wenn auf einen Link geklickt wird und der Dialog verschwindet, wenn die Datei fertig ist.

Ich benutze jQuery, und habe mit dem Hinzufügen eines iframe auf der Seite herumspielen, um die Datei zu laden, aber das Problem, das ich habe, ist ich weiß nicht, wie man bestimmt, dass die Datei bereit ist.

Ich suche nach Tipps, nicht nur auf der Client-Seite, um ausreichend Feedback zu geben, aber vielleicht auch auf der Server-Seite (mit ASP.Net), nur für den Fall, dass ich etwas tun kann, um den Prozess zu rationalisieren. Vielen Dank.

Aktualisieren: Um dies zu verdeutlichen, dient dies zum Herunterladen einer Datei auf den Computer eines Benutzers. Was ich speziell suche, ist eine Möglichkeit festzustellen, wann die Datei zum Download bereit ist. Also, wenn Schritt 4 oben stattfindet, möchte ich die Meldung "Loading ..." entfernen.

Answer 1

Es klingt wie Sie eine neue URL auf Ihrem Server aussetzen müssen, nur Job, das ist zu antworten, ob der Web-Service-Abruf abgeschlossen ist (oder wenn nicht, wie weit es hat).

Lassen Sie AJAX diesen Dienst alle paar Sekunden abfragen und entfernen Sie die Meldung "Loading ...", wenn die Datei geantwortet hat.

Der Client sollte die Sitzungs-ID (vielleicht auch eine Datei-ID) senden, damit der Server weiß, um welche Datei er gebeten wird. Die Serverseite muss in der Lage sein, den laufenden Web-Service-Retrieval-Prozess/Thread zu kontaktieren, um ihn zu fragen, wie weit er gekommen ist. (Wenn der Thread nicht gefunden werden kann, ist er vermutlich fertig.)

Answer 2

können Sie die komplette Option für in jquery $ Schnipsel Funktion, die aufgerufen werden soll, wenn die Anfrage

Answer 3

vervollständigt Sie jQuery für den Klick auf den Link zu warten, und wenn der Link angeklickt Show die Nachricht zum Laden der Anzeige.

Beispiel, das zeigt, wie Sie 'Loading - Please wait' Message Display Script folgen können.

Bearbeiten-

Grundsätzlich wollen Sie einen Fortschrittsbalken Monitor, die ich habe es nie mit nur Javascript getan gesehen, aber mit Flash oder Ajax.

Hier ist eine File Upload Demo, die helfen sollte.

Answer 4

Wenn Sie eine Verknüpfung zu einer ASHX herstellen, die die Datei erfasst und in einen Stream zurückschreibt, können Sie das Klickereignis der Verknüpfung ändern, um eine Nachricht anzuzeigen.

$(function() { 
    $("a.someClass").click(function() { 
    $("div.message").fadeIn(); // show a loading message 
    return true; // make sure the link still gets followed 
    }); 
}); 

Die Lade Nachricht kann nur ein Spinner oder etwas sein, während für die ASHX wartet wieder die Antwort zu schreiben.

Edit: Da Sie nicht direkt auf die ASHX Verknüpfung:

$(function() { 
    var ashxCallback = function (data, textStatus) { 
    // data could be: xmlDoc, jsonObj, html, text, etc... 
    this; // the options for this ajax request 
    // textStatus can be one of: "timeout", "error", "notmodified", "success", "parsererror" 
    alert(textStatus); 
    }; 

    $("a.someClass").click(function() { 
    $("div.message").fadeIn(); // show a loading message 
    $.get("some.ashx?id=1234", "", ashxCallback); 
    return false; 
    }); 
}); 

Mit jQuery.get() und jQuery.post().

Bearbeiten # 2: Ich hatte gerade einen anderen Gedanken. Was passiert, wenn die Nachricht Loading ... in einem Iframe enthalten ist, der in die Datei umgeleitet wurde? Sie würden also den iframe mit jQuery anzeigen, er hätte die Standardmeldung Loading ... und eine kleine Spinner-Animation und dann den src/location des iFrames auf den ASHX, dessen Laden ewig dauert. Sie könnten dann einen Onload-Handler von der übergeordneten Seite des Iframes geben, der ihn ausblenden würde. Lassen Sie es mich wissen, wenn Sie Beispielcode benötigen.

Answer 5

Wenn die Vorbereitung für die Datei weniger als das Standard-Zeitlimit der AJAX-Anforderung dauert, können Sie die AJAX-Anforderung starten und dem Benutzer die Meldung "Loading ..." anzeigen. AJAX-Aufruf überprüft dann die Verfügbarkeit der Datei und wann sie verfügbar ist - gibt mit der Nachricht (Erfolg oder nicht) zurück und gibt einen Link für die Datei an. Eine AJAX-Anfrage kann sogar einen Dateidownload durchführen, aber das ist deine Option.