react-xr icon indicating copy to clipboard operation
react-xr copied to clipboard

WebXR Persistent Anchors

Open DevPika opened this issue 5 months ago • 4 comments

@bbohlender Great work on this library! I am trying to create a simple WebXR demo with persistent anchors. I noticed quite a bit of commented-out complete-looking code for supporting persistent anchors in the codebase, all added in this commit from last year https://github.com/pmndrs/xr/commit/8005cb191ad64c09f19b19842bedac5d60a53595 . Can you provide some insight into why this is commented out? Did you want to provide a different API for this feature? Or any bugs or blockers? I would love bring this feature into the library, let me know if I can help!

As a reference, aframe allows creation of persistent anchors by passing persistent: true to the anchored attribute. The implementation is very similar - it saves the string returned by requestPersistentHandle() with the element id as the key in local storage.

DevPika avatar Jun 29 '25 08:06 DevPika

Hey @DevPika

Its commented out because it was causing issues on the Meta Quest platform, which was also the only platform that supported it. Assuming its fixed in the meta quest platform, a PR to enable it (including docs) would be amazing. Do you have a meta quest for testing? :)

bbohlender avatar Jul 03 '25 08:07 bbohlender

Thanks for the context. I tried uncommenting the code, using the hook in a simple example component and tested on a Meta Quest 3, but I encountered some errors, possibly caused by multiple calls to anchor deletion and loading (still unsure about the cause). I tried the persistent anchors example from Meta's documentation page, it seems to be working as expected so the issue most likely has to do with the saving and loading implementation of the hooks. I'll continue to look into this.

DevPika avatar Jul 06 '25 11:07 DevPika

StrictMode was causing issues with calling load twice. Other than that, I found one more bug in the deleting anchor code: the ID being passed to the function is the id of the element, not the UUID of the anchor. Once I fetched the UUID from the localStorage using const anchorId = localStorage.getItem(id) and passed the anchorId instead of the element id, the creation, loading and deletion of persistent anchors seems to work smoothly.

Some more context: The error message given by the Meta browser seems to be misleading when an incorrect id is passed to deletePersistentAnchor, which made this non-obvious:

Uncaught (in promise) InvalidStateError: Failed to execute 'deletePersistentAnchor' on 'XRSession': Device does not support feature anchors

The error message says anchors are not supported, whereas it should be something to the effect of "UUID not found". I'll check for any other issues (page seems to be crashing when exiting XR mode).

DevPika avatar Jul 06 '25 14:07 DevPika

Amazing analysis. Would be awesome to get your fixes into a PR! 🙏

bbohlender avatar Jul 06 '25 17:07 bbohlender