I’m trying to use WebXRImageTracking in a bundled React Native app and running into an issue with getting an image source.
I’m using Image.resolveAssetSource to transform a number representation of an image to the uri needed for WebXRImageTracking. This is working fine in an unbundled app, I’m getting something like http://10.0.70.18:8083/assets/img/etcetcetc. However, in a bundled app, this same code is getting a img_pathtotheimageetcetc instead, which the WebXRImageTracking doesn’t seem to want.
It’s throwing a Error loading images for tracking, WebXRImageTracking disabled for this session.
I’m not getting a specific error, but I changed some stuff and got this more specific error: Error loading image with exception: Error: Image with provided source returned empty response.
So it seems that it’s trying to parse the image in there, but it’s empty. Hardcoding a url does work in a bundled app, but how do I provide a local image (I do see it in the android project, so it is there) so that it doesn’t get seen as empty?
Hi! Thanks for the answer. I’ve looked through the link you sent, and some other threads on this topic. I’m not entirely sure what the exact solution is though?
I have a location of the bundled image, and when I put this in a normal image component it renders it. Is there another way to get the image uri in such a way that the image tracking will accept it? From what I’ve read a common solution is to convert the image to base64? But I don’t think that would work for this feature.
A require was also suggested, but that also doesn’t seem to get accepted by the image tracking as a src.
I’ve also tried adding the prefix file://, but that also gave an error.
Hi! I just checked, and I don’t seem to have the same issue with iOS. Do you maybe know of a way to make this work on Android as well? Any way to convert the bundled image so that it is accepted by the image tracking?
Hi! I saw that, but I wasn’t sure if base64 would work as src for the ImageTracking, I thought it had to be a url specifically. Did I misunderstand that?
Have you tried expo-asset as mentioned in the linked issue? It seems like other folks were having success using it for resolving uris for embedded/bundled assets.
Hi! Yeah I saw that as well, but unfortunately we don’t have expo in the project so using expo-asset isn’t an option. I’ll take a look if there’s another way to transform the link.
What does expo-asset output that babylon does understand?
I haven’t been able to find a way to get an exact file path for stuff in the drawable folder. For normal use in images it’s apparently enough just to have the name of it in the drawable folder: Images · React Native
I have been able to use react-native-fs converting images in the bundle to textures like mentioned here, but I’m currently at a loss how to figure this out for WebXRImageTracking specifically.
I’ll continue working on it, but if anyone has figured this out before I’d be all ears
This is how I managed it for normal textures, in case anyone comes across this: