Chiffrer / déchiffrer très facilement des données avec la classe MachineKey en .Net 4.5

icon Tags de l'article : ,

Mai 17, 2018
Salut à tous,

Aujourd'hui on va parler chiffrement. Et depuis .Net 4.5, c'est fichtrement simple (je vous épargnerai l'historique complet du "pourquoi c'est plus simple et mieux" depuis .Net 4.5, mais vous pouvez le trouver ici).

En effet, pour chiffrer/déchiffrer du texte, vous aurez besoin de 2 choses :
  • une entrée MachineKey dans votre app.config ou web.config.
  • la classe MachineKey

Première étape donc, vous devez ajouter une ligne dans votre fichier de config, avec vos clefs de chiffrement. Exemple :
<machineKey validationKey="78BEF3A7DF5611DF7D5A4ABF373C539B6A9E7323B13103D5F66A38653686543C084D7574F6D180C9F17AE7F4E4D72C7CD47725946589788C5A8EC916223A9E9B" decryptionKey="A8B2C28F08ADB2D18DAC0E5A642AA90B8BF6A5864499A88ADB7C459D96B885B9" validation="SHA1" decryption="AES" /> 

Vous pouvez générer ce genre d'entrée très facilement grâce à ce site : http://www.allkeysgenerator.com/Random/ASP-Net-MachineKey-Generator.aspx
(ou encore directement via IIS)

Par défaut l'algorithme sera AES, mais vous pouvez changer pour DES ou 3DES si vous préférez (même si je vous conseillerai plutôt de garder AES).

Ensuite, niveau C#... ben rien de plus simple. Vous n'avez plus qu'à appeler la classe MachineKey du namespace System.Web.Security, et ses méthodes Protect et Unprotect :

// ici on va chiffrer notre chaine de caractères
string purpose = "USER_ID"; 
byte[] bytesToEncrypt = Encoding.UTF8.GetBytes(stringToEncrypt);

byte[] encryptedBytes = MachineKey.Protect(bytesToEncrypt, purpose);
string encryptedString = Convert.ToBase64String(encryptedBytes);

// [...]
// ici on va déchiffrer notre chaine de caractères
string purpose = "USER_ID";
byte[] encryptedBytes = Convert.FromBase64String(encryptedData);

string decryptedBytes = MachineKey.Unprotect(encryptedBytes, purpose);
string decryptedString = null;

if (decryptedBytes != null)
{
    decryptedString = Encoding.UTF8.GetString(decryptedBytes);
}

Dernière précision : l'attribut purpose correspond à un tableau de chaines de caractères qui servent à décrire les raisons pour lesquelles on chiffre ces données (comme une sorte de rôle). Cet attribut, s'il est passé au chiffrement, doit être passé également au déchiffrement.
En bref : on met une string propre à la donnée ou au composant, afin de s'assurer que lui seul arrivera à déchiffrer cette donnée, et pas d'autres composants / morceaux de l'application.

Voilà, c'est tout pour moi, bonne journée et bon dev à tous et toutes !

Quelques outils que tout bon développeur .Net devrait utiliser sur ses projets

icon Tags de l'article : , , , ,

Mai 15, 2018
J'ai entendu dire, il y a longtemps, que Bill Gates avait dit :



Et c'est vrai. Quelqu'un qui n'aime pas travailler inutilement trouvera toujours des voies pour travailler plus efficacement et supprimer les tâches chiantes inutiles.

Au fil des années, je me suis rendu compte que trop peu de développeurs se posaient une question pourtant évidente : quelle tâche quotidienne et contraignante pourrais-je simplifier dans mon process de développement/test ?

La réponse est souvent : ben merde y'en a plein en fait !!!

Qu'il s'agisse de purger la base de données, de créer un compte utilisateur, de remplir la BDD avec de fausses données... il y a souvent énormément de tâches qu'un développeur pourrait automatiser pour vite gagner un maximum de temps. Et si en plus ce développement est mutualisé entre les développeurs... ben c'est un gain énorme pour toute l'équipe.

Pour ça, je voulais partager avec vous les outils que tout bon développeur .Net devrait utiliser pour ça.

1) Une extension Visual Studio

