Filtering User Input to Remove Html and Script Tags Can Help Prevent Which of the Following Attacks?


10.ane. Preventing Cantankerous Site Scripting Vulnerabilities¶

Cross Site Scripting (XSS) vulnerabilities allow user-supplied data to be incorrectly executed as code in a web browser. It can be hard to write code that is safe from XSS security vulnerabilities. This section presents best practices for treatment proper escaping in the Open edX platform to avoid these vulnerabilities.

Note

If yous become enlightened of security issues, practise not report them in public. Instead, please e-mail security@edx.org.

  • Philosophy and General Rules

  • Types of Context and Escaping

  • Editing Template Files

  • Making Legacy Mako Templates Safe past Default

  • XSS Linter

  • Advanced Topics

  • Additional Resource

ten.1.one. Philosophy and General Rules¶

The philosophy backside the recommendations in this section is to make things every bit simple as possible for developers. Protecting confronting XSS vulnerabilities typically requires properly escaping user-provided data earlier it is placed on the folio. Rather than trying to determine if data is user-provided and could exist compromised, we will play it safety and escape data whether information technology is user- provided or not. Unfortunately, because there are many dissimilar rules for escaping, yous yet must choose the proper type of escaping.

Hither are some general rules.

  1. Escape always. Assume that all data is untrusted and escape information technology appropriately. Exercise not endeavor to determine whether data could or could not be manipulated past a user.

  2. Escape late. Delay escaping equally long every bit possible, until you can see the actual context and empathize the proper escaping that is required for the context. Browsers interpret dissimilar contexts such as HTML, URLs, CSS, and Javascript/JSON with unlike rules, so there are different escaping requirements based on where the information is existence used in a page.

  3. Escape appropriately. Know what kind of data you have (for example, HTML, plain text, or JSON) and where it is going (for example, HTML or JavaScript). Choose the proper escaping role based on these details.

  4. Validation is non sufficient. Validating inputs does non replace the need to properly escape. In some cases, this may reduce the likelihood of potential issues, but proper escaping is ever necessary.

  5. Practise non store escaped data. Again, because y'all do not know alee of time all the places that the data will be used, y'all must wait until y'all have the proper context to decide on the proper escaping.

x.1.two. Types of Context and Escaping¶

  • Overview of Contexts

  • HTML Context and Escaping

  • JavaScript Context and Escaping

  • CSS Context and Escaping

  • URL Context and Escaping

10.ane.two.1. Overview of Contexts¶

The following diagram provides a high-level overview of the relationship between the different templates, different contexts of DOM cosmos and manipulation, and dissimilar types of escaping. As a general rule, proper escaping is related to the context in which the information is being written, and might not match the context that will somewhen be reading the information.

A diagram detailing how data flows from Django applications and Django models through Mako templates and Django templates into an HTML page. Data can then flow from the HTML page into JavaScript, and back down into the DOM through jQuery or Underscore.js templates.

In the Open edX platform, data flows from the application to the initial HTML page mainly through the use of Mako templates.

Descriptions of each numbered arrow in the diagram follow.

  1. This step represents the use of Mako templates to write general HTML tags (that is, tags other than <script> tags) to create the HTML page. Any data written to the page inside one of these HTML tags or HTML attributes must exist HTML-escaped to exist treated as evidently text.

  2. This step represents the use of Mako templates to write JavaScript inside a <script> tag in the HTML page. Information written to this context must all be JavaScript-escaped to continue information technology from mistakenly being treated as HTML. Annotation that this data should non exist HTML-escaped, which must happen in a after stride if it is written back to the DOM by JavaScript.

  3. This step represents the loading and executing of JavaScript from the HTML folio by the JavaScript engine. This step should exist safe, if information was properly JavaScript-escaped before.

  4. In this step, JavaScript might load additional data from HTML tags and attributes using the DOM. Sometimes data is passed in this way via data attributes. This data is typically read using jQuery functions, only it tin exist read using other JavaScript functions. The data can exist in the form of plain text strings or JSON. If information technology is in the form of strings, this information should mostly be plain text. Be careful with the escaping in this instance. Although the data is used in JavaScript, information technology is transmitted equally HTML, and then must be HTML-escaped.

  5. In this footstep, JavaScript is being used to edit the DOM, often past creating HTML tags or setting HTML attributes. Often this is done using jQuery functions. Since HTML tags and attributes are being written here, whatsoever plain text must be properly HTML-escaped.

  6. This step represents a subset of DOM manipulation using JavaScript, specifically through use of Underscore.js templates. Although these templates have a specific syntax for escaping, because HTML tags and attributes are being written any plain text must be properly HTML-escaped.

x.1.two.ii. HTML Context and Escaping¶

The outermost context of an HTML file is HTML. In an HTML context within an HTML file, information is kept safe past HTML-escaping.

10.i.2.2.1. How HTML-Escaping Makes HTML Safe¶

Permit'due south review a uncomplicated example of an XSS attack and how proper escaping might prevent such an attack. Imagine that we find the following expression in a Mako template.

                                                <div>                        ${                        course_name                        }                        </div>                      

Imagine further that someone uses Studio to set the course name equally shown in this example, including the HTML <script> tag.

                                                <script>alarm('XSS assault!');</script>                      

The following resulting unsafe page source is sent to the browser.

                                                <div><script>alert('XSS assail!');</script></div>                      

The browser would execute the JavaScript lawmaking in the <script>alert('XSS attack!');</script> tag. The user has injected lawmaking into the page that would display a pop-upward alert, which we would non desire to allow. Because this attack could contain arbitrary JavaScript that would be executed by the browser with the same trust as whatever JavaScript that is sent from the application, information technology has the potential to do something much more malicious than merely displaying a pop-upwardly. An instance might be to steal and e-mail the user's cookies.

In Mako, you can innovate HTML-escaping for all expressions on a page using the folio directive with the h filter. Hither is an example of an expression that is properly HTML-escaped.

                                                <%                        folio                        expression_filter=                        "h"                        />                                                ...                        <div>                        ${                        course_name                        }                        </div>                      

