Begrip: Environment Variables

Voor projecten aangemaakt via vite kan een .env file gebruikt worden. In deze file worden environment variabelen opgeslagen die beschikbaar moeten zijn in de frontend code, let op, hiervoor moet de prefix VITE_ toegevoegd worden aan de naam van de variabele. De .env file moet in de root van je project bewaard worden.

Via het import.meta.env object kunnen de verschillende environment variabelen opgevraagd worden.

Gevoelige API Keys

Alhoewel wij dit bestand gebruiken om een API key te bewaren is dit niet veilig. Enkel API keys die bedoeld zijn om publiek beschikbaar te zijn (i.e. in een website), kunnen hier bewaard worden. De .env file wordt mee in de production build van de applicatie gezet waardoor elke key gelezen kan worden door al je gebruikers.

Het is meestal beter om je API keys op de server te gebruiken zodat je authenticatie en autorisatie kan toevoegen en kan garanderen dat je keys niet misbruikt worden.

/.env

VITE_ENVIRONMENT_VARIABLE=some-string-value-here

/someFrontendFile.ts

const ENVIRONMENT_VARIABLE = import.meta.env.VITE_ENVIRONMENT_VARIABLE

:::