Coder sa propre extension Visual Studio n'est pas forcément évident... mais ça peut vous permettre de gagner un maximum de temps en ajoutant directement dans VS les choses chiantes que vous devez faire régulièrement.

Quelques exemples (dont certains tirés de l'extension VS de mon poste actuel) :
  • purger la base de données
  • créer un compte utilisateur de test
  • démarrer le noeud Selenium
  • tuer tous les process Chrome Selenium qui restent
  • changer la configuration de la BDD (local / tests de perfs / preprod)
  • etc.

Avoir ces options directement dans votre Visual Studio peut vous faire gagner un temps précieux. Car même juste 2 minutes par jour, sur une année ça représente une journée entière de travail...

2) Le #if DEBUG

En local, on a parfois besoin d'avoir des fonctionnements différents du fonctionnement en production. Que ce soit à cause du cache, de la quantité de données, ou même de l'initialisation de la base de données... on a parfois envie d'avoir un fonctionnement différent, pour se simplifier la vie.

Voici quelques exemples d'actions que j'ai pu automatiser par le passé, grâce au #if DEBUG :
  • au lieu d'aller chercher le catalogue complet de données en BDD (ce qui prenait 2 minutes à chaque lancement de l'application), on le stocke sérialisé sur le disque dur et on l'utilise comme tel (bim, 10 secondes de chargement au lieu de 2 minutes)
  • création automatique d'un compte par défaut si aucun compte n'existe déjà
  • connexion automatique au compte par défaut
  • extraction, anonymisation et stockage sérialisé dans des fichiers de données venant de la production, afin de pouvoir faire des calculs statistiques sans avoir à requêter directement la BDD de prod
  • forcer la connexion à la BDD locale

3) Un dossier de ressources

Là on est dans l'évidence, mais parfois ça ne fait pas de mal de rappeler les évidences : prenez des notes.

Vous galérez à trouver une procédure spécifique ? Notez là quand vous avez enfin trouvé.
Un collègue vous montre une procédure compliquée pour faire quelque chose ? Notez là.
Vous découvrez gadget super cool que vous pourriez avoir à utiliser plus tard ? Mettez le de côté.

Quand on développe, il faut aussi savoir prendre des notes. Personnellement, j'ai toujours un dossier de ressources (personnelles) chiffré.

Qu'est ce qu'on trouve dans le mien ? Enormément de choses :
  • Les logins/mdp pour chaque compte partagé lié à notre application
  • Des scripts windows/powershell pour certaines actions (backup d'une base de données, restauration, création d'un certificat)
  • Comment faire certaines actions simples/complexes dans la solution
  • Des scripts SQL pour certaines actions BDD (purge et réindex Azure, identifier la fragmentation des index, batch de suppression des anciens logs, etc.)
  • Des rappels sur certains concepts qui ont du mal à rentrer (oui, même après plus de 15 ans de dev, ça doit être le grand âge)

Ca peut sembler idiot, car souvent en 2/3 minutes sur stackoverflow on peut retrouver la solution... mais :
1) Ca permet d'avoir du spécifique pour notre situation
2) Si nos fichiers sont bien triés et nommés, on gagne du temps même par rapport à stackoverflow
3) Ca peut vous sauver la vie si vous devez refaire une opération compliquée (prévue à l'origine comme un one-shot, vous savez, le célèbre "ne t'en fais pas, c'est juste pour cette fois" d'il y a 6 mois)

4) Les tests unitaires

Bon, je ne vais pas insister sur l'importance des tests unitaires dans un projet, mais sachez ceci : vous pouvez très bien utiliser des tests unitaires pour automatiser certaines actions de dev/debug.

Quelques exemples :
  • Tester la connectionstring du projet
  • Vérifier que toutes les procédures stockées appelées sont bien présentes dans la BDD
  • Tester une procédure stockée
  • Vérifier qu'une convention de codage est bien respectée sur le projet (quand on a des règles spécifiques)

Ou même encore : créer des données en dur en base. Après tout pourquoi pas ?

4) Un logiciel d'automatisation dans le navigateur

Lorsqu'on fait du dev web, on a souvent besoin de remplir des formulaires pour tester certaines choses. Et remplir 10 fois d'affilée les même 10 champs... ben ça fatigue très vite.

