CVE-2024-8373

Overview

AngularJS is a JavaScript framework for developing dynamic web applications. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly.

‍

An improper sanitization vulnerability (CVE-2024-8373) has been identified in AngularJS, which allows attackers to bypass common image source restrictions normally applied to the value of the [srcset] attribute on <source> HTML elements. This bypass can further lead to a form of Content Spoofing.

‍

Per OWASP: Content spoofing, also referred to as content injection, “arbitrary text injection” or virtual defacement, is an attack targeting a user made possible by an injection vulnerability in a web application. When an application does not properly handle user-supplied data, an attacker can supply content to a web application, typically via a parameter value, that is reflected back to the user. This presents the user with a modified page under the context of the trusted domain.

‍

This issue affects all versions of AngularJS.

‍

Details

‍

Module Info

• Product: AngularJS
• Affected packages: angular
• Affected versions: >=0.0.0
• GitHub repository: https://github.com/angular/angular.js
• Published packages: https://www.npmjs.com/package/angular
• Package manager: npm
• Fixed in: AngularJS NES v1.9.6 and v1.5.22

‍

Vulnerability Info

This Medium-severity vulnerability is found in the main angular package in all published versions of AngularJS.

‍

Normally, setting an <img> or <source> element's srcset attribute value is subject to image source sanitization, which allows improving the security of an application by setting restrictions on the sources of images that can be shown. For example, only allowing images from a specific domain.

‍

However, due to a bug in AngularJS, setting a <source> element’s srcset attribute via the ngAttrSrcset directive or interpolation is not subject to image source sanitization. This allows bypassing the image source restrictions configured in the application, which can also lead to a form of Content Spoofing.

‍

Note:

The ngSrcset and ngPropSrcset directives are not affected. With these directives, sanitization works as intended.

‍

Steps to Reproduce

• Create an AngularJS application and configure $compileProvider to only allow images from a specific domain. For example:

angular
    .module('app', [])
    .config(['$compileProvider', $compileProvider => {
      $compileProvider.imgSrcSanitizationTrustedUrlList(
          // Only allow images from `angularjs.org`.
          /^https:\/\/angularjs\.org\//);
    }]);

‍

• Use a specially-crafted value in the ngAttrSrcset directive on a <source> element to bypass the domain restriction and show an image from a disallowed domain. For example:

<picture>
  <source ng-attr-srcset="https://angular.dev/favicon.ico" />
  <img src="" />
</picture>

‍

• You can even show an arbitrary SVG image using the data:image/svg+xml format. For example:

<picture>
  <source ng-attr-srcset="data:image/svg+xml;base64,..." />
  <img src="" />
</picture>

‍

• Similarly, you can achieve the same by using interpolation on the srcset HTML attribute. For example:

<picture>
  <source srcset="{{ 'https://angular.dev/favicon.ico' }}" />
  <!--
    OR:
    <source srcset="{{ 'data:image/svg+xml;base64,...' }}" />
  --> 
  <img src="" />
</picture>

‍

Proof of Concept

A full reproduction with code similar to the above can be found here:
<source> sanitization vulnerability POC

‍

Mitigation

The AngularJS project is End-of-Life and will not receive any updates to address this issue. For more information see here.

‍

Users of the affected components should apply one of the following mitigations:

• Migrate affected applications away from AngularJS.
• Leverage a commercial support partner like HeroDevs for post-EOL security support.