Получить изображение с сервера, сохранить его в localStorage и отобразить

Это должно быть достаточно просто, но после нескольких часов борьбы с ним я все еще не могу заставить его работать. До сих пор все мои попытки приводили к тому, что изображение становилось «поврежденным или усеченным», согласно firefox.

Получить изображение с сервера с помощью вызова jquery-ajax:

 $.ajax({
                async: false,
                url: db[key]["DocumentLink"],
                success: function (result2) {


Base64 кодирует изображение и сохраняет его в localStore:
Я все еще не могу заставить его работать. До сих пор все мои попытки приводили к тому, что изображение становилось «поврежденным или обрезанным», согласно ...

Это должно быть достаточно просто, но после нескольких часов борьбы с ним я все еще не могу заставить его работать. До сих пор все мои попытки приводили к тому, что изображение становилось «поврежденным или усеченным», согласно firefox.

Получить изображение с сервера с помощью вызова jquery-ajax:

 $.ajax({
                async: false,
                url: db[key]["DocumentLink"],
                success: function (result2) {


Base64 кодирует изображение и сохраняет его в localStore:
Я все еще не могу заставить его работать. До сих пор все мои попытки приводили к тому, что изображение становилось «поврежденным или обрезанным», согласно…

Это должно быть достаточно просто, но после нескольких часов борьбы с ним я все еще не могу заставить его работать. До сих пор все мои попытки приводили к тому, что изображение становилось «поврежденным или усеченным», согласно firefox.

Получить изображение с сервера с помощью вызова jquery-ajax:

 $.ajax({
                async: false,
                url: db[key]["DocumentLink"],
                success: function (result2) {


Base64 кодирует изображение и сохраняет его в localStore:
В этом примере я использую плагин jquery base64-encoding, но я пробовал несколько.

                        var dbKey = "Doc " + db[key]["ID"] + " " + db[key]["Title"];
                        console.log("storing: " + db[key]["DocumentLink"] + " in " + dbKey + "\n");
                        localStorage.removeItem(dbKey);
                        var base64Image = $.base64Encode(result2);
                        console.log(base64Image.length);
                        localStorage.setItem(dbKey, base64Image);
                       console.log("is stored: " + db[key]["DocumentLink"] + " in " + dbKey + "\n");
                }
})


Отображение изображения с URL-адресом данных:

function openImageFromDB(dbKey) {
    console.log("Trying to display image with key " + dbKey);
    var base64Img = localStorage.getItem(dbKey);
    document.getElementById("documentHolder").src='data:image/jpeg;base64,' + base64Img;
}


Соответствующий img:

 <img id="documentHolder" alt="Image view placeholder" src="" />


Однако при каждой попытке firefox отображает :

Image corrupt or truncated: data:image/jpeg;base64,77+977+977+977+9a<... much longer string>


URL: указывает на допустимое изображение jpeg, а base64Image.length и сообщение об ошибке показывают, что var / localStorage на самом деле содержит данные в кодировке base64.

Есть идеи?

9
задан Gumbo 19 March 2011 в 19:10
поделиться