Преобразовать URI изображения в файл или блоб [ionic] - PullRequest
0 голосов
/ 25 апреля 2019

Я могу получить URI изображения, используя плагин Ionic Image Picker :

this.imagePicker.getPictures(options).then((results) => {
    for (var i = 0; i < results.length; i++) {
        //below logs: 'Image URI: file:///Users/josh.0/Library/Developer/CoreSimulator/Devices/CC0FFBD2-EADF-4489-8F22-7948E0EFD261/data/Containers/Data/Application/2BC3C571-61B7-4EFF-A4D1-4D1F99F04EBC/tmp/cdv_photo_013.jpg'
        console.log('Image URI: ' + results[i]);  
    }
}, (err) => { });

Мне нужно получить это изображение в виде файла, чтобы я мог загрузить его.Я попытался сделать следующее, но это не работает:

this.imagePicker.getPictures(options).then((results) => {
    for (var i = 0; i < results.length; i++) {
       console.log('Image URI: ' + results[i]);
       let base64Image = "data:image/jpeg;base64," + results[i];
         fetch(base64Image)
            .then(res => res.blob())
            .then(blob => {
                //Doesnt fire
                console.log("Got blob")
                const file = new File([blob], "image.png")
         })
    }
}, (err) => { });

Как преобразовать URI изображения в файл?Спасибо!

Ответы [ 2 ]

0 голосов
/ 26 апреля 2019

Ионик действительно нуждается в улучшении своей документации. Документация по плагину в документах абсолютно жалкая. Мне потребовались часы, чтобы понять это самостоятельно. Во всяком случае, вот оно:

getImage() {
    const options = {
        maximumImagesCount: 1,
        width: 800,
        height: 800,
        quality: 100,
        outputType: 1 //Set output type to 1 to get base64img
    };

    this.imagePicker.getPictures(options).then((results) => {
        var files: File[] = [];
        for (var i = 0; i < results.length; i++) {
        console.log('Image URI: ' + results[i]);
        let blob = this.getBlob(results[i], ".jpg")
         const file = new File([blob], "image.jpg")
         //Do something with file like upload
       }
    }, (err) => { });
}



private getBlob(b64Data:string, contentType:string, sliceSize:number= 512) {
    contentType = contentType || '';
    sliceSize = sliceSize || 512;
    let byteCharacters = atob(b64Data);
    let byteArrays = [];

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

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

        let byteArray = new Uint8Array(byteNumbers);

        byteArrays.push(byteArray);
    }
    let blob = new Blob(byteArrays, {type: contentType});
    return blob;
}
0 голосов
/ 26 апреля 2019

Вам нужно получить файл из каталога с AJAX.Я использую AngularJS и ниже это то, что я использовал, чтобы получить Blob.Вы можете в значительной степени преобразовать это в любую среду / библиотеку JS, которую вы используете.

AngularJS метод:

$http.get(file_uri, {'responseType':'blob'}).then(successMethod, failMethod);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...