Allowed domains
Your API key is part of your web app's code, so anyone can read it in the browser. To stop other websites from using it, limit it to your own domains.
Add allowed domains
Open your account page and add each domain your app runs on under Allowed domains. Changes take effect within a minute.
If the list is empty, any website can use your key. This is the default. Restrictions take effect when you add your first domain.
Once the list has at least one entry, only matching websites receive translations. Requests from other websites return the error ORIGIN_NOT_ALLOWED, and their text stays untranslated.
What you can enter
| Entry | Allows |
|---|---|
example.com | example.com on any scheme and port |
*.example.com | every subdomain, such as www.example.com or app.example.com, but not example.com itself |
my-app-*.vercel.app | preview deployments such as my-app-git-main.vercel.app |
https://example.com | only https://example.com |
localhost:3000 | only port 3000 on localhost |
localhost | localhost on any port |
* matches any characters. To allow a domain and all its subdomains, add both example.com and *.example.com.
Developing locally
Add localhost to keep using the key while you develop. Otherwise translations stop working on your machine as soon as the list has an entry.
Server-side rendering
Servers have no domain, so once your key is limited to your domains, React SSR, Next.js and Angular prerendering need a secret key.