Or... il existe une solution simple : les extensions Chrome/Firefox d'automatisation. Par exemple iMacros.

Ces extensions permettent d'enregistrer un enchainement d'actions faites dans le navigateur pour les reproduire ensuite. Grâce à ça, vous pourrez créer un compte, vous logger, remplir en formulaire, etc... en un seul clic.

5) Les tests Selenium

Même si les tests Selenium sont, à la base, conçus pour tester votre application, vous pouvez les utiliser pour de nombreuses choses pas forcément évidentes à première vue :
  • Tester une API
  • Tester l'interconnexion entre 2 applications
  • Aller vérifier l'état d'un autre service en ligne
  • Créer une surcouche de monitoring (quand vous n'avez qu'un board figé de monitoring et pas d'API)
  • ...

6) Les macros de Notepad++

Si vous ne les avez jamais utilisé, sachez que Notepad++ permet d'enregistrer toutes les actions produites sur une ligne, pour ensuite les reproduire sur toutes les lignes d'un fichier.

Vous avez un fichier où le format ne va pas du tout, vous devez passer un bloc à gauche, supprimer quelques caractères et rajouter un morceau à la fin ? Record => modifications => Fin => Jouer en boucle jusqu'à la fin => terminé.

Voilà, je pense que ça fait déjà pas mal,

Je vous ai épargné les grands classiques, comme les environnements d'intégration continue, car si vous n'en avez pas déjà, il y a de fortes chances que ce soit indépendant de votre volonté (je voulais concentrer cet article sur ce que les développeurs peuvent faire eux-même, sur leur poste).

J'espère que cet article vous a plu, bonne journée et bon dev à tous et toutes !

