Heads up! We're sunsetting this forum to streamline our community space.

join us on Discord for support, updates, and all things Snap AR! See you there!
Sign up for our live Camera Kit office hour on July 17 @ 9:30am (PT) / 4:30pm (GMT)

Runtime Error: navigator is not defined [Camera Kit Web]

Naomi Eberle
Naomi Eberle Posts: 8
in General #1

Hello!

I am working on deploying a Next.js web app with camera kit, and I'm getting this persistent error:

Unhandled Runtime Error
Error: navigator is not defined
node_modules\@snap\camera-kit\lib\common\locale.js (1:22) @ navigator

On localhost, the error does show up when I load the page, but doesn't seem to be affecting anything. All the page elements load, and the camera kit integration plays lenses as expected.

However, when deploying for external server testing, the error is enough to fail the deployment.

Any advice would be much appreciated. Thanks!

Answers

  • Michael Mase
    Michael Mase Posts: 66 🔥🔥
    #2

    Hi @Naomi Eberle! Thanks for your post. It looks like your Camera Kit code is getting run on the server side of your application. This most commonly occurs when server side rendering is enabled for your application. Here is a resource that may help you mitigate this error: https://www.skies.dev/on-client

    I hope this helps! If you have any more questions, feel free to reach out.

  • Naomi Eberle
    Naomi Eberle Posts: 8
    #3

    Thanks Michael, that was it!

    I had been running on a "use server"; page because earlier I had not been able to run async/await code on a client page. For anyone else struggling with this, useEffect() can let you run camera kit on a client page!

Categories