2017-06-11 17 views
2

私は、ユーザーのカメラロールから特定の画像を取得してクラウドストレージに保存する(現時点ではFirebaseを使用しています)、反応するネイティブiOSアプリケーションに取り組んでいます。React Native Image uriをbase64に変換するスピードアップ

私は現在、カメラロールから画像を取得しています。各画像をクラウドに保存するために、画像URLをbase64に変換してから、react-native-fetch-blobライブラリを使用してブロブに変換しています。これが動作している間、私は各画像が非常に長い時間を取っているために、base64への変換プロセスを探しています。

カメラロールから例の画像: enter image description here

、カメラロールから画像ごとに画像のURIを取り、それを変換して、雲にそれを格納するための最も効率的/最速の方法だろう何ストレージ。 これを処理するにはより良い方法がありますか? Web Workersを使用すると、base64変換処理が高速化されますか?

私の現在の画像変換処理は:

import RNFetchBlob from 'react-native-fetch-blob'; 
const Blob = RNFetchBlob.polyfill.Blob; 
const fs = RNFetchBlob.fs 
window.XMLHttpRequest = RNFetchBlob.polyfill.XMLHttpRequest 
window.Blob = Blob 

function saveImages(images) { 
    let blobs = await Promise.all(images.map(async asset => { 
     let response = await convertImageToBlob(asset.node.image.uri); 
     return response; 
    })); 

    // I will then send the array of blobs to Firebase storage 
} 


function convertImageToBlob(uri, mime = 'image/jpg') { 
    const uploadUri = uri.replace('file://', ''); 

    return new Promise(async (resolve, reject) => { 
     let data = await readStream(uploadUri); 
     let blob = await Blob.build(data, { type: `${mime};BASE64` }); 
     resolve(blob); 
    }) 
} 

function readStream(uri) { 
    return new Promise(async (resolve, reject) => { 
     let response = await fs.readFile(uri, 'base64'); 
     resolve(response); 
    }) 
} 
+0

なぜあなたも、BASE64が必要なのでしょうか?デバイスのread - > blobを実行できるはずです。 – codeisforeva

答えて

0

私は以下のソリューションは、プロセスをスピードアップに非常に有用であることが判明。 base64変換は、JSではなくネイティブ側で行われるようになりました。

React Native: Creating a custom module to upload camera roll images.

また、このサムネイル解像度に画像を変換します注目に値します。

ここでフル解像度フォローguillaumepiotのソリューションに画像を変換するには: https://github.com/scottdixon/react-native-upload-from-camera-roll/issues/1

関連する問題