Comment Dispose un HttpResponseMessage (et gérer l'erreur CA2000 de FxCop)

icon Tags de l'article : ,

Mars 29, 2018
Yo,

Petit souci sur lequel je suis tombé aujourd'hui : j'utilisais un using autour de mon HttpResponseMessage :

using(var response = new HttpResponseMessage(HttpStatusCode.OK);
{
     //...
     return response;
}

Evidemment... ça ne marchait pas. Le Dispose était fait avant que la requête ne parte chez l'utilisateur, et donc... ben j'essayais d'accéder à un objet disposed.

Sauf que si je retire mon using, j'ai une magnifique erreur FxCop CA2000 qui apparait...

Du coup comment faire ?

Après quelques recherches, j'ai trouvé plusieurs informations intéressantes :
  • Ce n'est, évidemment, pas obligatoire de dispose le HttpResponseMessage dans le cas où tout se passe bien. La requête sera dispose, et par conséquent l'objet HttpResponseMessage également. Le GarbageCollector est de plus là pour les restes ;)
  • Si jamais on veut planifier le Dispose pour s'assurer qu'il soit fait (sans attendre le GC), alors on peut utiliser Request.RegisterForDispose(response);
  • Dans tous les cas, l'erreur CA2000 apparaitra car dans le cas d'une exception, ben... notre HttpResponseMessage ne sera pas disposed.

Ce warning FxCop est un peu inutile quand on manipule des HttpResponseMessage dans un contexte de requêtes d'API.
Ce warning est là, normalement, pour forcer à utiliser des usings, mais là... on est dans une situation où un using ne marche pas, donc inadapté.

Ma suggestion ?
Désactiver l'erreur CA2000 pour cette méthode.

Et si vraiment vous ne pouvez/voulez pas... Vous pouvez toujours vous assurer qu'un Dispose sera fait, comme ceci :

var response = new HttpResponseMessage(HttpStatusCode.OK);
try
{
     Request.RegisterForDispose(response);
     //...
     return response;
}
catch
{
     response.Dispose();
     
     throw;
}

Bon dev et bonne journée tout le monde !

Ranger les using "System" avant les autres, dans Visual Studio

icon Tags de l'article : , ,

Mars 27, 2018
Salut,

Si vous êtes comme moi, vous aimez bien faire les choses.

Or, en C#, on sait qu'il faut toujours mettre les using "System" avant les autres. C'est une bonne pratique, ça permet de s'y retrouver plus facilement, et de gagner en clarté/lisibilité.

Sauf que voilà, sans resharper... c'est chiant d'avoir à déplacer les using pour les trier automatiquement.

Sauf que voilà... y'a pas à le faire à la main.

Visual Studio le gère automatiquement aujourd'hui. Il faut juste l'activer.

Allez donc dans Tools => Settings, puis dans C# => Advanced.

Là, vous n'avez plus qu'à cocher la case "Place 'System' directives first when sorting usings".



Et c'est fait !

Bon dev et bonne journée tout le monde !

Installer Git Extensions et Git sur Windows pour cloner un repository GitHub

icon Tags de l'article : ,

Mars 26, 2018
Bonjour à tous,

Un petit article pour bien installer Git Extensions sur son PC, afin de pouvoir l’utiliser avec un repo git (ici, Github).

Tout d’abord, vous devez télécharger Git for Windows et l’installer en administrateur.

A noter que dans les options, je choisis :
  • Notepad++ au lieu de Vim par défaut
  • Use Git and optional Unix tools from the Windows Command Prompt
  • Use OpenSSH
  • Use the OpenSSL library
  • Checkout as-is, commit as-is (évite les conversions intempestives)
  • Use Min-TTY (mieux qu’une simple console windows)
  • Enable file system caching & Enable Git Credential Manager

Ensuite, téléchargez Git Extensions et installez-le :
  • Install for all users of this machine
  • Décochez la case pour installer Git for Windows
  • Cochez l’installation de KDiff3 que si vous n’avez pas de logiciel de diff/merge d’installé
  • PuTTY comme client SSH

Lancez-ensuite Git Extensions.
Par défaut, il doit vous ouvrir la fenêtre de configuration. Si ce n’est pas le cas, ouvrez là.
Dedans, cliquez sur chaque ligne rouge et configurez là pour qu’elle passe verte (username, git path, etc.)

Une fois ça fait, vous n’avez plus qu’à récupérer le chemin de votre repository à cloner, et à l’ajouter dans votre Git Extensions pour le cloner.

S’il s’agit d’un chemin BitBucket ou Github, pensez à ajouter dans l’url votre username avant le nom de domaine, comme ceci :
https://my_account_name_or_email@github.com/HowTommy/ mycryptochat.git

Ainsi, quand vous essaierez de cloner/push un repository, une popup s'ouvrira pour vérifier votre identité.

And voilà!

En espérant que ça vous soit utile !

Bon dev et bonne semaine à tous/toutes !

Refactoring : la règle des trois

icon Tags de l'article : ,

Mars 16, 2018
Salut tout le monde,

Aujourd'hui on va parler Refactoring.

Je pense que vous vous êtes déjà tou·tes retrouvé·es dans une situation où vous avez besoin de reprendre du code... mais ça vous obligerait à faire un copier coller.

Donc, en tant que bon·ne dev, vous vous dites : "hors de question, je vais refacto pour réutiliser cette méthode/vue ailleurs". Et vous vous lancez dans votre refacto.

Sauf que voilà. En général une refacto de ce type prendra au moins 3x le temps qu'il aurait fallu pour faire un copier/coller... Et rien ne vous assure qu'elle sera utile plus tard.

Ca se trouve, vous perdrez des heures à refacto du code qui ne sera jamais plus utilisé.

Face à cette interrogation, mes collègues m'ont fait découvrir une règle que je ne connaissais pas : la règle de trois.

Elle est très simple : quand vous avez besoin de réutiliser un morceau de code, faites un copier/coller. Si, en revanche, vous en avez à nouveau besoin plus tard, là vous pourrez vous lancer dans une refacto.

En résumé : on peut copier/coller du code, mais une seule fois. Au delà, il faut refacto notre code.

Cette "autorisation de copier/coller" peut permettre d'éviter de se lancer dans d'énormes refacto couteuses qui n'auront aucune utilité. Et le cout sera quasi-nul, car un simple copier/coller c'est souvent l'affaire de quelques minutes...

Bon dev à tou·tes !

S'authentifier en POST avec un WebClient

icon Tags de l'article : ,

Aout 09, 2016
Hello,

Lorsqu'on est comme moi, on a tendance à aimer faire des tools qui vont scraper des pages web à l'aide d'un WebClient C#.

Sauf que voilà, il faut parfois pouvoir s'authentifier pour accéder à des pages qu'on aimerait parser... Et pour ça. Il y a une solution ! :)