The resulting safe page source is as follows.

                                                <div>&lt;script&gt;alert(&#39;XSS!&#39;);&lt;/script&gt;</div>                      

This time, the browser volition not translate the <script> tag equally a JavaScript context, and instead only displays the original string in the page.

10.1.2.three. JavaScript Context and Escaping¶

The outermost context of a JavaScript file is JavaScript. An HTML file also contains a JavaScript context within a <script> tag. Inside a JavaScript context, information is kept rubber by JavaScript-escaping.

ten.one.2.3.i. How JavaScript-Escaping Makes HTML Rubber¶

Here is an example of an expression used in a valid JavaScript context. It is created using a <script> tag inside a Mako template.

                                                <script blazon="text/javascript">                                                  var courseName = "                        ${                        course_name                        }                        ";                                                  ...                        </script>                      

For this example, imagine that someone uses Studio to fix the course name every bit shown here.

The resulting unsafe page source, sent to the browser with no escaping, would look like this.

                                                <script type="text/javascript">                                                  var courseName = "";alert('XSS attack!');"";                                                  ...                        </script>                      

You can meet how the attacker airtight out the cord and again tricked the browser into executing the malicious JavaScript in the context of JavaScript. There are several reasons why you do non want to use the default HTML-escaping here.

  1. JavaScript-escaping will also escape all characters that are special characters in HTML, such every bit < . All the same, JavaScript-escaping will escape < to \u003C , rather than to &lt; . This volition nevertheless keep the browser from finding an HTML tag where it does not belong.

  2. The resulting string might non ultimately exist used in an HTML context, and then HTML entities might non be the proper escaping.

The fashion to properly JavaScript-escape lawmaking in Mako is shown in the following example.

                                                <%!                        from                        openedx.core.djangolib.js_utils                        import                        js_escaped_string                        %>                                                ...                        <script type="text/javascript">                                                  var courseName = "                        ${                        course_name                        |                        n                        ,                        js_escaped_string                        }                        ";                                                  ...                        </script>                      

The code in a higher place would produce the following prophylactic folio source.

                                                <script type="text/javascript">                                                  var courseName = "\u0022\u003Balert(\u0027XSS set on!\u0027)\u003B\u0022\u0022\u003B";                                                  ...                        </script>                      

10.1.2.4. CSS Context and Escaping¶

The browser treats any code inside a <style> tag or style attribute in an HTML page every bit a CSS context, or something that requires CSS parsing. CSS parsing has its ain rules, and requires CSS-escaping.

In a CSS context, the post-obit boosted constraints are required to go on user supplied data rubber.

  • User supplied information tin can but appear as the value of a way property. In other words, never allow a user to supply the entire contents of the style tag or mode property, or annihilation exterior of the limited scope of an private holding value.

  • User supplied URLs must use ane of these prophylactic protocols: "http:", "https:", or "". Doing so prevents users from being able to supply a URL that uses the "javascript" protocol as an example.

  • User supplied fashion property values must not incorporate expression(...) due to an IE feature that would enable capricious JavaScript to run.

At that place are no existing helper functions for these boosted constraints in the platform. If you need to use user supplied data in a CSS context, you lot must work with edX to assistance expand the suite of available helpers.

For more information, see OWASP: CSS and XSS.

10.1.2.5. URL Context and Escaping¶

URLs require multiple types of escaping. This typically involves URL-escaping in addition to either HTML-escaping or JavaScript-escaping.

There are many special characters that are meaningful in a URL. For example, both & and = are used to designate parts of the query string. If data is being provided equally a query parameter, and information technology might contain special characters, it must be fully URL-escaped. This is specially truthful with user provided information, which can contain any character. Using the JavaScript URL- escaping functions as an instance, you lot would use the encodeURIComponent function on the data which will URL-escape all special characters. Here is an example.

                                            var                      url                      =                      "http://test.com/?information="                      +                      encodeURIComponent                      (                      userData                      )                    

URL-escaping is susceptible to double-escaping, significant yous must URL-escape its parts exactly once. Information technology is best to perform the URL-escaping at the time the URL is being assembled.

Additionally, yous volition typically HTML-escape or JavaScript-escape a URL post-obit the same rules for any other data added to the page, since a properly URL-escaped URL might still contain characters that are meaningful in an HTML context, such as & and ' .

For example, when a URL is added to the href attribute of an ballast tag ( <a> ), it should already be properly URL-escaped, and in improver needs to be HTML-escaped at the time information technology is added to the HTML. When you meet & between query parameters every bit an &amp; in your HTML folio source, y'all tin can residue easy.

Note

If the entire URL is user provided, additional validation is required.

When an entire URL (rather that but some query parameters) is user provided, you must also validate the URL to make sure it uses a whitelisted or acceptable protocol, such as https. Doing and then prevents users from being able to supply a URL that uses the "javascript" protocol as an example.

For more information, see OWASP: URL Escape.

10.1.iii. Editing Template Files¶

When y'all edit template files (including Mako templates, Underscore templates, or JavaScript), use the appropriate conventions.

The topics that follow accost these points for each type of file.

  1. What has to be at the superlative of the file (if annihilation) to make it rubber?

  2. How is code properly escaped? The answer is different depending on the templating language and the context.

  3. How do yous properly handle internationalization and escaping together? For more data, see Internationalization Coding Guidelines.

Note

Remember to accept into business relationship the type of file in addition to the programming language involved. For example, JavaScript embedded in an HTML Mako template is treated differently than JavaScript in a pure .js file.

To find the proper guidelines to follow, commencement start with the advisable file type beneath.

  • Django Template Files

  • Mako Template() Calls in Python Files

  • Mako Template Files

    • HTML-Escape past Default in Mako

    • Determining the Context in Mako

    • HTML Context in Mako

    • JavaScript Context in Mako

    • URL Context in Mako

    • Mako Defs

  • JavaScript Files

    • React (JSX) files

    • Legacy JavaScript files

    • JavaScript edx Namespace

  • CoffeeScript Files

  • Underscore.js Template Files

10.1.iii.2. Mako Template() Calls in Python Files¶

If a Mako template is loaded from Python outside of the general template loading scheme, the following default filters should be provided to brand the template safe by default (i.due east. use HTML-escaping by default).

                                            template = Template(" ... ",                                              default_filters=['decode.utf8', 'h'],                      )                    

10.1.iii.3. Mako Template Files¶

This topic covers the all-time practices for protecting Mako template files from XSS vulnerabilities.

To convert a legacy Mako template to be safe by default, information technology is recommended that you complete the following steps.

  1. Read through the subtopics in this section and go familiar with the current best practices.

  2. Follow the step-by-step instructions detailed in Making Legacy Mako Templates Condom past Default, which volition often refer back to this department.

x.1.3.3.1. HTML-Escape past Default in Mako¶

For Mako templates, all expressions apply HTML-escaping by default. This is accomplished past calculation the following directive to the very top of each template.

                                                <%                        folio                        expression_filter=                        "h"                        />                                              

Using this default HTML-escaping, the following combination represents an HTML-escaped expression.

                                                <%                        folio                        expression_filter=                        "h"                        />                                                ...                        ${                        data                        }                                              

Note

Mako templates can just take a single <%folio> tag. If there is already a <%page> used for args, y'all must combine the two.

If you lot need to disable the default filters, you must use the n filter every bit the start filter. This can be seen in some of the examples below.

For a more in depth understanding of n filters, see Mako Filter Ordering and the due north Filter.

10.1.3.iii.two. Determining the Context in Mako¶

Well-nigh of the Mako template files are in an HTML context. That is why HTML-escaping is a skillful default choice.

A JavaScript context is oft setup implicitly through the use of the <%static:require_module> tag. In our legacy lawmaking, you might likewise come across explicit <script> or <script type="text/javascript"> tags that initiate a JavaScript context. In that location are some exceptions where a <script> tag uses a unlike blazon that should be treated as an HTML context rather than a JavaScript context, for example, in <script type="text/template"> .

Also, brand sure y'all follow the best practices for URL Context and Escaping when working with URLs, and CSS Context and Escaping when in the context of a <style> tag or style attribute.

10.one.3.3.3. HTML Context in Mako¶

Almost Mako expressions in an HTML context will already be properly HTML-escaped. See HTML-Escape by Default in Mako.

The default HTML-escaping is all that is required, fifty-fifty when passing JSON to a data attribute that might later be read past JavaScript. See the following example.

                                                <%                        page                        expression_filter=                        "h"                        />                                                ...                        <div                                                  data-grade-name='                        ${                        form                        .                        name                        }                        '                                                  information-course-options='                        ${                        json                        .                        dumps                        (                        course                        .                        options                        )                        }                        '                        ></div>                      

For translations that incorporate no HTML tags, the default HTML-escaping is enough. You must but import and use ugettext every bit shown in the following simple example.

                                                <%                        page                        expression_filter=                        "h"                        />                                                <%!                        from                        django.utils.translation                        import                        ugettext                        every bit                        _                        %>                                                ...                        ${                        _                        (                        "Form Outline"                        )                        }                                              

For more complicated examples of translations that mix plain text and HTML, use the HTML() , Text() , and format() functions. Use the HTML() function when you have a replacement string that contains HTML tags. For the HTML() function to work, you must get-go employ the Text() function to wrap the plain text translated cord. Both the HTML() and Text() functions must exist closed before any calls to format() . You volition not use the Text function where you don't need the HTML() function. See the following example for how to import and use these functions.

                                                <%                        page                        expression_filter=                        "h"                        />                                                <%!                        from                        django.utils.translation                        import                        ugettext                        as                        _                        from                        openedx.core.djangolib.markup                        import                        HTML                        ,                        Text                        %>                                                ...                        ${                        Text                        (                        _                        (                        "Click over to {link_start                        }                        the habitation page{link_end}.")).format(                                                  link_start=HTML('<a href="/abode">'),                                                  link_end=HTML('</a>'),                        )}                      

For a deeper understanding of why you must use Text() when using HTML() , run across Why Exercise I Need Text() with HTML()?.

For more details about translating strings and ensuring proper escaping, see Internationalization Coding Guidelines.

There are times where a block of HTML is retrieved using a function in a Mako expression, such as in the following example.

                                                <%                        folio                        expression_filter=                        "h"                        />                                                from openedx.core.djangolib.markup import HTML                        ...                        ${                        HTML                        (                        get_course_date_summary                        (                        course                        ,                        user                        ))                        }                                              

In this example, you use the HTML() part to declare the results of the function as HTML and plow off the default HTML-escaping. Using the HTML() function by itself can be very dangerous, unless you make sure that the function returning the HTML has itself properly escaped any plain text.

10.1.3.three.four. JavaScript Context in Mako¶

As a general guideline, JavaScript in Mako templates should be kept to an absolute minimum for a number of reasons.

  • Information technology is very difficult to mix syntax appropriately, which tin lead to bugs, some of which might atomic number 82 to security issues.

  • The JavaScript lawmaking cannot easily exist tested.

  • The JavaScript code does not become included for code coverage.

For new code, the only JavaScript code in Mako that is appropriate is the minimal RequireJS lawmaking used to glue the server side and client side code. Often this is done with factory setup code to laissez passer data to the client.

Special Mako filters are required for working with Mako expressions within a JavaScript context.

When you need to dump JSON in the context of JavaScript, you must use either the js_escaped_string or dump_js_escaped_json filters.

With js_escaped_string you must supply the enclosing quotes. When None is supplied to js_escaped_string , it results in an empty string for convenience.

Often, the JavaScript context is set up implicitly through the use of <%static:require_module> . In our legacy code, you might besides see explicit <script> or <script blazon="text/javascript"> tags initiating a JavaScript context.

Here is an example of how to import and apply js_escaped_string and dump_js_escaped_json in the context of JavaScript in a Mako template.

                        <%namespace name='static' file='static_content.html'/> <%! from openedx.cadre.djangolib.js_utils import (     dump_js_escaped_json, js_escaped_string ) %> ... <%static:require_module module_name="js/course_factory" class_name="CourseFactory">     CourseFactory({         course_name: '${course.name | n, js_escaped_string}',         course_options: ${course.options | n, dump_js_escaped_json},         course_max_students: ${course.max_students | north, dump_js_escaped_json},         course_is_great: ${course.is_great | n, dump_js_escaped_json},     }); </%static:require_module>                      

If y'all have a cord that already contains JSON rather than a Python object, see Strings Containing JSON in Mako for how to resolve this state of affairs.

In full general, the JavaScript lawmaking within a Mako template file should be succinct, simply providing a bridge to a JavaScript file. For legacy lawmaking with more complicated JavaScript code, y'all should additionally follow the all-time practices documented for JavaScript Files.

ten.1.3.3.5. URL Context in Mako¶

To properly URL-escape in Python, you lot can employ the urllib package.

For more details nigh URLs, see URL Context and Escaping.

x.one.three.3.half dozen. Mako Defs¶

In a Mako %def we encounter one of the rare cases where we need to turn off default HTML-escaping using | northward, decode.utf8 . In the example below, this is washed considering the expression assumes that the required JavaScript-escaping was already performed past the caller.

Be extremely careful when yous use | due north, decode.utf8 , and make sure the originating lawmaking is properly escaped. Note that the n filter turns off all default filters, including the default decode.utf8 filter, and so it is added back explicitly. Here is an example.

                                                <%                        page                        expression_filter=                        "h"                        />                                                ...                        <%                        def                        proper noun=                        "require_module(module_name, class_name)"                        >                                                                          <script type="text/javascript">                                                  ...                                                                        ${                        caller                        .                        body                        ()                        |                        n                        ,                        decode                        .                        utf8                        }                                                                          ...                                                  </script>                        </%                        def                        >                                              

For more information, run into Mako: Defs and Blocks.

10.1.3.four. JavaScript Files¶

10.ane.3.4.2. Legacy JavaScript files¶

Notation

The following instructions detail legacy technologies that have been deprecated, but are yet actively used in edx-platform. For new code, see React (JSX) files.

JavaScript files are often used to perform DOM manipulation, and must properly HTML-escape text earlier inserting information technology into the DOM.

The UI Toolkit introduces various StringUtils and HtmlUtils that are useful for treatment escaping in JavaScript. You tin can declare StringUtils and HtmlUtils every bit dependencies using RequireJS define , as seen in the following instance.

                                                define                        ([                        'backbone'                        ,                        'underscore'                        ,                        'gettext'                        ,                        'edx-ui-toolkit/js/utils/string-utils'                        ,                        'edx-ui-toolkit/js/utils/html-utils'                        ],                        function                        (                        Backbone                        ,                        _                        ,                        gettext                        ,                        StringUtils                        ,                        HtmlUtils                        )                        {                        ...                      

If you are working with code that does not utilise RequireJS, then this approach volition non be possible. In this situation you can admission these functions from the global edx namespace instead. For more information, see JavaScript edx Namespace.

The following HtmlUtils functions all brand use of HtmlUtils.HtmlSnippet . An HTML snippet is used to communicate to other functions that the string it represents contains HTML that has been safely escaped every bit necessary.

The HtmlUtils.ensureHtml() function volition ensure y'all have properly escaped HTML by HTML-escaping whatever plainly text cord, or only returning any HTML snippet provided to it.

If you must perform string interpolation and translation, and your cord does non contain whatever HTML, so employ the plainly text StringUtils.interpolate() office as follows. This part will not escape, and follows the all-time practice of delaying escaping every bit tardily as possible. Since the result is a plain text cord, it would properly exist treated as unescaped text past any of the HtmlUtils functions.

                                                StringUtils                        .                        interpolate                        (                        gettext                        (                        'You lot are enrolling in {courseName}'                        ),                        {                        courseName                        :                        'Rock & Coil 101'                        }                        );                      

If you are performing string interpolation and translation with a mix of evidently text and HTML, then you must perform HTML-escaping early and the result tin can exist represented past an HTML snippet. Utilize the HtmlUtils.HTML() function to wrap any string that is already HTML and must not be HTML-escaped. The office HtmlUtils.interpolateHtml() volition perform the interpolations and volition HTML-escape whatsoever plain text and non HTML-escape anything wrapped with HtmlUtils.HTML() . See the following example.

                                                HtmlUtils                        .                        interpolateHtml                        (                        gettext                        (                        'You are enrolling in {spanStart}{courseName}{spanEnd}'                        ),                        {                        courseName                        :                        'Rock & Roll 101'                        ,                        spanStart                        :                        HtmlUtils                        .                        HTML                        (                        '<span class="course-title">'                        ),                        spanEnd                        :                        HtmlUtils                        .                        HTML                        (                        '</bridge>'                        )                        }                        );                      

Yous can also use HtmlUtils.joinHtml() to bring together together a mix of HTML snippets and plain text strings into a larger HTML snippet where each part will be properly HTML-escaped as necessary. See the following example.

                                                HtmlUtils                        .                        joinHtml                        (                        HtmlUtils                        .                        HTML                        (                        '<p>'                        ),                        gettext                        (                        'This is the best form.'                        ),                        HtmlUtils                        .                        HTML                        (                        '</p>'                        )                        )                      

Ofttimes, much of the training of HTML in JavaScript can exist written using an Underscore.js template. The function HtmlUtils.template() provides some enhancements for escaping. Outset, it makes HtmlUtils bachelor inside the template automatically. Also, it returns an HTML snippet so that other HtmlUtils functions know not to HTML-escape its results. It is assumed that any HTML-escaping required will take identify within the Underscore.js template. Follow the best practices detailed in Underscore.js Template Files.

The concluding step of DOM manipulation in JavaScript often happens using JQuery. There are some JQuery functions such as $.text() , $.attr() and $.val() that expect plain text strings and take intendance of HTML-escaping its input for you.

There are other JQuery functions such equally $.html() , $.append() and $.prepend() that expect HTML and add it into the DOM. All the same, these functions do not know whether or non they are beingness provided properly escaped HTML as represented by an HTML snippet.

If yous are working with a Courage.js element, as represented by el or $el , yous can use the JQuery methods directly, equally in the following case.

                                                this                        .                        parentElement                        .                        suspend                        (                        this                        .                        $el                        );                      

However, if you are creating the chemical element through one of the other HtmlUtils functions, you must use HtmlUtils.setHtml() , HtmlUtils.append() and HtmlUtils.prepend() in identify of the JQuery equivalents. These HtmlUtils JQuery wrappers respect HTML snippets, and tin can exist used every bit seen in the post-obit example.

                                                HtmlUtils                        .                        setHtml                        (                        this                        .                        $el                        ,                        HtmlUtils                        .                        joinHtml                        (                        HtmlUtils                        .                        HTML                        (                        '<p>'                        ),                        gettext                        (                        'This is the best course.'                        ),                        HtmlUtils                        .                        HTML                        (                        '</p>'                        )                        )                        );                      

In the case of Courage.js models, although attributes can be retrieved using the go() or escape() functions, yous should avoid using the escape() function, which volition HTML-escape the retrieved value. It is preferable to use the go() function and delay escaping until the time of rendering, which is often handled using an Underscore.js template.

To properly URL-escape, you can apply the JavaScript functions encodeURI and encodeURIComponent . The following case shows how to properly URL-escape user provided data earlier information technology is used equally a query parameter.

                                                var                        url                        =                        "http://examination.com/?data="                        +                        encodeURIComponent                        (                        userData                        )                      

For more information near URLs, see URL Context and Escaping.

10.ane.3.4.3. JavaScript edx Namespace¶

If you are working with code that does not apply RequireJS, then it is non possible to import the StringUtils and HtmlUtils functions in the regular way. In this state of affairs you can access these functions instead from the global edx namespace, as follows:

                                                edx                        .                        StringUtils                        .                        interpolate                        (...);                        edx                        .                        HtmlUtils                        .                        setHtml                        (...);                      

10.i.3.5. CoffeeScript Files¶

For CoffeeScript files, follow the same guidelines equally provided for JavaScript files, just using the CoffeeScript syntax.

ten.ane.iii.6. Underscore.js Template Files¶

The best way to HTML-escape expressions in an Underscore.js template is to apply the <%- tag, which will perform the HTML-escaping.

There are some exceptions where y'all must utilize a combination of <%= , which does not escape, and one of the UI Toolkit HtmlUtils functions. One case is when y'all use the HtmlUtils.interpolateHtml() function to translate strings that consist of a mix of plain text and HTML. You lot tin can easily gain admission to the HtmlUtils object within a template by rendering the Underscore.js template using the HtmlUtils.template() function.

If y'all need to pass an HTML snippet to a template, which has already been HTML-escaped, you should proper name the variable with an Html suffix, and employ HtmlUtils.ensureHtml() to ensure that it was in fact properly HTML- escaped. Run across the following instance.

                                            <%=                      HtmlUtils                      .                      ensureHtml                      (                      nameHtml                      )                      %>                    

For more than details near using the HtmlUtils utility functions, see JavaScript Files.

ten.i.4. Making Legacy Mako Templates Prophylactic by Default¶

This topic provides a step-by-step set of instructions for making our Mako templates safe by default. For best practices to use when y'all write a new Mako template, encounter Mako Template Files.

By default, our Mako templates perform no escaping for expressions. We refer to this equally not being "prophylactic by default". Our intention is get to the state where our Mako templates are "safe by default", by ensuring that Mako template expressions perform HTML-escaping past default.

Note

Information technology is of import to understand that HTML-escaping might not be the right thing to practise in all cases, but it is a skillful starting identify. Boosted escaping filters are bachelor to help with other scenarios.

Due to valid exceptions to the general rule of HTML-escaping, it is not possible to configure escaping for all Mako templates in the unabridged platform without introducing errors.

The current process is for developers to make changes to each Mako template to ensure that all expressions use HTML-escaping by default. For details, see Set HTML-Escaping Filter as Default.

The following topics draw the steps you need to take to make your Mako templates safe by default. Although nosotros have attempted to embrace every bit many scenarios as possible, we are sure to have missed some cases. If y'all are unsure almost what to do, achieve out and ask for assistance. For contact information, come across the Getting Help page on the Open edX portal .

Note

If you come across an old template that is no longer in utilise and can be cleaned out of the platform, help to remove the template rather than following these steps.

  • Set HTML-Escaping Filter as Default

  • Run the XSS Linter

  • Fix Downstream JavaScript and Underscore.js Templates

x.1.4.1. Set HTML-Escaping Filter as Default¶

Start by adding the following line to the very acme of your Mako template.

                                            <%                      page                      expression_filter=                      "h"                      />                                          

It is of import to empathize that this change will impact all expressions in your Mako template. Although HTML-escaping is a reasonable default, it might crusade problems for sure expressions, including HTML that cannot exist escaped.

Besides, exist careful not to have multiple <%page> tags in a Mako template.

x.1.4.ii. Run the XSS Linter¶

After setting HTML-escaping by default for the Mako template, run the XSS Linter with the following command.

                      ./scripts/xsslint/xss_linter.py                    

Accuracy and completeness of the linter are non guaranteed, so test your work later on fixing all violations.

For more than detailed instructions on using the linter, see XSS Linter.

10.1.4.iii. Fix Downstream JavaScript and Underscore.js Templates¶

Because Mako templates but generate the initial page source, you should ensure that any downstream JavaScript files or Underscore.js templates also follow the all-time practices.

When you take found the proper downstream JavaScript and Underscore.js template files, y'all tin once again run the XSS Linter on these files.

For help navigating our client side code, see Navigating JavaScript and Underscore.js Templates

ten.1.5. XSS Linter¶

The XSS linter is a tool to aid you brand sure that you lot are following best practices within edx-platform. It is not nonetheless possible to run the linter against other repositories.

To run the linter on the changes in your electric current Git branch, use the following control.

To run the linter on the entire edx-platform repository, apply the following command.

                    ./scripts/xsslint/xss_linter.py                  

You can besides lint an individual file or recursively lint a directory. Hither is an example of how to lint a single file.

                    ./scripts/xsslint/xss_linter.py cms/templates/base.html                  

For additional options that you can utilise to run the linter, use the following control.

                    ./scripts/xsslint/xss_linter.py --help                  

The following code block shows sample output from the linter.

                    lms/templates/courseware/courseware-fault.html:                    17:7: mako-wrap-html:                    ${                    _                    (                    'At that place has been an error on the {platform_name} servers'                    ).format(                    lms/templates/courseware/courseware-error.html: eighteen:                    one                    :                           platform_name=u                    '<bridge grade="edx">{}</bridge>'                    .format(settings.PLATFORM_NAME)                    lms/templates/courseware/courseware-error.html: nineteen:                    i                    :                       )                    }                  

Each line of linter output has the following parts.

  1. The path of the file containing the violation.

  2. The line number and column, for example 17:7 in a higher place, where the violation begins. In the example of Mako expressions, this will be the start of the unabridged expression.

  3. A violation ID such every bit mako-wrap-html that represents the particular type of violation. This only appears on the first line of the violation. Boosted lines may announced for context only. For more details on individual violations, run the linter with --help , or see Linter Violations.

  4. The full line of code establish at the provided line number.

This linter is relatively new, then if you see excessive false positives, such as a directory that should possibly be skipped, please provide feedback. The aforementioned is truthful if you lot spot an result that was not defenseless by the linter. You lot can achieve united states using the Getting Aid folio on the Open edX portal.

ten.ane.5.one. Disabling Violations¶

If you need to disable a violation, add together the following disable pragma to a comment at the start of the line before the violation, or at the end of the beginning line of the violation. Use the annotate syntax advisable to the file you are editing.

Hither is case syntax for a Mako template.

                                            ## xss-lint: disable=mako-invalid-js-filter,mako-js-string-missing-quotes                                          

Here is instance syntax for an Underscore.js template.

                                            <%                      // xss-lint: disable=underscore-non-escaped %>                    

10.1.v.2. Linter Violations¶

The post-obit topics explain the meaning of each violation ID and what you must exercise to resolve each violation.

  • javascript-concat-html

  • javascript-escape

  • javascript-interpolate

  • javascript-jquery-append

  • javascript-jquery-html

  • javascript-jquery-insert-into-target

  • javascript-jquery-insertion

  • javascript-jquery-prepend

  • mako-html-entities

  • mako-invalid-html-filter

  • mako-invalid-js-filter

  • mako-js-html-string

  • mako-js-missing-quotes

  • mako-missing-default

  • mako-multiple-page-tags

  • mako-unknown-context

  • mako-unparseable-expression

  • mako-unwanted-html-filter

  • django-trans-missing-escape

  • django-trans-invalid-escape-filter

  • django-trans-escape-variable-mismatch

  • django-html-interpolation-missing

  • django-html-interpolation-missing-condom-filter

  • django-html-interpolation-invalid-tag

  • django-blocktrans-missing-escape-filter

  • django-blocktrans-parse-error

  • django-blocktrans-escape-filter-parse-error

  • python-shut-before-format

  • python-concat-html

  • python-custom-escape

  • python-deprecated-brandish-proper noun

  • python-interpolate-html

  • python-parse-error

  • python-requires-html-or-text

  • python-wrap-html

  • underscore-not-escaped

10.1.v.2.1. javascript-concat-html¶

Practice not use + concatenation on strings that contain HTML. Instead, employ HtmlUtils.interpolateHtml() or HtmlUtils.joinHtml() . For more details on proper use of HtmlUtils , see JavaScript Files.

10.one.five.2.two. javascript-escape¶

Avoid calls to escape() , especially in Backbone.js. Instead, use the Backbone.js model go() function, and perform the escaping in the template. You can also use HtmlUtils functions, or JQuery's text() function for proper escaping. For more details, come across JavaScript Files.

10.ane.5.ii.3. javascript-interpolate¶

For interpolation in JavaScript, utilize StringUtils.interpolate() or HtmlUtils.interpolateHtml() equally appropriate. For more details, meet JavaScript Files.

10.ane.5.2.four. javascript-jquery-append¶

Do non use JQuery'south append() with an argument that might contain unsafe HTML. The linter allows a limited number of means of coding with append() that it considers safe. Each of these safe techniques are detailed below.

Here is some example code with a violation.

                                                // Do NOT do this                        self                        .                        $el                        .                        append                        (                        _                        .                        template                        (                        teamActionsTemplate                        )({                        message                        :                        message                        })                        );                      

One mode to make this code safe is by replacing the append() call with a call to HtmlUtils.append() , every bit seen in this example.

                                                // DO this                        HtmlUtils                        .                        append                        (                        cocky                        .                        $el                        ,                        HtmlUtils                        .                        template                        (                        teamActionsTemplate                        )({                        message                        :                        message                        })                        );                      

Another way to make this code safe is to go on to use JQuery's suspend() , but to pass as an argument to append() the outcome of calling toString() on whatever HtmlUtils telephone call, every bit in the following example.

                                                // DO this                        self                        .                        $el                        .                        append                        (                        HtmlUtils                        .                        template                        (                        teamActionsTemplate                        )({                        bulletin                        :                        bulletin                        }).                        toString                        ()                        );                      

You can also employ JQuery append() with variables that represent an chemical element, as designated by starting with a $ or ending in El , such as $element or sampleEl . Y'all can also use the $el element from Backbone.js.

Here is an instance with one of the above mentioned safe variables.

                                                // DO this                        self                        .                        $el                        .                        append                        (                        $push button                        );                      

For more details regarding HtmlUtils , see JavaScript Files.

x.1.five.2.v. javascript-jquery-html¶

In some cases, JQuery's html() function is used with a string that does not incorporate whatever HTML tags. If this is the case, just use JQuery`southward text() function instead. Otherwise, you lot can replace the html() call with a call to HtmlUtils.setHtml() , or yous can call toString() on any HtmlUtils function inside the html() call.

For more detailed examples, run into javascript-jquery-append.

10.1.five.2.6. javascript-jquery-insert-into-target¶

JQuery DOM insertion calls that take a target, for instance appendTo() , tin can only be called from chemical element variables. For example, you could apply $el.appendTo() , simply yous cannot utilize anyOldVariable.appendTo() .

Alternatively, you could refactor to utilise a different JQuery method, including alternatives available in HtmlUtils .

For more details on legal names for element variables, come across javascript-jquery-append.

x.1.five.two.vii. javascript-jquery-insertion¶

JQuery DOM insertion calls that take content and do not have an HtmlUtils equivalent, for case before() , must use other HtmlUtils calls to be condom. One choice is to refactor your lawmaking to use HtmlUtils.append() , HtmlUtils.prepend() , or HtmlUtils.setHtml() . Another alternative is to use toString() whenever you lot apply an HtmlUtils call.

For example, let u.s.a. look at the following JQuery afterwards() telephone call that is considered unsafe.

                                                // Do NOT exercise this                        this                        .                        push button                        .                        after                        (                        bulletin                        );                      

Instead, you lot could refactor the above code to create message using HtmlUtils , and then complete the refactor using HtmlUtils.ensureHtml() , equally seen in the following example.

                                                // DO this                        messageHtml                        =                        HtmlUtils                        .                        template                        (                        messageTemplate                        )({                        message                        :                        message                        });                        this                        .                        push button                        .                        after                        (                        HtmlUtils                        .                        ensureHtml                        (                        messageHtml                        ).                        toString                        ()                        );                      

10.1.5.two.viii. javascript-jquery-prepend¶

Exercise not utilize JQuery's prepend() with an argument that might contain unsafe HTML. The linter allows a limited number of ways of coding with prepend() that information technology considers condom. For details of these safe techniques, run across those described for javascript-jquery-append.

10.1.v.two.9. mako-html-entities¶

Once a Mako template is marked rubber by default, HTML entities such equally &amp; should instead be plain text such as & because they will be escaped with the rest of the expression. If the entity appears in the midst of HTML, it should probably exist wrapped with a phone call to HTML() .

Here is a violation equally an example.

                                                ## Practise NOT exercise this                                                <%                        page                        expression_filter=                        "h"                        />                                                ...                        ${                        _                        (                        "Details &amp; Schedule"                        )                        }                                              

Hither is the corrected code.

                                                ## Do this                                                <%                        page                        expression_filter=                        "h"                        />                                                ...                        ${                        _                        (                        "Details & Schedule"                        )                        }                                              

ten.i.5.2.10. mako-invalid-html-filter¶

The only valid culling to the default HTML filter when a template is marked rubber past default, is to disable HTML-escaping in one of the post-obit means.

                                                ## Practise this sparingly                                                ${                        HTML                        (                        ten                        )                        }                                                ## or                                                ${                        ten                        |                        n                        ,                        decode                        .                        utf8                        }                                              

Important

Use these functions merely in the rare cases where yous already accept properly escaped condom HTML, and you cannot movement the HTML generation to the template.

If you must disable HTML-escaping, of the 2 alternatives above, using HTML() is preferred, unless the context is cryptic and HTML() does not make sense, such every bit in certain Mako defs.

x.one.v.2.11. mako-invalid-js-filter¶

There is a limited prepare of filters that the linter considers safe in a JavaScript context, so you must use one of the following safety filters.

                                                <%!                        from                        openedx.core.djangolib.js_utils                        import                        dump_js_escaped_json                        %>                                                ...                        ${                        10                        |                        north                        ,                        dump_js_escaped_json                        }                                                ## or                                                <%!                        from                        openedx.cadre.djangolib.js_utils                        import                        js_escaped_string                        %>                                                ...                        ${                        ten                        |                        due north                        ,                        js_escaped_string                        }                                                ## or DO this sparingly                                                ${                        ten                        |                        n                        ,                        decode                        .                        utf8                        }                                              

Of import

Only in the rare example where you already have properly JavaScript-escaped safe HTML, and you cannot motility the JavaScript to a JavaScript file or Underscore.js template, can y'all use the filter | northward, decode.utf8 . This filter turns off all escaping.

Take note of whatever expression that was mistakenly using | h in a JavaScript context. Since the data inside the expression, x in the above example, will no longer exist HTML-escaped in Mako when you remove the | h filter, pay extra attending to ensuring that HTML-escaping is being performed in the downstream JavaScript.

For aid using these filters, see JavaScript Context in Mako.

10.1.five.2.12. mako-js-html-string¶

Do not embed Mako expressions directly into a JavaScript string that uses HTML. JavaScript in a Mako template should be only enough to laissez passer variables from Mako to JavaScript. Annihilation more complicated is probable to crusade escaping issues.

Here is a sample violation.

                                                // Do Non do this                        var invalid = '<stiff>                        ${                        x                        |                        n                        ,                        js_escaped_string                        }                        </strong>'                      

Instead, simplify the data passing from Mako to JavaScript as follows.

                                                // Do this                        var valid = '                        ${                        x                        |                        n                        ,                        js_escaped_string                        }                        '                      

Y'all tin can and then use the higher up valid variable using whatsoever of the JavaScript HtmlUtils functions, or in an Underscore.js template.

10.i.5.two.13. mako-js-missing-quotes¶

A Mako expression using the js_escaped_string filter must be wrapped in quotes.

                                                // Do NOT do this                        var bulletin =                                                ${                        msg                        |                        north                        ,                        js_escaped_string                        }                                                // DO this                        var message = '                        ${                        msg                        |                        northward                        ,                        js_escaped_string                        }                        '                      

ten.ane.5.ii.14. mako-missing-default¶

The Mako template is missing the directive that makes it safety by default. Add together the post-obit to the top of the Mako template file.

                                                <%                        folio                        expression_filter=                        "h"                        />                                              

It is important to understand that this will add HTML-escaping to all Mako expressions in the template. The linter may report additional bug once this has been done, so you will want to run it again later on this is in place.

ten.1.five.2.fifteen. mako-multiple-page-tags¶

A Mako template can only have i <%page> tag. If the template already uses this tag to pass arguments and you mistakenly add a 2nd <%page> tag to make the template safe past default, you must combine these two tags to resolve the violation.

The post-obit instance violates this dominion.

                                                ## Do NOT do this                                                <%                        folio                        expression_filter=                        "h"                        />                                                ...                        <%                        page                        args=                        "section_data"                        />                                              

Here is the corrected code.

                                                ## Do this                                                <%                        page                        args=                        "section_data"                        expression_filter=                        "h"                        />                                              

ten.ane.5.2.sixteen. mako-unknown-context¶

The linter could non determine if the context is JavaScript or HTML. In addition to using the disable pragma detailed in Disabling Violations, please study the effect through the Getting Help folio on the Open up edX portal.

10.1.v.2.17. mako-unparseable-expression¶

This violation likely ways that there is a syntax error in the Mako template. If the template is valid, in addition to using the disable pragma detailed in Disabling Violations, please report the consequence through the Getting Help page on the Open up edX portal.

10.1.5.2.18. mako-unwanted-html-filter¶

In one case the page level directive has been added to brand the Mako template safe past default, any utilize of the h filter in an expression is redundant. These h filters should be removed.

10.1.five.2.19. django-trans-missing-escape¶

Each translation string needs to be properly escaped before being shown to the user. This error is raised when a trans tag has a missing escape filter. Translation strings should be passed through django's builtin force_escape filter.

                                                ## DO this                                                {% trans 'Log out' every bit tmsg %}{{tmsg|force_escape}}                      

The force_escape filter should be on the same line as the trans expression and should non be moved to next line.

                                                ## DO Not do this                                                {% trans 'Log out' as tmsg %}                        {{tmsg|force_escape}}                      

10.1.5.ii.20. django-trans-invalid-escape-filter¶

This mistake is raised when the trans tag is escaped via unknown filter.

                                                ## DO Not practise this                                                {% trans 'Log out' equally tmsg %}{{tmsg|some_unknown_filter}}                      

ten.one.five.two.21. django-trans-escape-variable-mismatch¶

This error is raised when there is a mismatch between the trans tag expression variable and the filter expression variable.

                                                ## Practice Not do this                                                {% trans 'Log out' as tmsg %}{{some_other_variable|force_escape}}                      

ten.1.5.two.22. django-html-interpolation-missing¶

Whenever there are some html tags that need to be used in the translation string and we exercise not want them to be escaped and so nosotros have to interpolate such html via a custom interpolate_html tag.

This fault is raised when a trans/blocktrans tag includes html directly, rather than using the interpolation_html tag.

In the instance of a trans tag:

                                                ## DO Not practise this                                                {% trans "some text <a href='some-path'>link text to brandish</a>." %}                      

The correct manner is to apply a variable to store the translation string and utilize the interpolate_html tag to escape that variable like beneath.

                                                ## Practise this                                                {% trans "Some text {start_link}link text to display{end_link}." as tmsg %}                        {% interpolate_html tmsg start_link='<a href='some-path'>'|safe end_link='</a>'|safe %}                      

Important

Add {% load django_markup %} to the elevation of the file to be able to utilize interpolate_html in the file.

In the case of a blocktrans tag:

                                                ## Do NOT do this                                                {% blocktrans%}                        some text <a href="some-path">link text to display</a>.                        {% endblocktrans %}                      

Instead we should use the interpolate_html tag to HTML-escape the string, except for parts that are real HTML that are marked as safe .

                                                ## DO this                                                {% blocktrans trimmed asvar msg %}                        some text {start_link}link text to display{end_link}.                        {% endblocktrans %}                        {% interpolate_html msg start_link='<a href="'|add together:some_url|add together:'">'|condom end_link='</a>'|safe %}                      

Important

Ane thing to keep in mind while using interpolate_html is to correctly map the trans/blocktrans tag cord output variable to the interpolate_html tag. For example, in the above case the msg variable used in interpolate_html must match the trans/blocktrans tag output variable (too msg ), otherwise the linter will mutter.

ten.i.v.ii.23. django-html-interpolation-missing-safe-filter¶

This error is raised when the injected html is not marked equally safe via a safe filter. Non marking information technology condom would cause the interpolate_html tag to non only HTML-escape the translation cord, but it would likewise HTML-escape the true HTML arguments that were passed to information technology.

                                                ## DO Non do this                                                {% blocktrans trimmed asvar msg %}                        some text {start_link}link text to display{end_link}.                        {% endblocktrans %}                        {% interpolate_html msg start_link='<ahref="'|add:some_url|add:'">' end_link='</a>'%}                      

This linter violation is likewise raised when some unknown filter is being used instead of safe .

                                                ## Practice NOT do this                                                {% blocktrans trimmed asvar msg %}                        some text {start_link}link text for to brandish{end_link}.                        {% endblocktrans %}                        {% interpolate_html msg start_link='<ahref="'|add:some_url|add:'">'|unknown_filter end_link='</a>'|safe%}                      

Instead, the **kwargs sent to interpolate_html must be marked safe.

                                                ## DO this                                                {% blocktrans trimmed asvar msg %}                        some text {start_link}link text to brandish{end_link}.                        {% endblocktrans %}                        {% interpolate_html msg start_link='<ahref="'|add:some_url|add:'">'|safe end_link='</a>'|safe %}                      

ten.1.5.ii.24. django-html-interpolation-invalid-tag¶

This violation is raised when interpolate_tag has missing arguments.

                                                ## DO NOT practise this                                                {% blocktrans trimmed asvar msg %}                        some text {start_link}link text to display{end_link}.                        {% endblocktrans %}                        {% interpolate_html %}                      

interpolate_html requires one argument and a set of keyword arguments. The first positional argument is the output variable of the trans/blocktrans tag, which is the translation string that needs to exist HTML-escaped. The 2d set of arguments are keyword arguments that are injected into the translation string.

                                                ## Do this                                                {% blocktrans trimmed asvar msg %}                        some text {start_link}link text to brandish{end_link}.                        {% endblocktrans %}                        {% interpolate_html msg start_link='<ahref="'|add:some_url|add:'">'|condom end_link='</a>'|condom %}                      

ten.one.5.2.25. django-blocktrans-missing-escape-filter¶

This fault is raised when a blocktrans tag is not nested under an escape filter expression.

                                                ## DO Not exercise this                                                {% blocktrans %}                                                  You have been enrolled in {{ course_name }}                        {% endblocktrans %}                      

Instead do this

                                                ## Exercise this                                                {% filter force_escape %}                        {% blocktrans %}                                                  You have been enrolled in {{ course_name }}                        {% endblocktrans %}                        {% endfilter %}                      

10.1.5.ii.26. django-blocktrans-parse-error¶

This mistake is raised when the blocktrans closing tag is missing.

                                                ## Exercise Non do this                                                {% filter force_escape %}                        {% blocktrans %}                        Some translation string                        {% endfilter %}                      

10.1.five.two.27. django-blocktrans-escape-filter-parse-mistake¶

This error is raised when there is a parsing error in the filter expression. Mostly this should be found by the django template parser. For case, in the code snippet below, the filter force_escape expression is not properly airtight.

                                                ## DO Not practise this                                                {% filter force_escape                        {% blocktrans %}                        Some translation string                        {% endblocktrans %}                        {% endfilter %}                      

x.ane.5.2.28. python-close-before-format¶

You must close any call to Text() or HTML() before calling format() . Another way to state this is that yous should merely pass a unmarried literal cord to Text() or HTML() .

Hither is an example of this violation. Note that the problem is subtle, and that there is only a single ) before the call to format() , endmost the _() telephone call, only non the Text() phone call.

                                                ## Do NOT do this                                                ${                        Text                        (                        _                        (                        "Click over to {link_start                        }                        the habitation folio{link_end}.").format(                                                  link_start=HTML('<a href="/abode">'),                                                  link_end=HTML('</a>'),                        ))}                      

Hither is a corrected version of the aforementioned code block.

                                                ## DO this                                                ${                        Text                        (                        _                        (                        "Click over to {link_start                        }                        the dwelling folio{link_end}.")).format(                                                  link_start=HTML('<a href="/abode">'),                                                  link_end=HTML('</a>'),                        )}                      

ten.ane.5.2.29. python-concat-html¶

It is safer to use the HTML() and Text() functions, rather than concatenating strings with HTML. An even better solution would be to handle interpolation with HTML in a proper template, like a Mako template.

Take the following violation as an instance.

                                                # Practice NOT exercise this                        msg                        =                        '<html>'                        +                        msg                        +                        '</html>'                      

Instead, it is possible to properly HTML-escape msg as follows.

                                                # DO this                        msg                        =                        HTML                        (                        '<html>                        {msg}                        </html>'                        )                        .                        format                        (                        msg                        =                        msg                        )                      

10.1.5.2.thirty. python-custom-escape¶

Instead of writing a custom escaping method that replaces < with &lt; , use a standard escaping part like markupsafe.escape() .

ten.i.v.2.31. python-deprecated-display-proper name¶

The XBlock function display_name_with_default_escaped has been deprecated and should not be used. Instead, y'all must use the call display_name_with_default and follow the all-time practices for proper escaping based on the context.

It might be that display_name_with_default_escaped was called from Python while setting up the context for your Mako template. You still must ready this to be display_name_with_default and make sure information technology is properly escaped in the Mako template.

Have note of whatever places where this value was used in a JavaScript context. Y'all must make sure that this data is properly escaped downstream when information technology is finally added to the page, for example, in an Underscore.js template.

x.i.5.ii.32. python-interpolate-html¶

Interpolation with HTML should employ the HTML() , Text() , and format() functions. For details, run across python-concat-html.

x.1.5.2.33. python-parse-mistake¶

This violation likely means that there is a syntax error in the Python file. If the Python file is valid, in addition to using the disable pragma detailed in Disabling Violations, please report the outcome through the Getting Help page on the Open edX portal.

10.ane.5.ii.34. python-requires-html-or-text¶

In Python, when using either HTML() or Text() for interpolation with the format() role, y'all must wrap the initial cord with HTML() or Text() equally appropriate.

In a Mako expression, any interpolation using format() with interpolated HTML() calls must be preceded by a call to Text() . An expression with interpolation typically does not begin with HTML() because in a template, any HTML will exist either interpolated in or moved out of the expression and into the outer template HTML.

The following is an example Mako violation.

                                                ## Practise NOT practice this                                                ${                        _                        (                        "Click over to {link_start                        }                        the home page{link_end}.").format(                                                  link_start=HTML('<a href="/dwelling">'),                                                  link_end=HTML('</a>'),                        )}                      

Instead, use Text() , as in the following example.

                                                ## Exercise this                                                ${                        Text                        (                        _                        (                        "Click over to {link_start                        }                        the home page{link_end}.")).format(                                                  link_start=HTML('<a href="/home">'),                                                  link_end=HTML('</a>'),                        )}                      

For a deeper agreement of why the function Text() is required in the above example, run across Why Exercise I Demand Text() with HTML()?.

10.one.5.2.35. python-wrap-html¶

When interpolating a string containing HTML using a phone call to format() , you must wrap the HTML with HTML() . Y'all might meet this issue in a Mako template or a Python file. Likewise, yous might have HTML embedded into a larger cord that commencement needs to be interpolated in. Or, you might already be interpolating in smaller strings containing HTML, merely they just are not yet protected past a call to HTML() .

For proper use of HTML() and Text() , see HTML Context in Mako.

ten.1.5.2.36. underscore-non-escaped¶

Underscore.js template expressions should all be HTML-escaped using <%- expression %> . The just exceptions where you lot can use <%= which does not escape is when making an HtmlUtils call.

For more details, see Underscore.js Template Files.

10.1.6. Advanced Topics¶

The following advanced topics comprehend rare cases and provide a more than in-depth explanation of some methods you can use to preclude cross site scripting vulnerabilities.

  • Why Use Both js_escaped_string and dump_js_escaped_json ?

  • Mako Filter Ordering and the northward Filter

  • Mako Blocks

  • Strings Containing JSON in Mako

  • Why Do I Need Text() with HTML()?

10.1.6.i. Why Use Both js_escaped_string and dump_js_escaped_json

To escape strings in Mako templates, why must we use dump_js_escaped_json in addition to using js_escaped_string ?

  • The js_escaped_string role provides the additional benefit of returning an empty string in the case of None.

  • The js_escaped_string and wrapping quotes makes the expected type more declarative.

10.1.6.2. Mako Filter Ordering and the due north Filter¶

Mako executes whatever default filter before it executes filters that are added inside an expression. One such default filter is the decode.utf8 filter, which is used to decode to UTF-8, but only if the Python object is non already unicode.

Take the following example Mako expression.

When Mako compiles this expression to Python, it is translated to the following Python code.

                                            __M_writer                      (                      filters                      .                      html_escape                      (                      filters                      .                      decode                      .                      utf8                      (                      data                      )))                    

From the Python line higher up, you lot can run into that the default decode.utf8 filter is applied before the h filter, which was supplied within the expression.

The n filter tin be used to turn off all default filters, including the decode.utf8 filter. Here is an example Mako expression.

In this example, when Mako compiles this expression to Python, the following Python code is the result.

For more information, come across Mako: Expression Filtering.

10.1.vi.3. Mako Blocks¶

A Mako %cake tin can sometimes create tricky situations where the context is non clear. In these cases, it would exist all-time to provide the context (for example, HTML or JavaScript) in the proper name of the block.

Take the following Mako %block definition as an example.

                                            <%                      page                      expression_filter=                      "h"                      />                                            ...                      <%                      cake                      proper noun=                      "html_title"                      >${                      display_name                      }</%                      block                      >                                          

Based on the in a higher place %block definition, but the name of the block tells us that it is HTML-escaped, and information technology is only usable in an HTML context. Yous could non use this same %block in a JavaScript context.

Hither is this same %cake above, as it is really used to brandish the championship.

                                            <title>                                                                  <%                      block                      proper noun=                      "html_title"                      ></%                      cake                      >                                            </title>                    

For more information, see Mako: Defs and Blocks.

x.1.6.4. Strings Containing JSON in Mako¶

In the same way that we wait as long as possible to escape, in one case nosotros know the context, nosotros as well recommend waiting as long as possible before converting from Python to JSON. Mako templates are often the place where the Python object should finally exist dumped to JSON.

If you lot find yourself with a string that already contains JSON inside a Mako template, and you need to use information technology in a JavaScript context, you have the post-obit 2 options.

  • Where advisable, you could attempt to refactor the code to move the call to json.dumps from the Python file feeding the Mako template, into the Mako template, replacing that call with dump_js_escaped_json .

  • You can call json.loads before dumping information technology to ensure it is parseable, as in the post-obit example.

                                            <script>                                              var options =                                            ${                      json                      .                      loads                      (                      options_json_string                      )                      |                      n                      ,                      dump_js_escaped_json                      }                      ;                      </script>                    

x.1.vi.5. Why Do I Need Text() with HTML()?¶

You might wonder why the Text() part is required in Mako templates to brand the HTML() function work.

The magic behind the Text() and HTML() functions is a library called markupsafe and its Markup grade, which designates that a string is HTML markup and no longer needs to be HTML-escaped. The divergence between Text() and HTML() is that Text() HTML-escapes before it becomes Markup , where HTML() simply marks a string equally Markup .

The magic of Markup is that whatever string that is formatted into it is HTML- escaped during that procedure. Note how the & is HTML-escaped in the post-obit case.

                                            >>>                                            from                      markupsafe                      import                      Markup                      >>>                                            Markup                      (                      '<div>                      {}                      </div>'                      )                      .                      format                      (                      'Stone & Roll'                      )                      Markup(u'<div>Rock &amp; Curlicue</div>')                    

For the adjacent example, when Markup is formatted into a Markup object, it understands that it should not be HTML-escaped and thus the & will remain unchanged.

                                            >>>                                            Markup                      (                      '<div>                      {}                      </div>'                      )                      .                      format                      (                      Markup                      (                      'Rock & Curlicue'                      ))                      Markup(u'<div>Rock & Roll</div>')                    

A trouble arises when nosotros apply format on a plain string. Since a string does not know annihilation almost Markup , the result of this is a plainly cord again, rather than a Markup object. Thus, the effect has lost its Markup magic.

                                            >>>                                            '<div>                      {}                      </div>'                      .                      format                      (                      Markup                      (                      'Stone & Roll'                      ))                      '<div>Rock & Curlicue</div>'                    

In Mako, we add page-level HTML-escaping by default, which also uses the markupsafe library. Mako expressions will therefore respect Markup objects and will not double escape.

                                            <%                      page                      expression_filter=                      "h"                      />                                            ...                      ${                      information                      }                                          

Therefore, the problem with using HTML() without the initial Text() is that the Markup object becomes a obviously old cord and information technology ends up getting HTML-escaped, when your intention was to keep the HTML from being HTML-escaped.

reissbendind.blogspot.com

Source: https://edx.readthedocs.io/projects/edx-developer-guide/en/latest/preventing_xss/preventing_xss.html

0 Response to "Filtering User Input to Remove Html and Script Tags Can Help Prevent Which of the Following Attacks?"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel