How to hide the API Key in the TileLayer?

PaulLeCam / react-leaflet

React components for Leaflet maps

https://react-leaflet.js.org

Other

5.19k stars 887 forks source link

How to hide the API Key in the TileLayer? #1129

Closed ericledonge-betonprovincial closed 8 months ago

ericledonge-betonprovincial commented 8 months ago

<TileLayer
  attribution='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
  url={`https://tile.thunderforest.com/atlas/{z}/{x}/{y}.png?apikey=${process.env.NEXT_PUBLIC_THUNDERFOREST_API_KEY}`}
/>

Is it possible to hide the API Key, please? I am using Nextjs 14 with App Router.

I tried to wrap the TileLayer in a RSC but it's not working.

Thx!