Déjà, il va vous falloir une classe dérivée de WebClient qui gère les cookies et l'authentification :

// source : http://stackoverflow.com/questions/11118712/webclient-accessing-page-with-credentials
public class CookieAwareWebClient : WebClient
{
    public CookieAwareWebClient()
    {
        CookieContainer = new CookieContainer();
    }
    public CookieContainer CookieContainer { get; private set; }

    protected override WebRequest GetWebRequest(Uri address)
    {
        var request = (HttpWebRequest)base.GetWebRequest(address);
        request.CookieContainer = CookieContainer;
        return request;
    }
}

Maintenant, vous n'avez plus qu'à utiliser cette classe pour vous authentifier avec un UploadValues (en lui passant vos paramètres POST) :

using (var client = new CookieAwareWebClient())
{                
    // on spécifie que c'est du POST
    client.Headers.Add("Content-Type", "application/x-www-form-urlencoded");

    // cette ligne est ajoutée car parfois les authentifications vérifient le referer
    client.Headers.Add("Referer", "https://referer/if/needed");

    // on crée notre table clef / valeur
    var values = new NameValueCollection
    {
        { "username", "us3rn4me" },
        { "password", "p4ssw0rd" }
    };

    // on s'authentifie
    client.UploadValues("https://url/de/la/page/d/authentification", values);

    // et voilà, on n'a plus qu'à appeler les pages qui nous intéressent, accessibles désormais vu qu'on s'est authentifiés avec le UploadValues !
    var pageContent = client.DownloadString(url);
}

Et le tour est joué !

Bon dev à tous !

Limiter l'usage d'une API avec ASP.Net Web Api

icon Tags de l'article :

Juillet 04, 2016
Hello,

Petite classe perso qui permet de limiter très facilement une API (externe dans mon cas) à 20 appels par 20 secondes :

using System;
using System.Net;
using System.Net.Http;
using System.Web;
using System.Web.Caching;
using System.Web.Http.Controllers;
using System.Web.Http.Filters;

// source: http://stackoverflow.com/questions/20817300/how-to-throttle-requests-in-a-web-api

[AttributeUsage(AttributeTargets.Method, AllowMultiple = false)]
public class ExternalApiThrottleAttribute : ActionFilterAttribute
{
    public const int DefaultDurationOfApiCallingPeriod = 20;
    public const int DefaultNumberOfCallsAllowedPerApiCallingPeriod = 20;

    public int CustomNumberOfCallsPerWindow { get; set; }

    public override void OnActionExecuting(HttpActionContext c)
    {
        if (CustomNumberOfCallsPerWindow == 0)
            CustomNumberOfCallsPerWindow = DefaultNumberOfCallsAllowedPerApiCallingPeriod;

        var allowExecute = false;

        var key = HttpContext.Current.User.Identity.Name;

        if (HttpRuntime.Cache[key] == null)
        {
            HttpRuntime.Cache.Add(key,
                1, // is this the smallest data we can have?
                null, // no dependencies
                DateTime.Now.AddSeconds(DefaultDurationOfApiCallingPeriod), // absolute expiration
                Cache.NoSlidingExpiration,
                CacheItemPriority.Low,
                null); // no callback

            allowExecute = true;
        }
        else
        {
            var previousNumberOfCalls = (int)HttpRuntime.Cache[key];
            if (previousNumberOfCalls < CustomNumberOfCallsPerWindow)
            {
                HttpRuntime.Cache[key] = previousNumberOfCalls + 1;

                allowExecute = true;
            }
        }

        if (!allowExecute)
        {
            c.Response = c.Request.CreateResponse(HttpStatusCode.Conflict, string.Format("You can't request that API so often. Your limit is {0} calls in {1} seconds.",
                CustomNumberOfCallsPerWindow,
                DefaultDurationOfApiCallingPeriod));
        }
    }
}

Et à l'usage, rien de plus simple :

[ExternalApiThrottle]
public IHttpActionResult GetCollection(ODataQueryOptions<Profiles> queryOptions)

Ou encore :

