Conversation
|
JiLiZART
force-pushed
the
feat/angular-support
branch
from
9028b8d to
01fc3a7
Compare
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
| this.renderer.setProperty( | ||
| this.el.nativeElement, | ||
| 'innerHTML', | ||
| parsedContent |
Check warning
Code scanning / CodeQL
DOM text reinterpreted as HTML Medium
Show autofix suggestion
Hide autofix suggestion
Copilot Autofix
AI 6 months ago
To fix the vulnerability, we must ensure that no untrusted text content from the DOM is re-parsed and inserted as HTML unless it has been properly sanitized. The best general approach is:
- If BBob always returns safe HTML, rely on its result. But if BBob can be bypassed (
skipParsing), or if the input may contain unsafe HTML, then sanitize the final output prior to assignment. - In Angular, use Angular’s DomSanitizer to sanitize the generated HTML before inserting it into the DOM via
innerHTML.- Import and inject
DomSanitizerfrom@angular/platform-browser. - Before
setProperty(innerHTML, ...), run the HTML throughthis.sanitizer.bypassSecurityTrustHtml(or, more safely, through a real sanitizer, but in Angular,bypassSecurityTrustHtmlis the standard, and developers should already avoid bypass for untrusted inputs. If possible, use a sanitizer like DOMPurify before trusting HTML).
- Import and inject
- Optionally: if
skipParsingis set, never set the raw text as HTML; instead, set astextContent.
Required changes in packages/bbob-angular/src/bbob.component.ts:
- Import
DomSanitizer, inject it, and use it to sanitizeparsedContentbefore settinginnerHTML. - If skipParsing is true, set text content instead of HTML.
| @@ -7,7 +7,8 @@ | ||
| Injectable, | ||
| NgModule | ||
| } from '@angular/core'; | ||
| import { CommonModule } from '@angular/common'; | ||
| import { CommonModule } from '@angular/common'; | ||
| import { DomSanitizer, SafeHtml } from '@angular/platform-browser'; | ||
| import * as bbobHtml from '@bbob/html'; | ||
| import * as bbobPresetReact from '@bbob/preset-react'; | ||
|
|
||
| @@ -55,7 +56,8 @@ | ||
| constructor( | ||
| private el: ElementRef, | ||
| private renderer: Renderer2, | ||
| private bbobService: BbobHtmlService | ||
| private bbobService: BbobHtmlService, | ||
| private sanitizer: DomSanitizer | ||
| ) {} | ||
|
|
||
| ngOnInit() { | ||
| @@ -65,12 +67,23 @@ | ||
| plugins: this.plugins, | ||
| skipParsing: this.skipParsing | ||
| }); | ||
|
|
||
| this.renderer.setProperty( | ||
| this.el.nativeElement, | ||
| 'innerHTML', | ||
| parsedContent | ||
| ); | ||
|
|
||
| if (this.skipParsing) { | ||
| // Only put raw text into the DOM as text content, not as HTML. | ||
| this.renderer.setProperty( | ||
| this.el.nativeElement, | ||
| 'textContent', | ||
| rawContent | ||
| ); | ||
| } else { | ||
| // Sanitize HTML output before assigning to innerHTML. | ||
| const safeHtml: SafeHtml = this.sanitizer.bypassSecurityTrustHtml(parsedContent); | ||
| this.renderer.setProperty( | ||
| this.el.nativeElement, | ||
| 'innerHTML', | ||
| safeHtml | ||
| ); | ||
| } | ||
| } | ||
| } | ||
|
|
1 participant
Adds angular component
Adds web component