9

I'm in the process of building an iOS application that will, when prompted by the user, fetch a large JSON file containing image URLs.

How can I download these images so that they will be available for use by my application even when it has no access to wifi/data?

MWCD
  • 103
  • 1
  • 1
  • 6

1 Answers1

6

React Native has poor support to binary data, you are not be able to get the binary data directly via fetch. However you can use XMLHttpRequest in 0.30 branch or CameraRoll, refer to this post.

If you want to persist those image data, consider use AsyncStorage.

There're also several open source modules help you deal with file access if you want to store the images in file system.

react-native-fs

react-native-fetch-blob

NOTE: react-native-fetch-blob has been discontinued. rn-fetch-blob is a fork of it that is still maintained. When using npm, don't include react-native-fetch-blob but rn-fetch-blob instead.

geisterfurz007
  • 5,292
  • 5
  • 33
  • 54
Xeijp
  • 853
  • 1
  • 7
  • 18
  • 2
    Thanks for the response! How can you use AsyncStorage for images? From what I've read it seems like AsyncStorage can only be used with String data. – MWCD Jul 21 '16 at 06:59
  • 1
    new XMLHttpRequest will return a BASE64 encoded string, that can be stored in AsyncStorage, if you're using CameraRoll you can store URI of the image. – Xeijp Jul 21 '16 at 08:27
  • 1
    You might want to consider `react-native-fetch-blob` https://github.com/itinance/react-native-fs/issues/228 – four-eyes Sep 27 '17 at 06:57