How to solve Sanity warning: You have configured Sanity client to use a token in the browser

Question

I'm using ReactJS for the front-end and Sanity for the back-end.

I came across this warning and I have read this linked documentation but I'm not sure how to apply in this case. I'm sure that I don't want to ignore the warning if it's for security issue.

• I put my secret Sanity token inside an .env file, I thought this would work but apparently they say it would be exposed in the app bundle.
• There are 2 suggestions in this document but it doesn't say how to apply it.

-> So what would be the right way to configure the token in this case? And can you help me understand how to apply it, please? Thanks everyone!

---

client.js

import sanityClient from '@sanity/client'

export const client = sanityClient({
  projectId: process.env.REACT_APP_SANITY_PROJECT_ID,
  dataset: 'production',
  apiVersion: '2022-02-01',
  useCdn: true,
  token: process.env.REACT_APP_SANITY_TOKEN,
})