web-dev-qa-db-fra.com

Ionic 2 + Angular 2: Les images précédées de 'unsafe:' ne s'affichent donc pas même si elles sont correctes)

Pour une raison quelconque, certaines de mes images sont ajoutées avec 'unsafe:', Ce qui empêche leur rendu.

Q) Pourquoi cela se produit-il et comment puis-je le résoudre - Est-ce que Angular 2 est étrange avec la liste blanche ou Ionic 2?

par exemple.

<p><img src="unsafe:data:image/jpeg;base64,/9.....
<p><img src="data:image/jpeg;base64,/9.....

Il n'y a rien de mal avec l'image (voir ici), voir plunkr ici

La deuxième image est rendue à partir de Ionic 2, la première j'ai supprimé manuellement le préfixe pour montrer que tout va bien.

imageangularionic2
24
Dave

Pour tous ceux qui rencontrent ce problème, je l'ai "résolu" en utilisant ce qui suit:

Classe:

import {DomSanitizationService} from '@angular/platform-browser';

constructor(private _DomSanitizationService: DomSanitizationService) {}

Modèle:

<img [src]="_DomSanitizationService.bypassSecurityTrustUrl(imgSrcProperty)"/>

Où imgSrcProperty est l'image base64 incriminée encodée.

Je pense toujours que c'est un bug!

44
Dave

dans angular 5.2.6

classe:

import { DomSanitizer } from '@angular/platform-browser';
constructor(public _DomSanitizationService: DomSanitizer ) {}

modèle

<img [src]="_DomSanitizationService.bypassSecurityTrustUrl(imgSrcProperty)"/>
12
Milad Jafari

Je voudrais ajouter une réponse supplémentaire, afin que certains d'entre vous n'aient pas à déboguer pendant des siècles.

Nous avons également rencontré ce problème avec Ionic + Angular sur iOS (WKWebView) et avons découvert que les URL de données Base64 sont également considérées comme "dangereuses" une fois que la chaîne Base64 contient des sauts de ligne. Soit CRLF ou LF de style MS Windows.

Nous avons procédé à la suppression de ces caractères incriminés des chaînes de base64 (une interface externe les "imprimait assez"), ce qui a finalement résolu le problème pour nous.

Avant d'appliquer le contournement mentionné par @Dave, je vérifierais la chaîne.

7
Wilk