Swap scene crash: custom Three.js pipeline module

Technical Support
1

Hi I’m using 8thwall + Three.js (+ vitejs) in a project without Cloud Editor or Niantic Studio.

1- The experience begins with the front camera enabled. A record button allows the user to capture a short video of themselves. After recording, a looping preview of the captured video is displayed along with a “Go Next” button.

2- When the Go Next button is pressed, it triggers a pipeline swap: the scene transitions to a new 8thWall module using the back camera with world tracking enabled, showing a 3D box in the AR environment. The logic for this scene transition is handled inside theSwapController.js

3- and that’s it.

→ I’m encountering a crash the first time the experience loads, when swapping from the front-camera pipeline to the back-camera pipeline. If I refresh the page, the crash won’t happen again. I’m still investigating the root cause, but any feedback or pointers would be greatly appreciated. Thank you!

Repository: GitHub - Alex-DG/8thwall-threejs-swap-pipeline
Live url: https://8thwall-threejs-swap-pipeline.vercel.app/

Alex.

2

Hi, I have seen this issue come up in the past. I’ve added a swap camera example here that does what you’re looking for: web/examples/threejs/swap-camera at master · 8thwall/web · GitHub

The issue is probably related to how gyro permissions are captured. If you request all permissions upfront that will likely solve the crash.

2 Likes
3

Thanks a lot, Evan! Requesting all permissions up front solved it!

I was originally following this demo (https://www.8thwall.com/playground/threejs-swap-camera/code/) and in this project it seems to work fine without “request all permissions upfront”. I’m not sure if the issue was because of a newer Three.js version is used in our projects, or the fact that the original project wasn’t created in the Cloud Editor, but it’s working now :+1:

4

This topic was automatically closed 4 days after the last reply. New replies are no longer allowed.