Angular 9 References/ Core
References

DomSanitizer

This is the documentation for Angular 9.
You can switch to the latest version Angular 10.

DomSanitizer helps preventing Cross Site Scripting Security bugs (XSS) by sanitizing values to be safe to use in the different DOM contexts.

For example, when binding a URL in an <a [href]="someValue"> hyperlink, someValue will be sanitized so that an attacker cannot inject e.g. a javascript: URL that would execute code on the website.

In specific situations, it might be necessary to disable sanitization, for example if the application genuinely needs to produce a javascript: style link with a dynamic value in it. Users can bypass security by constructing a value with one of the bypassSecurityTrust... methods, and then binding to that value from the template.

These situations should be very rare, and extraordinary care must be taken to avoid creating a Cross Site Scripting (XSS) security bug!

Example

export class MyComponent {
  html: SafeHtml;

  constructor(private sanitizer: DomSanitizer) {
    this.html = sanitizer.bypassSecurityTrustHtml('<h1>DomSanitizer</h1><script>ourSafeCode()</script>') ;
  }
}
Links & Tutorials

bypassSecurityTrustHtml#

bypassSecurityTrustHtml(value: string): SafeHtml
Bypass security and trust the given value to be safe HTML. Only use this when the bound HTML is unsafe (e.g. contains `**WARNING:** calling this method with untrusted user data exposes your application to XSS security risks!

bypassSecurityTrustResourceUrl#

bypassSecurityTrustResourceUrl(value: string): SafeResourceUrl
Bypass security and trust the given value to be a safe resource URL, i.e. a location that may be used to load executable code from, like `**WARNING:** calling this method with untrusted user data exposes your application to XSS security risks!

bypassSecurityTrustScript#

bypassSecurityTrustScript(value: string): SafeScript
Bypass security and trust the given value to be safe JavaScript.**WARNING:** calling this method with untrusted user data exposes your application to XSS security risks!

bypassSecurityTrustStyle#

bypassSecurityTrustStyle(value: string): SafeStyle
Bypass security and trust the given value to be safe style value (CSS).**WARNING:** calling this method with untrusted user data exposes your application to XSS security risks!

bypassSecurityTrustUrl#

bypassSecurityTrustUrl(value: string): SafeUrl
Bypass security and trust the given value to be a safe style URL, i.e. a value that can be used in hyperlinks or ``.**WARNING:** calling this method with untrusted user data exposes your application to XSS security risks!

sanitize#

sanitize(context: SecurityContext, value: SafeValue|string|null): string|null
Sanitizes a value for use in the given SecurityContext.If value is trusted for the context, this method will unwrap the contained safe value and use it directly. Otherwise, value will be sanitized to be safe in the given context, for example by replacing URLs that have an unsafe protocol part (such as `javascript:`). The implementation is responsible to make sure that the value can definitely be safely used in the given context.