Winkel-2 deaktivieren, bereinigen

Ich versuche zu Rendern base64-string in <img src='data:image/png;base64,${Here}'.

Aber immer wenn ich versuche zu Rendern, ng2 Hygienisierung meine base64-string vor dem Rendern es fügt etwas in mein Wert vor und zeigt es in der DOM.
Ich habe festgestellt workaround(mit DomSanitizer), aber es funktioniert nicht auf neuesten Versionen.

Hier ist mein markup:

<img alt="RegularImage" src="data:image/png;base64,{{imgBase64}}">

Und hier ist mein Teil:

imgBase64="SomeBase64StringFetchedSomehow";

Aber angular2 zeigt in der Konsole die nächste Nachricht - WARNING: sanitizing unsafe URL value

Wie Sie verhindern, dass NG2 aus Hygienisierung meine base64-string?

Update

get getImg() {
    return this._sanitizer.sanitize(SecurityContext.URL,`data:image/png;base64,${this.img}`);
}

Nicht, dieses Problem zu lösen. DomSanitizer Klasse nicht mehr vorhanden ist in RC6

Warum sind Sie nicht mit final statt RC.6?
Nur tryied mit RC.7-und release-version von angular2.

InformationsquelleAutor Maris | 2016-09-16

  1. 8

    Müssen Sie explizit sagen, Angular2, dass die Zeichenfolge vertrauenswürdiger

    https://angular.io/docs/ts/latest/api/platform-browser/index/DomSanitizer-class.html

    constructor(private sanitizer:DomSanitizer) {}

get imgBase64() {
  this.sanitizer.bypassSecurityTrustUrl('data:image/png;base64,$SomeBase64StringFetchedSomehow');
}
    <img alt="RegularImage" [src]="imgBase64">

    Siehe auch In RC.1 einige der Stile, die nicht Hinzugefügt werden können, mit Hilfe von verbindlichen syntax

    Es gibt keine DomSanitizer Klasse mehr. Ich war versucht, die Verwendung von neuen ein - Sanitizer aber es scheiterte mit dem gleichen Fehler. return this._sanitizer.sanitize(SecurityContext.URL,data:image/png;base64,${dies.img});
    Natürlich es ist. Check den link in meiner Antwort (import info wird am unteren Rand der Seite). (Zuvor hieß es DomSanitizationService)
    Modul '".../node_modules/@eckig/core/index"' hat keine exportiert Mitglied "DomSanitizer'
    Wie ich oben erwähnte, wurde es umbenannt. Ich denke, dass in RC.7, so dass Sie wahrscheinlich benötigen, um verwenden DomSanitizationService oder vielleicht DomSanitizerService (erinnere mich nicht genau) (oder update auf die final)
    Ich habe versucht mit RC7 version und release-version von Angular2 und noch immer gibt es keine DomSanitizer/DomSanitizationService/DomSanitizerService. Allerdings gibt es Sanitizer, aber es funktioniert nicht. Ich bin noch immer - ARNING: sanitizing unsafe URL value data:...

    InformationsquelleAutor Günter Zöchbauer

  2. 3

    Nach ein paar Stunden Recherchen habe ich schließlich festgestellt, dass in der neuesten version von ng2 es gibt keine DomSanitizer gespritzt werden können, mit DI, aber es ist Sanitizer. So, hier ist der Verbrauch:

    constructor( private _sanitizer: Sanitizer){
}

get getImg() {
    return this._sanitizer.sanitize(SecurityContext.URL, `data:image/png;base64,${this.img}`);
}

<input src="{{getImg}}"/>

    Wie Sie sehen können erste argument sanitize Methode ist SecurityContext Instanz, das ist im Grunde enum. So jetzt Sanitizer ist eine Fabrik, die wählen, die Implementierung basierend auf SecurityContext

    In meinem Fall hatte ich ein problem, dass meine base64-wurde desinfiziert, bevor das bekommen, deshalb war ich nicht in der Lage, um es arbeiten.

    InformationsquelleAutor Maris

  3. 0

    Nachdem erfolglos versuchen, den bypassSecurityTrust... - Funktionen zu arbeiten, Griff ich zu einem der folgenden:

    @ViewChild('div_element_id') private div_element_id: ElementRef;
...

this.div_element_id.nativeElement.innerHTML = bypass_security_for_this_html;
    Ach ja, meine. Nein. Dies sollte nie getan werden. Umgehung sanitazation lässt Sie offen für XSS-Angriffe.
    Nicht, wenn die html vertrauenswürdig ist, zum Beispiel, es wurde in ein CMS.

    InformationsquelleAutor John Langford

Schreibe einen Kommentar