Server side HTML encoding with EXT JS front end

[icantthinkofausername]

Hi,

Recently I've been playing around with various HTML encoding of values on the server to avoid things like XSS attacks. Before we go the best route, which is probably checking and sanitizing all input on the server, I've been using the ESAPI library's encodeForHTML. Everything works fine until I go to load an ext form with the data.

As an example, lets say we have an address stored in a db as "111 East Kilborn St". I encode it on the server and it becomes

111#x20EAST#x20KILBORN

Thats the hex value. I send this down as JSON just fine to EXT-JS. It appears fine in our grid, but when we load that piece of data into an ext form field like a textbox it actually shows up as

111#x20EAST#x20KILBORN

, when I want those hex characters to represent spaces.

Any idea why this is happening? Is there a way to get it to appear much like the grid and show up almost as decoded? But without compromising security?

[icantthinkofausername]

Hi,

Recently I've been playing around with various HTML encoding of values on the server to avoid things like XSS attacks. Before we go the best route, which is probably checking and sanitizing all input on the server, I've been using the ESAPI library's encodeForHTML. Everything works fine until I go to load an ext form with the data.

As an example, lets say we have an address stored in a db as "111 East Kilborn St". I encode it on the server and it becomes "111 EAST KILBORN". I send this down as JSON just fine to EXT-JS. It appears fine in our grid, but when we load that piece of data into an ext form field like a textbox it actually shows up as "111 EAST KILBORN".

Any idea why this is happening? Is there a way to get it to appear much like the grid and show up almost as decoded? But without compromising security?

Oops. The formatting on the forums cleaned up my example .

On the way down from the DB it turns into

111#x20;EAST#x20;KILBORN

where that #code is the hex html encoding of space. This is also showed in the textbox, when I want it to show the spaces.

[Nesta]

have you tried this with a editorGrid? (new Ext.grid.EditorGrid and add editor: new Ext.form.TextField({}) to your column
definition)
just to check if the problem is load stuff of your form

maybe you have configure a maxLength in you form and the text is to long

[icantthinkofausername]

Hmm sorry it wasnt just the length, I forgot to wrap the example in code tags!

[Nesta]

the Formfield setValue function just updated the dom object of the FormField.
If rendered to a GridPanel, a Ext.XTemplate is applied somewhere.

never worked with Templates so i can not help you here. but i'm pretty sure, defining the right tpl config
of your Form elements will fix the problem

[icantthinkofausername]

I'm beginning to think this is a javscript thing more than EXT. I'm suprised I'm the only one to encounter it

[icantthinkofausername]

Well,

It looks like part of it is my ignorance. JavaScript encoding is different than HTML encoding. The problem at the moment almost seems like a design one though.

It more or less turns into how do I encodeForHtml for things like grids, yet encodeForJavascript for things like textboxes.

[weelillad]

Have you found any good solution to your problem? I'm encountering the same thing now..

[icantthinkofausername]

Like I said it usually boils down to a design problem.

Textboxes do not html decode (at least when set through javascript) while things like grids (built from html) display fine. Someone gave me a javascript htmlDecode that seemed to do the job (I overrided the textbox setValue and some other components to use it). There is probably a better js function, but this seems to work for all intensive purposes.

[weelillad]

Thanks for the tip. I alternated between encoding for HTML and encoding for JavaScript at the server, and found that encoding for HTML is the better way. Grids linked to stores will display without issue. To decode the HTML entities, another thread in this forum suggested making use of the browser's own HTML encoder/decoder to do it, which might be the "better js function" that you're looking for.

EDIT: The thread link above isn't obvious -- http://www.sencha.com/forum/showthre...L-Entities-2.0