I'm trying to embed a VR view in a simple web page served up from Azure. Here is the page in action: https://beaker.azurewebsites.net/360/
As you can see I'm getting a Render: unable to load texture from "//beaker.azurewebsites.net/360/images/Zest.jpg"
The VR view works fine for the scuba diving image hosted by google. storage.googleapis.com/vrview/examples/coral.jpg but something about how my image is hosted in Azure doesn't work with the VR view. As you can see the Zest.jpg image below the coral VR view.
Here is my html:
<html>
<body>
<h1>VR View examples</h1>
<iframe width="100%" height="300px" allowfullscreen frameborder="0" src="//storage.googleapis.com/vrview/2.0/index.html?image=//beaker.azurewebsites.net/360/images/Zest.jpg&is_stereo=true"></iframe>
<iframe width="100%" height="300px" allowfullscreen frameborder="0" src="//storage.googleapis.com/vrview/2.0/index.html?image=//storage.googleapis.com/vrview/examples/coral.jpg&is_stereo=true"></iframe>
<img src="/360/images/Zest.jpg"/>
</body>
</html>
I tried adding CORS for googleapis.com, but that didn't seem to help either.
I'm not sure why it isn't working... Any ideas would be appreciated.
I saw these other posts: VR View - Render: Unable to load Texture from image.jpg
Google Vr - Unable to load texture
But those both look like different problems.