Angular Hinzufügen "unsicher" zu URL beim Versuch, eine Datei herunterladen

Question

Ich habe eine kleine AngularJS App, wo ich versuche, ein hochgeladenes Bild zu öffnen und läuft in das Problem, wo eckle fügt "unsafe:" am Anfang der URL . Ich habe die folgende Zeile in meiner app Config hinzugefügt, um die URL zu sanieren, aber es funktioniert nicht für mich:

$compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|blob:chrome-extension):|data:image|\//); 

I Angular v1.3.0 bin mit so dass ich die richtigen Eigenschaftsnamen verwenden. Ich verwende Chrome hauptsächlich, aber ich habe das gleiche Problem in anderen Browsern. Auch sieht der Anfang meiner Bild wie folgt aus:

unsafe:data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUg... 

Jede Idee, was bin ich in meiner regex fehlt? Vielen Dank im Voraus!

Answer 1

Wenn Sie $compileProvider.imgSrcSanitizationWhitelist() ohne den Parameter regexp gibt es die aktuell definierte Regexp.

Lauf diesen Code auf einem leeren Winkel 1.3.0:

app.config(function ($compileProvider) { 
    console.log($compileProvider.imgSrcSanitizationWhitelist()); // 
}); 

ich dieses Ergebnis bekam - /^\s*((https?|ftp|file|blob):|data:image\/)/

Und die Base64-codierte JPEG unter Verwendung des grundlegenden <img ng-src="{{main.src}}"> tatsächlich funktioniert, wie Sie here sehen können, und another one mit einem Png. Schau dir auch die Konsole an, um die Regexp zu sehen.

Ein weiterer Test, den ich laufen habe, ist die data:image/jpeg;base64, aus dem Anwendungsbereich binded Zeichenfolge zu bewegen und setzen sie die ng-src:

<img ng-src="data:image/jpeg;base64,{{main.src}}">

Wie Sie es worked auch sehen können.

Um es kurz zu machen - Sie müssen keinen Regexp in 1.3.0 und höher für Daten definieren: image/*, wie es standardmäßig definiert ist.

Ich kann nicht sicher sein, was das Problem ist, aber vielleicht haben Sie eine andere Definition von imgSrcSanitizationWhitelist irgendwo in Ihrem Code oder die Daten uri ist irgendwie kaputt.