Code Monkey home page Code Monkey logo

rails-html-escaping's Introduction

Rails: html_safe, Sanitization, and XSS

Significance of escaping HTML

The process of escaping HTML converts potentially dangerous characters to a safe form that do not have any functional value.

Escaping the string <div class="element"> Hello </div> would yield &lt;div class=&quot;element&quot;&gt; Hello &lt;/div&gt;

Within the context of web development, HTML escaping is used to prevent XSS vulnerabilities, where malicious input is rendered as HTML on users browsers.

Lets look at an example. If Facebook did not escape HTML, a hacker could post the text <script>alert(document.cookie)</script> on their wall, so that when other users view that post, their cookies would be displayed in a pop-up box, because that piece of text would be rendered as HTML on a users web browser. By escaping that HTML, the malicious characters in that string would be converted to a different format, and therefore the string would no longer be rendered as HTML.

Ruby's .html_safe function

When Rails is rendering content any Strings being rendered will automatically be escaped. The .html_safe function is used to prevent this from happening, to prevent Strings from automatically being escaped.

Lets look at some examples

"bar".class
# => String

"bar".html_safe.class
# => ActiveSupport::SafeBuffer

Calling .html_safe on a String converts that string to a SafeBuffer, which means that when Ruby on Rails renders a view that SafeBuffer will not be automatically escaped.

When Ruby on Rails renders a view, it creates an empty SafeBuffer and then concatenates each line, one by one, to that SafeBuffer. If an element that is being concatenated is a String, it will be escaped, but if it is a SafeBuffer it will not be.

<p class="text">.html_safe + <strong>
# => "<p class="text>&lt;strong&gt;"

<div class="element>.html_safe + <address> + </div>.html_safe
# => "<div class="element>&lt;address&gt;</div>"

Further Reading on .html_safe

Source: Rails Core Repository

class String
  def html_safe
    ActiveSupport::SafeBuffer.new(self)
  end
end

Functions: h, raw, <%==

h

The function h is a helper method for the function html_escape. h will escape whatever input it is given, as long as that input is not marked as html_safe

<% puts h "<div>hello</div>" %>
# => "&lt;div&gt;hello&lt;/div&gt;"

<% puts h "<div>hello</div>".html_safe %>
# => "<div>hello</div>"

Rails Source Code:

def html_escape(s)  # remember: h is a helper method for html_escape
  unwrapped_html_escape(s).html_safe
end

def unwrapped_html_escape(s) # :nodoc:
  s = s.to_s
  if s.html_safe?
    s
  else
    CGI.escapeHTML(ActiveSupport::Multibyte::Unicode.tidy_bytes(s))
  end
end

raw

Rails Source Code:

def raw(stringish)
  stringish.to_s.html_safe
end

raw will first convert its input to a String, and then mark it as html_safe. It will return its input without escaping it, and therefore can be dangerous if used with unsafe user input.

@unsafe_user_input = "<script>alert(document.cookies)</script>"

...

<div class="element">
  <%= raw @unsafe_user_input %> # danger!
</div>

# =>

<div class="element">
  <script>alert(document.cookies)</script>
</div>

<%==

<%== ... %> is an alias for raw. It has exactly the same behavior.

This guide is still under construction

rails-html-escaping's People

Contributors

patrickmcgrath29 avatar

Stargazers

 avatar

Watchers

 avatar

Forkers

jmmalaca

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.