React Native image from URL that requires headers

Question

I need to display an Image component where the source is a URL that requires http headers passed on to fetch it (for authentication purposes).

How could this be implemented in RN?

Is there a way to add headers to the source?

Answer 1

This has been added to react-native. See here:

https://reactnative.dev/docs/images.html#network-requests-for-images

Example in link:

<Image
  source={{
    uri: 'https://reactjs.org/logo-og.png',
    method: 'POST',
    headers: {
      Pragma: 'no-cache',
    },
    body: 'Your Body goes here',
  }}
  style={{width: 400, height: 400}}
/>