1

I am trying to find a way to load image reference I get from places api into places photo API using Image component of react-native like below,

const imageLink = 'https://maps.googleapis.com/maps/api/place/photo?maxwidth=400&photoreference=CmRaAAAAuZ36wzrMYCVNWM1smQkRKuQyXecPgRpcsMfrSqbJM0EUTXZ62j8Ljxtk8HsxohXbtAwZAwmj_F3HmDwLoQaH9qt2TZJhhA6EuXK41UFo0Ow750MJujtrr5hgHR2lF7EXEhCkWj_dZ4LefrYzLU1_5RF1GhTR7Ggem5IJ-v7V2U8fjKoU9tBUOg&key=--MyKey--'
return (
        <View >
            <TouchableHighlight >
                    <View>
                        <Image
                            style={{width:64, height:64,flex:1,backgroundColor:'red'}}
                            source={{uri: imageLink}}
                        />


                    </View>    
             </TouchableHighlight>
        </View>

    );

I am getting only empty placeholder with above code. However, I am able to load this link in browser.One caveat is that google places photo's link is redirecting to some other url which then displays image in browser. Am I doing it right? or is there any other way I can accomplish the same. Note: I tried react-native-network-image library as well.

Learner_Programmer
  • 1,259
  • 1
  • 13
  • 38

1 Answers1

-1

You can have a look at the ImagePrefetch function in googleplace module: https://github.com/srirangan/googleplaces.js/blob/master/test/ImageFetchTest.js

However, I am having issue with the whole module at the moment because of the line var https = require("https"); called in this specific function. Not sure if it's an issue with new version of RN (upgraded to 0.55 recently) or just some other error in my new setup.

This worked perfectly in previous RN (was running on 0.48)

xavier lecoquierre
  • 1
  • 1