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?

ageoff · Accepted Answer · 2020-03-16 19:21:25Z

3

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}}
/>

answered Mar 16, 2020 at 19:21

ageoff

2,8282 gold badges28 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Vasanth Over a year ago

this works for me. But rather having static header, if I create a util function that returns the header this will not work. Do you have any idea ??

29er Over a year ago

@Vasanth i am curious as well to get this working using a utility function. did you have any luck ?

Collectives™ on Stack Overflow

React Native image from URL that requires headers

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related