Ionic 3 - получить изображение из file.dataDirectory возвращает 404 not found (после normalizeURL)

Я пытаюсь показать изображение в моем ионном представлении, которое хранится в dataDirectory приложения. Но когда я устанавливаю изображение в теге src, он возвращает 404.

Сначала я сохранил изображение, возвращенное из api, в dataDirectory и нормализовал URL:

this.file.writeFile(this.file.dataDirectory, filename, blob, { replace: true })
.then(function(fileEntry) {
    store.photoData = normalizeURL(fileEntry.nativeURL);
    resolve();
});

Нормализованный URL-адрес изображения выглядит так:

http://localhost:8080/var/mobile/Containers/Data/Application/1758E3DC-66D3-4481-8835-79C7841A540A/Library/NoCloud/1510162340797.jpg

Тогда я использую это на мой взгляд:

<img *ngIf="store.photoData" [src]="store.photoData" />

Есть идеи, как использовать изображение локального ресурса в теге src? Я не хочу преобразовывать его обратно в base64! Когда я использую nativeURL с ionic файлом getFile или readAsBinaryString, он возвращает файл, так что он действительно там!

Он действительно добавил <allow-navigation href="http://localhost:8080/*" /> в мой config.xml, не знал, нужно ли это.


cordova ionic-framework ionic3
person Rick de Klerck    schedule 15.12.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Что-то не так с моей каплей. Теперь работает.

var blob: any = this.b64toBlob(contents, 'image/jpg', 512);

b64toBlob(b64Data, contentType, sliceSize) {
            contentType = contentType || '';
            sliceSize = sliceSize || 512;

            var byteCharacters = atob(b64Data);
            var byteArrays = [];

            for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
                var slice = byteCharacters.slice(offset, offset + sliceSize);

                var byteNumbers = new Array(slice.length);
                for (var i = 0; i < slice.length; i++) {
                    byteNumbers[i] = slice.charCodeAt(i);
                }

                var byteArray = new Uint8Array(byteNumbers);

                byteArrays.push(byteArray);
            }

          var blob = new Blob(byteArrays, {type: contentType});
          return blob;
}
person Rick de Klerck    schedule 18.12.2017