How to encode javascript string for display and post back?

Question

I have an MVC application that is rendering rendering the following javascript on the client:

var rawData = [{"ID":5317,"Code":"12345","Description":"sometext \u003c/= 100"}];

The JSON data is a result of serializing an object using the JavaScriptSerializer and then running the result through the Html.Raw() helper.

This data is then used to load a knockout view model and display a popup on hover. In the popup, only the "sometext" portion of the "Description" property is being shown as the string gets converted to the unencoded version when setting the rawData variable (i.e. \u003c is converted to <).

Also, this data ends up being sent back to the server upon saving of data, and the ASP.NET validation kicks in and fails the request as it detects the "

I've worked around this, temporarily, by adding a computed property to my Knockout View Model like so:

self.DescriptionEncoded = ko.observable('');
self.Description = ko.computed({
             read: function() {
                  return self.DescriptionEncoded ();
             },
             write: function(value) {
                 self.DescriptionEncoded($('<div/>').text(value).html());
             }
         });

In this way I can access the escaped property from my popup and the unescaped value is not sent back to the server when I serialize my viewmodel (using .toJSON()).

Is there a more global way to handle this rather than creating computed properties for every object that may have some text that appear to be a bad request while not compromising on security? I've considered an overload/helper to the serialization routine that would accept a list of properties to apply a Find/Replace I am thinking this will have to be handled on a case by case basis in a manner similar to what I've already done. As for sending the data back to the server, I could override the toJSON() method on my view model and delete the properties that don't need to be sent back, but that won't help me with my popup.

Thoughts?

Answer 1

You can encode using Ajax.JavaScriptStringEncode. You might also get the AntiXSS library and use it for the encoding.

I hope I understood your question well.