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-8372) has been identified in AngularJS, which allows attackers to bypass common image source restrictions normally applied to the value of the [srcset] HTML attribute. 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 AngularJS versions 1.3.0-rc.4 and greater.
Details
Module Info
- Product: AngularJS
- Affected packages: angular
- Affected versions: >=1.3.0-rc.4
- GitHub repository: https://github.com/angular/angular.js
- Published packages: https://www.npmjs.com/package/angular
- Package manager: npm
Vulnerability Info
This Medium-severity vulnerability is found in the main angular package of AngularJS in versions greater than or equal to 1.3.0-rc.4.
The logic used in the ngSrcset, ngAttrSrcset and ngPropSrcset directives to sanitize image source URLs has a vulnerability that allows bypassing the restrictions set by some common patterns, such as only allowing images from a specific domain. With a specially-crafted input, the sanitization can be bypassed and images from an arbitrary domain can be shown, which can also lead to a form of Content Spoofing.
Note:
This issue also affects setting interpolated values via the srcset HTML attribute, which is not recommended in AngularJS anyway.
<img srcset="{{ 'some-malicious-input' }}" />
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 ngSrcset directive on an <img> element to bypass the domain restriction and show an image from a disallowed domain. For example:
<img ng-srcset="https://angularjs.org/favicon.ico xyz,https://angular.dev/favicon.ico" />
- You can even show an arbitrary SVG image using the data:image/svg+xml format. For example:
<img ng-srcset="https://angularjs.org/favicon.ico xyz,data:image/svg+xml;base64,..." />
Proof of Concept
A full reproduction with code similar to the above can be found here:
ngSrcset sanitization bypass 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.
Get alerted whenever a new vulnerability is fixed in the open source software we support.