Google Maps JavaScript API RefererNotAllowedMapError and Github .env File
Clone Sample won’t work at npm start
sample project: Place Searches | Maps JavaScript API | Google Developers
git clone -b sample-place-search https://github.com/googlemaps/js-samples.git
cd js-samples
npm i
npm start
A message like this kept showing up. If you clicked in docs, it only gave you useless instructions that won’t work even if you tried million times.
How to solve it?
First, go to See the Maps JavaScript API and Get an API Key.
Make sure you have Maps API Key and empty the others to troubleshoot.
Somehow npm run build / vite build don’t use .env to update your API key in index.html.
And, don’t forget to protect you key like mine here:
Resources:
Google Maps JavaScript API RefererNotAllowedMapError — Stack Overflow
How to use GitHub Actions secrets to hide your tokens and passwords example
What if I want to use API key in build/Productionby creating .env file.
My example: (add a workflow to manually overwrite or create one .env)
Set up your API key by Github Actions Secrets
Resources:
Create .env file · Actions · GitHub Marketplace
environment variables — How do I use an env file with GitHub Actions? — Stack Overflow
How to use GitHub Actions secrets to hide your tokens and passwords example (theserverside.com)
Contact me: Hung, Chien-Hsiang (chienhsiang-hung.github.io)
