Is there any way to add custom headers to the image grid or any other image control? We need to pull images from a server that requires additional authorization.
Currently the image controls seem to allow only for a simple URL. However in React Native (and I believe regular React as well) you can do the following:
The image & image grid components accept simple urls or base64 encoded image data.
What is the format of the data coming back from your api? You should be able to create a rest api resource that connects to your image api and includes the appropriate authorization headers. Then, in your app, you can query that resource & return the query results in your image grid.
For example, I've created a rest api resource that connects to the unsplash api using my client id in the auth headers.
I can query that api in my app (no need to pass the auth token in the app query, since it's stored in my resource set up) & return the results in an image grid (the format for the data source will depend on your specific api results):
I'm not sure your solution will work in our case but I might missunderstand what you're doing. I can get the URL but each image GET has to include the required headers. Right now I'm downloading the data with a standard rest call first and then convert it to a base64 url in order to display it. This isn't ideal (super slow, no caching, uses tons of memory).
It would be much better to just add the additional properties of the standard React image control.
