In Angular, DomSanitizer and bypassSecurityTrustResourceUrl are not working

52 Views Asked by At

DomSanitizer and bypassSecurityTrustResourceUrl are not working. It is still getting an error as below.

Error:

Error: NG0904: unsafe value used in a resource URL context (see https://g.co/ng/security#xss) error properties: Object({ code: 904 }) at sanitizer (node_modules/@angular/core/fesm2022/core.mjs:8735:11) at elementPropertyInternal (node_modules/@angular/core/fesm2022/core.mjs:12432:37) at ɵɵproperty (node_modules/@angular/core/fesm2022/core.mjs:16255:9) at templateFn (ng:///EditHistoryDialogComponent.js:31:9) at executeTemplate (node_modules/@angular/core/fesm2022/core.mjs:12003:13) at refreshView (node_modules/@angular/core/fesm2022/core.mjs:13498:13) at detectChangesInView (node_modules/@angular/core/fesm2022/core.mjs:13663:9) at detectChangesInComponent (node_modules/@angular/core/fesm2022/core.mjs:13638:5) at detectChangesInChildComponents (node_modules/@angular/core/fesm2022/core.mjs:13676:9) at refreshView (node_modules/@angular/core/fesm2022/core.mjs:13548:13)

TypeScript:

fetchFormPage() {
  const payload = {
    documentId: this.document_id,
  };
  this.dataService.postRetrieveDocument(payload).subscribe(
    (response: any) => {
      this.base64PDF = response.documentContent;
      const binaryString = window.atob(this.base64PDF);
      const binaryLen = response.contentLength;
      const bytes = new Uint8Array(binaryLen);
      for (let i = 0; i < binaryLen; i++) {
        bytes[i] = binaryString.charCodeAt(i);
      }

      const blob = new Blob([bytes], { type: 'application/pdf' });
      this.pdfBlob = blob;
      this.fileType = this.getDocumentName(this.form_id);
      this.documentId = 'YourDocumentId';
      this.pdfUrl = URL.createObjectURL(blob);
      this.bypassUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.pdfUrl.toString()) as SafeResourceUrl;
      this.pdfSrc = bytes;
    },
    (error: any) => {
      console.error('Error fetching or converting PDF content:', error);
    }
  );
}

HTML:

  <div style="margin-top: -5%">
     <iframe [src]="bypassUrl" width="100%" height="600px"></iframe>
  </div>

I've tried using Promise with async, a separate function returning SafeResourceUrl, and SafePipe. No one has been successful in fixing the error.

0

There are 0 best solutions below