[ExternalApiThrottle(CustomNumberOfCallsPerWindow = 200)]
public IHttpActionResult GetCollection(ODataQueryOptions<Profiles> queryOptions)

A noter : ce code est loin d'être ce qu'il y a de mieux, et je recommande, si vous avez le temps, d'utiliser plutôt le package Nuget WebApiThrottle, bien plus complet et efficace. Je ne partage ce morceau de code que parce qu'il peut éventuellement aider des gens à créer par eux-même un ActionFilterAttribute pour limiter de façon perso l'usage de leur API.

Envoyer un fichier en POST à ASP.Net MVC

icon Tags de l'article :

Juin 27, 2016
Hello,

Petit article qui peut dépanner : comment envoyer un fichier en POST à une route ASP.Net MVC.

Pour ça, côté HTML, on va d'abord créer un input de type file, et un bouton pour uploader notre fichier (appeler notre route en POST) :

<input type="file" name="fileUpload" id="fileUpload" /><br />
<input type="button" value="Upload" id="buttonUpload" class="btn btn-default" />

Côté JS, on va créer une collection de données de formulaire avec FormData, dans laquelle on va poser notre fichier, et ensuite appeler notre route en POST avec $.ajax :

$('#buttonUpload').on('click', function () {
    var data = new FormData();
    var files = $('#fileUpload').get(0).files;
    // ici on teste si on n'a bien qu'un fichier de sélectionné
    if (1 === files.length) {
        // ici on ajoute notre fichier à notre FormData
        data.append("UploadedFile", files[0]);
        // ensuite on appelle notre route en POST
        $.ajax({
            type: "POST",
            url: 'url/to/call',
            contentType: false,
            processData: false,
            data: data,
            success: function (result) {
                alert('success !');
            }
        });
    } else {
        alert('Error: you must choose a file');
    }
});

Et enfin, côté C#, on va récupérer le fichier à l'aide de Request.Files[]. On pourra ensuite récupérer son stream à l'aide de file.InputStream :

[HttpPost]
public ActionResult Import(int? creatorId, int? userId)
{
    var model = new VM();

    // ici on vérifie bien qu'on aie qu'un seul fichier, pas 0 ou 2
    if (Request.Files.Count != 1)
    {
        model.ErrorMessages.Add("You must upload a file to import profiles");
        return Json(model);
    }

    // ici on récupère bien notre fichier
    var uploadedFile = Request.Files[0];

    // ici on teste si notre fichier termine bien par CSV
    if (!uploadedFile.FileName.EndsWith(".csv", StringComparison.OrdinalIgnoreCase))
    {
        model.ErrorMessages.Add("Invalid extension: only CSV file can be used for import");
        return Json(model);
    }

    var fileStream = uploadedFile.InputStream;

    // ...
    // ici on peut appeler notre code métier
    // ...

    return Json(model);
}

Et voilà !

Bon dev à tous !

KnockoutJS, JavaScript et JQuery : notes et exemples perso

icon Tags de l'article : , ,

Juin 24, 2016
Hello,

Une petite liste de notes perso, de morceaux de code et de comment faire 2/3 choses, pour moi, mais qui peut vous servir.

Enjoy !

<!-- quelques databind par défaut -->

<input type="text" data-bind="value: searchText" />
<td data-bind="text: 1 === Role() ? 'User' : 'Admin'"></td>
<p data-bind="visible: currentlyWorking">

<!-- A noter : si on est dans un cas de visible "si pas ce booléen", il faut mettre les parenthèses : -->
<div data-bind="visible: !currentlyWorking()">
<p data-bind="visible: !showSearchResults() && firstSearchDone()">

<!-- Plusieurs paramètres -->
<input class="btn" type="button" value="Add" data-bind="attr: { 'data-value': Id }, visible: !model.IsMethod(Id)" /> 

<!-- Appeler le modèle parent de l'objet KO courant : $parent -->
<span data-bind="visible: null !== ItemId && $parent.apiConsumerId() !== ApiConsumerId">

  • Dans l'idéal il vaut mieux éviter d'avoir de la logique côté vue, il vaut mieux faire des computed :
self.showSearchResults = ko.computed(function () {
    return self.firstSearchDone() && self.searchedUsers().length > 0;
});

