Autolinker.js
Autolinker.js copied to clipboard
gregjacobs
How to sanitize input text
Is there a recommended way hot to sanitize text before passing it to Autolinker? The usual way to escape html tags will also distort some URLs.
Could you give us a concrete example of what you are talking about? It would help to understand what is problematic. :)
Sure.
If user input is:
Take look at https://www.google.cz/?gfe_rd=cr&ei=GYmlWM-VG_Tf8geNmIfYDA#q=autolinker and <a href="javasript:alert('hi')">hi</a>
I need to render:
Take look at <a href="https://www.google.cz/?gfe_rd=cr&ei=GYmlWM-VG_Tf8geNmIfYDA#q=autolinker">https://www.google.cz/?gfe_rd=cr&ei=GYmlWM-VG_Tf8geNmIfYDA#q=autolinker</a> and <a href="javasript:alert('hi')">hi</a>
So html characters &<>"' are escaped everywhere except the link href attribute.
This is something that Linkify plugin has solved but I don't see how I should do it using Autolinker.js.
Not quite sure if I understand your question, but the goal of Autolinker is to link as much as possible so yeah, I think Autolinker will link the first link and also keep the the second part as a link. Maybe you could use the Linkify plugin for the part that you want to escape, but if the goal is to detect automatically that it is a html link and escape it, I don't think that Autolinker does it.
If you see a structure that Autolinker could have that could allow this, feel free to tell us and we'll see if we can implement it ! :)
We both probably agree that Autolinker output is meant to be inserted into HTML. And that the original input we want to transform comes from the website user. For example we we want to improve his comment by making URLs clickable. Right?
Somewhere between the user inputting his text and rendering the output into HTML two things has to happen:
- Sanitizing input so that user cannot perform XSS attack. The easiest way is to escape HTML tags.
- Converting plain URLs into links.
My question is how these these things should be orchestrated together. Linkify does both. Autolinker seems to perform only the second one and I don't know where to sanitize input without distorting URLs (concretely the & characters) for Autolinker.
Side note: I already decided for Linkify over Autolinker because of this. But I would like to understand how do you expect this to be handled. Probably I'm just missing something. :smile:
After further investigation it seems that Autolinker behavior is very similar to linkifyHtml method, which preserves HTML tags compared to linkifyStr method which escapes them.
Input:
Pause & look at http://g.com?a=1&b=2. Plus <a href="dangerous">something dangerous</a>.
linkifyStr:
Pause & look at <a href="http://g.com?a=1&b=2" class="linkified" target="_blank">g.com?a=1&b=2</a>. Plus <a href="dangerous">something dangerous</a>.
linkifyHtml:
Pause & look at <a href="http://g.com?a=1&b=2" class="linkified" target="_blank">g.com?a=1&b=2</a>. Plus <a href="dangerous">something dangerous</a>.
Autolinker:
Pause & look at <a href="http://g.com?a=1&b=2" target="_blank" rel="noopener noreferrer">g.com?a=1&b=2</a>. Plus <a href="dangerous">something dangerous</a>.
Upvote to add an option to disable html parsing and threat input as text as the linlkyStr example above. To be honest, I think the option should be also default on, as current behaviour is bit dangerous.
I'm using this in conjunction with sanitize-html. First I run the text through the autolinker plugin, and then that output thru sanitize-html
