supermedium / aframe-react

:atom: Build virtual reality experiences with A-Frame and React.
https://ngokevin.github.io/aframe-react-boilerplate/
MIT License
1.42k stars 151 forks source link

Materials from url() are not loading #118

Open andrewrutter opened 6 years ago

andrewrutter commented 6 years ago

I am running through a proof of concept which is attempting to load images from a remote host as a material on a collection of blocks. The code is very simple:

<Entity geometry={{'primitive': 'box', width: width, height: height, depth: depth}}
                material={{src: `url('${photoUrl}')`, color}}
                position={`${x} ${y} ${z}`}
                onClick={() => {this.props.onClick(id) }} />

photoUrl is valid and I do see requests to load these images going out in Chromes network inspector. However, the url loads are immediately cancelled which I can only assume is a CORs issue although there is no error information being displayed. I did see on the aframe github issues that there is a need to pass in "crossorigin"="anonymous" but cannot see how to inject that here.

If I change the remote url for a locally hosted image the code is working fine.

Thanks

yogiprsetya commented 3 years ago

any solution ?

ygf8 commented 2 years ago

Same issue, I tried to put crossOrigin='anonymous' in img tag (in the section a-assets) and in THREE.ImageLoader, THREE.FileLoader, document.querySelector('a-assets').fileLoader ... everywhere , I still have CORS issue

My Config: "aframe-react": "^4.4.0" / "aframe": "1.0.4" @andrewrutter @yogiprsetya please have you found a solution ?

I don't know if it's related to aframe-react or aframe component , everywhere in my react app I don't have CORS issues.