// Attraper la touche entrée sur un champ texte
$('#txtSearch').on('keyup', function (e) {
    if (e.which !== 13) {
        return;
    }

    $('#btSearchUser').click();
});

// Passer des informations depuis la vue ASP.Net MVC vers le fichier JavaScript 
<script type="text/javascript">
    var urls = {
        'promoteUser': '@Url.Action("Promote", "User")',
    };
    var initialData = @MvcHtmlString.Create(Newtonsoft.Json.JsonConvert.SerializeObject(Model.Users));
    var currentItemId = @Model.Item.Id;
</script>

// Demander confirmation pour une action dans certaines conditions ?
// Créer une méthode JS globale "mustConfirm()" qui sera appelée avant chaque action critique comme ça :
if (confirm('Are you sure that you want to DELETE this user account? This action CANNOT BE UNDONE.') && mustConfirm()) {

}

// Un appel en direct dans le HTML :
<input type="submit" value="Purge" class="btn btn-default" onclick="return mustConfirm(); " />

// Et cette méthode dans la Layout CSHTML :
var mustConfirm = function () {
    @{
        if (UserHelper.GetCurrentEnvironment().AskForConfirmation)
        {
            <text>return confirm('Attention: This is a production environment with sensitive personal and customer data. Are you sure?');</text>
        }
        else
        {
            <text>return true;</text>
        }
    }
};

// Recharger la page courante
location.reload();

// Récupérer une collection d'observables à partir d'un JSON
// Pour ça on utilise la lib JS ko.mapping :
self.Users = ko.mapping.fromJS(initialData);

// Envoyer un fichier en POST à un contrôleur ASP.Net MVC
var data = new FormData();
var files = $('#fileUpload').get(0).files;
if (files.length === 1) {
    data.append("UploadedFile", files[0]);
    data.append("CreatorId", $('#creatorId').val());
    $.ajax({
        type: "POST",
        url: urls.import,
        contentType: false,
        processData: false,
        data: data,
        success: function (result) {
            if (0 === result.ErrorMessages.length) {
                setTimeout(function() { document.location = urls.importsList; }, 1000);
            } else {
                model.currentlyWorking(false);
                model.LoadResult(result, false);
            }
        }
    });
} else {
    alert('Error: you must choose a file');
}

// et côté ASP.Net MVC
public ActionResult Import(int? creatorId, int? userId)
{
    var context = this.CreateContext();

    var model = new ImportVM();

    if (Request.Files.Count != 1)
    {
        model.ErrorMessages.Add("You must upload a file to import profiles");
        return Json(model);
    }

    var uploadedFile = Request.Files[0];

    if (!uploadedFile.FileName.EndsWith(".csv", StringComparison.OrdinalIgnoreCase))
    {
        model.ErrorMessages.Add("Invalid extension: only CSV file can be used for import");
        return Json(model);
    }

    _importBusiness.Import(uploadedFile.InputStream, context);

    return Json(model);
}

// Exemple complet côté JS 
var model;

(function () {
    var Users = function () {
        var self = this;

        self.firstSearchDone = ko.observable(false);
        self.searchText = ko.observable("");
        self.searchedUsers = ko.observableArray();

        self.currentlyWorking = ko.observable(false);

        self.showSearchResults = ko.computed(function () {
            return self.firstSearchDone() && self.searchedUsers().length > 0;
        });

        self.cleanSearch = function () {
            self.searchedUsers.removeAll();
            self.searchText('');
            self.firstSearchDone(false);
        }
    }

    $('#txtSearch').on('keyup', function (e) {
        if (e.which !== 13) {
            return;
        }

        $('#btSearchUser').click();
    });

    $('#btSearchUser').on('click', function () {
        $('#txtSearch').val('');
        model.currentlyWorking(true);

        $.post(urls.searchUserByName, { text: model.searchText() }, function (response) {
            if (!response.ok) {
                alert(response.errorMessage);
                model.cleanSearch();
            } else {
                model.firstSearchDone(true);
                model.searchedUsers(response.searchedUsers);
            }
            model.currentlyWorking(false);
        });
    });

    // we initialize the model
    model = new Users();

    ko.applyBindings(model);
})();