Archive

Posts Tagged ‘JQuery’

[C# 4 MVC2 JQuery] Appeler une action depuis JQuery – Part 2

Je reviens un peu sur ce que j’avais noté dans Appeler une action depuis JQuery.

Après un audit de sécurité, il s’est avéré que JSon, tel qu’utilisé, pouvait entrainer une faille. Dans notre cas, elle est catégorisée sous « Piratage de Javascript », avec une classification WASC « Divulgation d’informations : Fuite d’informations« .

Du coup, je me suis penché sur le problème et j’ai trouvé Asp.Net MVC 2 JsonRequestBehavior.AllowGet.

J’ai donc modifié mon code en conséquence :

function GetProviders(input){
        $.ajax({
            type: "POST",
            url: "<%: Url.Content("~/Controller/GetEvents") %>",
            data: { date: input },
            dataType: "json",
            async: true,
            cache: false,
            success: function (msg) {
                $("#InputSelect").empty();
                $.each(msg, function (index, item) {
                    $("#InputSelect").get(0).options[$("#InputSelect").get(0).options.length] = new Option(item.Name, item.Code);
                });
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                // ...
            }
        });
    }
    $(document).ready(function () {
        $("#InputDate").live('blur', function () {
            var date = $("#InputDate").val();
            if (date != "") {
                GetProviders(date);
            }
        });
        $("#InputDate").blur();
    });

A noter ici l’utilisation de Url.Content.
Ca permet, ni plus ni moins, de s’affranchir des problèmes de résolutions des URL.
Je m’explique : en local, je travaille avec des URL du type : http://localhost:8080/Controller/Action.
Cependant, sur le serveur de production, les URL sont du type : http://domain/projet/Controller/Action.
On a un niveau supplémentaire et là, c’est vite le drame ! 🙂
Du coup, Url.Content permet de résoudre automatiquement les URL à partir de l’élément racine : « ~ » veut donc dire http://localhost:8080 ou http://domain/projet, suivant l’environnement.

Et là, on peu enlever le JsonRequestBehavior.AllowGet :

        [HttpPost]
        public JsonResult GetPrestataires(string date)
        {
            List<Provider> list = new List<Provider>();
            // Traitements
            return Json(list);
        }

Je mettrais à jour en fonction du résultat du nouvel audit.
Et pis je ferais aussi un retour un peu plus général sur la sécurité en présentant différents sites utiles, dans un autre billet.

EDIT du 11 / 02

Après un audit différentiel, il apparait que la faille est corrigée !
Donc, la méthode $.ajax est à utiliser en lieu et place de $.getJSON.
Pour la petite histoire, l’utilitaire avait détecté 19 failles, l’audit différentiel a indiqué quelles avaient toutes été corrigées \o/

Catégories :.Net, ASP.Net, C#, JQuery, MVC2

[C# 4 MVC2 JQuery] Appeler une action depuis JQuery

La situation : j’ai un champ qui prend une date, selon cette date, je dois alimenter une combobox avec toutes les valeurs valides pour cette date.

Par exemple, je choisis le 24/12/2010 et je dois afficher tous les évènements de cette date dans ma combo.

Donc, coté HTML :

<tr>
    <td><%: Resources.GlobalResource.Date %></td>
    <td><%: Html.TextBox("InputDate", Model.InputDate) %></td>
</tr>
<tr>
    <td><%:Resources.GlobalResource.Events%></td>
    <td><select id="InputSelect" name="InputSelect"></select></td>
</tr>

J’ai utilisé le DatePicker qui est trouvable ici (http://www.eyecon.ro/datepicker/), même si je l’ai un poil modifié pour répondre aux besoins.

Il est pas mal, même si je l’ai trouvé un peu compliqué à skiner (mais mon goût pour faire de la CSS étant…discutable, je ne suis pas forcément partial sur ce point).

$(document).ready(function () {
    $("#InputDate").live('blur', function () {// binding sur l’action de blur (perte du focus)
        var date = $("#InputDate").val();
        if (date != "") {
            $.getJSON("/Controller/GetEvents", // action en question
                    { date: $("#InputDate").val() },// paramètre(s) passé(s) à l’action
                    function (data) {
                        $("#InputSelect").empty();
                        $.each(data, function (index, item) {//pour chaque item
$("#InputSelect").get(0).options[$("InputSelect").get(0).options.length] = new Option(item.Name, item.Code); //on ajoute un item à la combo
                        });
                    });
        }
    });
    $("#InputDate").blur();
});

Là, je renvois une liste d’entités contenant les deux propriétés Name et Code.

Il faut réellement bien faire attention aux fautes de frappe qui peuvent faire perdre un temps fou…

Coté controller, l’action prend en paramètre une string qui sera convertie en date et qui renvoie un JsonResult contenant une liste d’Events, objet qui possède deux propriétés : Name et Code.

public JsonResult GetEvents(string date)
{
   List<Events> list = new List<Events>();
   // Traitements
   return Json(list, JsonRequestBehavior.AllowGet);
}

Très important, en MVC 2, il FAUT ajouter le paramètres JsonRequestBehavior.AllowGet.

Sinon, ça ne marche tout simplement pas…

Catégories :.Net, ASP.Net, JQuery, MVC2