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)

Environment Variables and Camera Kit Web

alex_doudnikov
alex_doudnikov Posts: 14 🔥
edited May 2023 in General #1

Hi Team,

Currently working on a Next.js project and was hoping to get the API keys working through environment variables.

I have found that anytime I set the API key "dynamically" camera kit throws "client.js:1 ConfigurationError: Unsafe apiToken"

I had this occur when I was working on an Angular project before as well.

My setup is as follows:
.env.development contains CAMERAKIT_APITOKEN = "[token key here]"
index.tsx contains const cameraKit: CameraKit = await bootstrapCameraKit({ apiToken: process.env.CAMERAKIT_APITOKEN!, });

It would be nice to use the environment variables instead of hard coding the token to work between staging and prod.

I assume it is set this way to not allow the token to change after compiling or something.

Any way to get it working?

Thanks, Alex

Tagged:

Answers

  • alex_doudnikov
    alex_doudnikov Posts: 14 🔥

    Solved,

    Because my app is delivering the variable to the client it requires the prefix "NEXT_PUBLIC_" in front of the env variable.

  • stevenxu
    stevenxu Posts: 612 👻

    @alex_doudnikov Thanks for closing the loop! My apologies for the delay as I'm catching up. Thanks again!

Categories