Hide mapbox and planet (or other tilemap) API from the frontend

I'm trying to hide the access token/api key from the client side. I'm using svelte (not sveltekit) with dotenv to store my keys. .env MAPBOX=someaccesstokenkeys PLANET=someaccesstokenkeys STYLE=stylefolder/styleid The map worked just fine, no error. But when I check the source from the element inspector, the keys are still not hidden. Are there any alternatives? or I have to redo this in sveltekit? EDIT: I've tried svelteKit, put my secretkey on .env, and import from page.server.js. From there, I return the data (I don't know any way other than this) and I assume this also expose the secretkey on client-side. +page.server.js import { MAPBOX, PLANET, STYLE } from '$env/static/private' export async function load() { // this will expose to client-side return { mapbox: MAPBOX, planet: PLANET, styleid: STYLE } } Are there anyway to hide it from the client-side?