I recently wrote that I added a visual representation for when a search is performed, by autocompleting the search field with the search query. Everything appeared to work as expected.
Some time ago I added Tinfoil Heroku addon and never saw any security problems. I even thought I will never see one. But I started seeing a couple about
Cross-Site Scripting in HTML tag. I went to their dashboard, clicked on reproduce the attack, it took me to my website, with a search performed, the search query was autocompleted, as expected, but a tag was also injected in the search field:
<input type="text" class="search banner-search" name="query" size="17" maxlength="30" placeholder="Search..." value="tinfoil_yGU31" tinfoil_xss_in_tag="fa1a65120bd41529ad60271db0cef24aab4a57c3">
At first, I tried to find a solution for the
ruby approach. It seemed the bug and the solution were pretty simple:
<input type="text" class="search banner-search" name="query" size="20" maxlength="30" placeholder="Search..." value='<%= query_params %>'/> // Replace the ' with "?. // Try ERB::Utils.html_escape. // Try other helpers...
But that didn't work out well, either, for obvious reasons. So I resorted to the
jQuery approach I wrote. I also changed the
split to be done by
query= instead of
=, and I'm pretty sure other edge cases are still possible, but I can't find a better approach for now.