Feature request: ability to configure a custom html escaping function.

[limscoder]

No description provided.

[sophiebits]

Why?

[limscoder]

My organization's XSS policy is not 'escape all the things'. We have to strip out some tags (like script) and we don't escape other tags (like a). I know this is a stupid policy, but changing the policy now would require rewriting a bunch of legacy code, handling of white-listed tags in existing data, rewriting security test suites, and a new external security audit.

Instead we have to do this all over our React components:

<div dangerouslySetInnerHTML={{ __html: customEscapeFunc(this.props.foo) }} />

Being able to configure the default escaping function, or offering something similar to the syntax below would make our code a lot cleaner.

<div setCustomEscapedHtml={ this.props.foo } />

[jimfb]

Not escaping the a tag leaves you vulnerable to someone creating a link of the form: <a href="javascript:alert('I can execute arbitrary javascript');">Click me!</a>. The img tag is even more vulnerable. Trying to create a blacklist sanitizer is inherently a flawed approach to security, and should be discouraged.

Also, you can have your custom escape function create the __html field, as shown here:

function myEscapeFunc() { return {__html: customEscapeFunc()}; }

Allowing you to do:
<div dangerouslySetInnerHTML={myEscapeFunc(this.props.foo) } />

Which mostly gets you what you want.

It doesn't make sense to add a feature in order to support a broken security policy. I'm going to close out this bug, unless someone has a stronger motivating reason for such a feature.

[limscoder]

In my case our custom escaping function properly handles the case of <a href="javascript:alert('I can execute arbitrary javascript');">, as well as many more complex cases, and has both an extensive test suite and has successfully made it through several external security audits. The mitigation above does improve the code somewhat, but it would still be nice to have a less verbose way to invoke it.