jqGrid and XSS Security

Author: Craig Stuntz

Version 3.5.2 of jqGrid included an important new feature:

Now when autoencode is set to true we encode the data coming from server and not only when we post it (secutity fix)

Prior to this, you were required to encode the data yourself.

Now personally, I think that should be the default. But it would have been a breaking change for the grid, since there are a few cases where you want to display unencoded data (I’ll discuss these exceptional cases in a second).

It’s really easy to make this the default for your application. Set the grid’s defaults before you create any grids:

    $.jgrid.defaults = $.extend($.jgrid.defaults, {

            autoencode: true,

            datatype: 'json',

            // etc....

You can override this in the rare cases when you don’t want encoded data by setting autoencode false when setting up your grid:

    $("#grid").jqGrid({

                    autoencode: false,

                    url: "/Some/Path",

                    // etc....,

So why wouldn’t you want to use this setting? I can think of two reasons:

1. The server is returning markup which you don’t want to encode. If you have a server method which is returning markup (e.g., “<img src=…”), then you won’t want the grid to encode it. It then becomes your responsibility to sanitize the rest of the grid data on the server.

• There is a performance cost to doing the encoding in JavaScript. If you are absolutely certain that the server method you’re calling can return only sanitized data, then you can turn off the auto encoding and save this cost. Note that many JSON encoders, such as the “Json()” method in ASP.NET MVC will not encode HTML by default.

Note that you can only set autoencode at the grid level, not at the column level.

If you use custom formatters in your grid, then you should note that the strings they return will not be HTML encoded, even if you set autoencode true. This is probably a good thing, since it is common to use custom formatters to return HTML. However, it means that if you write a custom formatter, then you must ensure that any user data contained in the string and returns is encoded. You can use the grid’s encoder, which is little more than a string replace on angle brackets, in a custom formatter as follows:

    myFormatter: function(cellval, opts, action) {

        if (cellval) {

            return $.jgrid.htmlEncode(cellval.Name + "");

        };

        return "";

    }