MVC, JQUERY, AJAX, la réponse JSON au format HTML

Question

Cette question a été posée avant, mais je dois réaliser que je n'ai pas trouvé la meilleure façon de le faire!

Le problème est, que je veux encoder la réponse que je reçois de l'appel AJAX afin d'empêcher les attaques XSS (Cross-site scripting). J'ai un formulaire avec une zone de texte et un bouton de soumission. Lors de la soumission, la valeur est publiée sur le serveur et renvoyée au client. Ici, j'ai besoin de coder html la réponse, comme le message par exemple. pourrait être "alert ('Bonjour')", etc.

Comment puis-je encoder item.Message dans ce qui suit?

Voir

$(document).ready(function() { 

    $("form[action$='SubmitChatMessage']").submit(function() { 
     $.ajax({ 
      url: $(this).attr("action"), 
      type: "post", 
      dataType: "json", 
      data: $(this).serialize(), 
      success: function (response) { 
       $("#chatMessages").empty(); 

       var chatMessages = ""; 
       $.each(response, function (i, item) { 
        chatMessages += '<div>' + item.Message + '</div>'; 
       }); 

       $("#chatMessages").html(chatMessages); 
       $("#message").val(''); // Clear the textbox value 
      } 
     }); 
     return false; 
    }); 
}); 

<div id="chatContent"> 
    <% using(Html.BeginForm("SubmitChatMessage", "ProductDetails")) 
     {%> 
    <%: Html.TextBox("message")%> 
    <%: Html.Hidden("productId", Model)%> 
    <input type="submit" value="Tilføj" /> 
    <% }%> 
    <div id="chatMessages"> 
    </div> 
</div> 

action contrôleur

[HttpPost] 
[ValidateInput(false)] 
public JsonResult SubmitChatMessage(string message, Guid productID) 
{ 

    // 1. Store message in db 

    // 2. Fetch messages from db 
    List<Message> chats = DB.GetMessages(productID); 
    var json = (from c in chats 
       select new {Message = c.Message, CreatedDate = c.Created}); 

    return Json(json); 
} 

espoir d'obtenir une réponse, cela me fait déraisonner! Une question similaire a été donnée here, mais je ne vois pas comment utiliser .text dans mon cas.

MISE À JOUR: Is this really the solution?

Answer 1

Essayez comme ceci:

success: function (response) { 
    var messages = $('#chatMessages'); 
    messages.empty(); 

    $.each(response, function (i, item) { 
     messages.append(
      $('<div/>', { 
       text: item.Message 
      }) 
     ); 
    }); 

    $('#message').val(''); // Clear the textbox value 
} 

Answer 2

Sinon, vous pouvez utiliser quelque chose comme HttpUtility.HtmlEncode sur l'action du contrôleur.

var json = (from c in chats 
      select new { 
       Message = HttpUtility.HtmlEncode(c.Message), 
       CreatedDate = c.Created 
      }); 

return Json(json);