Lancer un processus asynchrone en Asp.Net

by Gilles DEHAIS 11. juillet 2011 20:46

Bonjour,

Nous allons voir comment lancer un processus de façon asynchrone en ASP.Net. En effet, vous vous êtes surement retrouver devant le cas d'une page qui doit lancer un processus relativement long (plusieurs minutes) et qui bloque alors la page Web en attendant que ce processus finisse et que le serveur réponde que l'opération s'est déroulée avec succès ou non.

Or, lorsque l'on clique sur le bouton qui lance ce processus sur le serveur, la page est comme "frisée" et les animations permettant d'indiquer à l'utilisateur d'attendre sont elles aussi figées. Heureusement, il existe un moyen de contourner ce problème : l'asynchrone.

Créer un site Asp.Net vide sous Visual Studio et ajoutez-y un autre page Web que l'on nommera "Default2.aspx". Nous allons maintenant éditer la page "Default.aspx" pour y ajouter du code javascript et nos éléments Web.

 

<title> Untitled Page </title> 
<script type="text/javascript"> 
 
    function ClientCallbackFunction(arg, ctx) {
        if (arg != "") {
            window.location = "Default2.aspx";
        }
    } 
</script>  
</head>


<body> 
 
<form id="form1" runat="server"> 
<div>
Async Callback
<br />
<asp:TextBox ID="tbxLongProcessArgs" runat="server" />
<br />
<input type="button" value="Start" id="bttAsync"
       onclick="javascript:document.all.Message.innerText='Process started';return DoTheCallback(document.all.tbxLongProcessArgs.value,1);" />
<br />
<span id="Message"></span>
</div>
</form>
</body>

 

Comme vous pouvez le constater, le bouton affiche le message 'Process started' et lance notre processus en mode asynchrone en lui donnant un argument lorsque l'utilisateur cliquera dessus. La fonction JavaScript 'ClientCallbackFunction' sera appelée lorsque notre processus sera terminé et permettra de passer sur notre 2ème page Web.  Maintenant nous allons éditer notre page Default2.aspx

 

<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="txtDesc" runat="server" Width="250px" TextMode="MultiLine"></asp:TextBox>
    </div>
    </form>
</body>

 

Cette page va nous permettre d'afficher le résultat de notre processus. Il ne nous reste plus qu'à ajouter le code behind qui lancera notre processus coûteux en temps en mode asynchrone

 

    protected void Page_Load(object sender, EventArgs e)
    {
        string js = Page.ClientScript.GetCallbackEventReference(this, "arg",
        "ClientCallbackFunction", "ctx", true);

        System.Text.StringBuilder sb = new System.Text.StringBuilder();
        sb.Append("function DoTheCallback(arg, ctx) {");
        sb.Append(js);
        sb.Append("}");
        Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
        "callbackkey", sb.ToString(), true);
    }

Comme nous pouvons le voir, nous ajoutons à la page 'Default.aspx.cs' un évènement de type CallBack qui appelera notre fonction javascript 'ClientCallbackFunction' de notre page Default.aspx et ceci de manière totalement asynchrone. Cette évènement sera créé lorsque l'utilisateur cliquera sur le bouton 'Start' de notre page.

Maintenant, pour que la magie de l'asynchrone opère, il va falloir utiliser l'interface 'ICallbackEventHandler' que nous implémentons aussi dans notre code behind de la page Default.aspx.

 

    #region ICallbackEventHandler Members

    void ICallbackEventHandler.RaiseCallbackEvent(string eventArgument)
    {
        this._eventArgument = DoLongProcess(eventArgument);
    }

    string ICallbackEventHandler.GetCallbackResult()
    {
        if (!string.IsNullOrEmpty(this._eventArgument))
            Session["errorMessageImport_P"] = this._eventArgument;
        return this._eventArgument;
    }

    #endregion

 

Lorsque l'utilisateur clique sur le bouton 'Start', notre évènement asynchrone est créé et la méthode RaiseCallbackEvent est lancée. Nous avons aussi la possibilité de lui envoyer des paramètres. C'est cette méthode qui va lancer notre processus côuteux en temps. Une fois le processus fini, la méthode GetCallbackResult est lancée et appelle la méthode javascript 'ClientCallbackFunction' de notre page. Vous pouvez utiliser des variables de Session si vous désirez sauvegarder en mémoire sur le serveur le résultat du processus.

Ainsi, une fois notre processus terminé, la page 'Default2.aspx' est appelée par le client et la réponse retournée par notre processus est affichée à l'utilisateur. Vous pouvez remarquer que lorsque vous cliquez sur le bouton 'Start', la page n'est pas figé. Elle peut donc afficher un gif animé d'attente utilisateur par exemple. 

WebSite_Async.zip (5,03 kb)

Tags:

Développement

Ajouter un commentaire




  Country flag
biuquote
  • Commentaire
  • Aperçu immédiat
Loading


Neos-SDI  Neos-SDI