SafePipe
standalone: true
O SafePipe
ajuda a contornar a verificação de segurança do Angular para valores considerados inseguros, como HTML, estilos, scripts, URLs e URLs de recursos. Este pipe utiliza o serviço DomSanitizer
do Angular para marcar os valores como seguros e permitir sua utilização no aplicativo sem causar erros de segurança.
Uso
Importe o SafePipe
, adicione o pipe safe
no seu template, passando o tipo de valor que deseja contornar a verificação de segurança.
.component.ts
import { SafePipe } from "@burand/angular";
.component.html
<!-- HTML -->
<div [innerHTML]="unsafeHtml | safe:'html'"></div>
<!-- Style -->
<div [ngStyle]="{'background-image': unsafeStyle | safe:'style'}"></div>
<!-- Script -->
<script [src]="unsafeScript | safe:'script'"></script>
<!-- URL -->
<a [href]="unsafeUrl | safe:'url'">Link</a>
<!-- Resource URL -->
<iframe [src]="unsafeResourceUrl | safe:'resourceUrl'"></iframe>
Aviso de segurança
Tenha cuidado ao utilizar este pipe, pois ele permite contornar a verificação de segurança do Angular. Use-o apenas quando tiver certeza de que o conteúdo é seguro e não apresenta riscos de ataques de cross-site scripting (XSS) ou outros tipos de vulnerabilidades.