google-cloud-storagereact-360

React-360 Image URI not Visible


The react-360 instructions seem very clear and simple:

<Image source={{uri: "https://images.pexels.com/photos/614810/pexels-photo-614810.jpeg?auto=compress&cs=tinysrgb&h=650&w=940"}} style={{height:100,width:100}} />

But I've manually uploaded image files to Google Storage, Amazon S3, and Azure Blob Storage. After making them public they all render to a non-react-360 browser img element perfectly, but none of them work in the react-360 browser canvas.

But "https://images.pexels.com/photos/614810/pexels-photo-614810.jpeg?auto=compress&cs=tinysrgb&h=650&w=940" is a URL I've found that does work, but uploading that same picture to storage doesn't work.

Even when I get a successful 200 or a partial content 206 result code while experiencing my issue, all I can do to see the image element is to set the background color, the actual image is never visible.

How do I get my JPEG images in Google Cloud Storage to render to Image elements in react-360? Thanks and please :)


Solution

  • https://cloud.google.com/storage/docs/cross-origin

    Don't allow CORS:

    Do allow CORS: