๐ ๐๐ ๐ฝ๐ผ๐๐ฒ๐ฑ ๐ ๐ ๐๐ฃ๐ ๐๐ฒ๐ ๐ง๐๐ถ๐ฐ๐ฒ
I leaked my API key twice while building a side project.
First, I hardcoded the key in a JavaScript file. I pushed it to GitHub. A security scanner caught it. I rotated the key.
Second, I used a .env file. The key still appeared in the browser network tab. Anyone with DevTools saw it.
Client-side secrets are not secrets.
I built a proxy using Cloudflare Workers. Here is how it works:
- Your frontend sends a request to the proxy.
- The proxy adds the API key on the server.
- The proxy calls the AI API.
- The proxy sends the result back to the frontend.
The API key never touches the browser.
Why this works:
- Low latency. It adds 10 to 30ms.
- Low cost. Cloudflare gives 100k free requests per day.
- Better security. You use a proxy secret to block bots.
My lessons:
- Never hardcode keys.
- Never trust the frontend.
- Use a proxy for API calls.
What is your setup? Do you use a proxy or a managed service?