Daten URL Bilder unlesbar für IE8

Question

Ich habe einen 2D Barcode Generator, der einige Barcodes auf dem (Java) Backend erstellt. Es gibt mir Daten URLs und ich setze sie auf der Client-Seite mit Javascript. Alles funktioniert gut in Chrome, Firefox. Aber nicht im IE8 (natürlich!), Obwohl die Hälfte der Bilder funktioniert und die Hälfte nicht funktioniert.

Meine Bilder sind ein paar hundert Bytes (so viel weniger als 32kb)

Hier ist ein Beispiel nicht in IE8 arbeiten:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAAAAADFHGIkAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAEnRFWHRTb2Z0d2FyZQBCYXJjb2RlNEryjnYuAAAAgklEQVR42nVRixKAMAjy/3+a2hBwdVtdD1RELFxOXS6+9v1+F/+ICFs5jpGqsQWSosy3MQbVGSEDC7q4FaQrRiJDepJ1iG2sATggaqkeCc3VqicDDu6omgk1VdmS4W3Uq4sr4hE8llSYKe7GXsTxTPdZTdlyLQA4xrKQOit+Ryv7nwfFATbY5mERHQAAAABJRU5ErkJg

Hier ist ein Beispiel Arbeits in IE8:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFMAAABTCAAAAADG2WTcAAAACXBIWXMAACZzAAAmcwHzbHUKAAAAEnRFWHRTb2Z0d2FyZQBCYXJjb2RlNEryjnYuAAABAklEQVR42u2ZwQ7AIAhD+f+f3nbwMGwBl3hYg1xM5ngmUBE3u/abCTHtMTZcS4N3O0z3dNiYg+eeickZ02LMVzRcPJ0DD77zPsw5CQv6BGaYIwkmxo6+/V7S2CKHGShvYaNDmngN+T0TfGk9Y/E0DL4YkxVsWCQsSGGOOjPhHaNVfM5W2YMpMCFu2A3QQyHb722ZkQAT+dLzVJEJvqz4hYqc1H2Y4XHgU0WPCmzFxJhMjrTO00K3uDd7MXm8SSdKc1fej/7LLGTK+8yvPW0jZrGZ15sQXWbUGCTXOXIoiDGLLx3RUN1lOjOzCp5MkzZUmlkIM9JnGs9ezF2mxuz8r2e33b2PHKlEJ4PKAAAAAElFTkSuQmCC

Hier ist ein fiddle. JS Geige funktioniert nicht so gut in IE8, also verwenden Sie this link, um das Ergebnis direkt anzuzeigen.

Wenn Sie eine Vorstellung über die Ursache dieses Problems bekam bitte die Fehler base64 :)

Answer 1

Aus irgendeinem Grund teilen decodiert .png ungültig ist. Wenn Sie das Bild herunterladen und erneut speichern, ist die Dateigröße unterschiedlich.

Ich sehe 237 Bytes für die ursprüngliche Verse 409 für eine neu gespeicherte Kopie.

Dies kann mit dem Tool bestätigt werden.

Z:\pngcheck-2.3.0>pngcheck.exe original.png 
original.png EOF while reading CRC value 
ERROR: original.png 

Z:\pngcheck-2.3.0>pngcheck.exe re-saved.png 
OK: re-saved.png (24x24, 32-bit RGB+alpha, non-interlaced, 82.2%). 

die folgenden gültigen re-saved.png Base64 codierten Daten unter Verwendung behebt das Problem in IE8.

background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAABJ0RVh0U29mdHdhcmUAQmFyY29kZTRK8o52LgAAAPlJREFUSEu1VdESwyAM6v7/o7vpqYcEova6vnRmNSRA9HP/nuufTwMorwL06rvm5MQI0n9X1FZAialCOD6+wY09kYqdgE15dpJx9QjGHYfukCJFBbbOHeLa/Wc1QDDFv6OW4xPAqZCuCKkBU6XcEqprjurfSoe5TRlFmVVDoRkAWzOztLP40IDtpShjlznX2TlALhFATbeb5kcuYhGzM4vnJsxBRoPiWek0dc9UZMcAT26oFmw7ClVcq7F3+rCdrQacwFGVHRvsvLpebXD+lsngwrL3wVI0uHB2DBE6UMezGkI11dtn0Yo2dcko90kN1FA9jQ0A9veb6y86oobBWhxQUgAAAABJRU5ErkJggg==); 

Ich gehe davon aus Chrome und Firefox mit dem CRC milderen sind.