Client-Side Template Injection

User-controlled data is used as a template engine's template, which allows attackers to access the template context and in some cases inject and run malicious code in the browser.

Template engines are used to render content using dynamic data. This context data is normally controlled by the user and formatted by the template to generate web pages, emails, and so on. Template engines allow powerful language expressions to be used in templates to render dynamic content, by processing the context data with code constructs such as conditionals, loops, etc. If an attacker can control the template to be rendered, they can inject expressions that expose context data and run malicious code in the browser.

Example 1: The following example shows how a template is retrieved from the URL and used to render information with AngularJS.

function MyController(function($stateParams, $interpolate){
    var ctx = { foo : 'bar' };
    var interpolated = $interpolate($stateParams.expression);
    this.rendered = interpolated(ctx);
    ...
}

In this case, $stateParams.expression will be taking potentially user-controlled data, and evaluating this as a template to be used with a specified context. This in turn may enable a malicious user to run any code they wish within the browser, retrieving information about the context it's run against, finding additional information about how the application is created, or turning this into a full blown XSS attack.