How to secure your IPinfo token on the frontend, a brief primer on filtering referring domains.
The classic advice of API access tokens is that you should NEVER put your API access token in the frontend or website directly. This is very true. It is fairly easy to extract an API access token from the frontend. All you have to do is open up the DevTools and…. I digress.
Let’s see how you can secure your IPinfo.io IP geolocation access token, if you have put it directly on your website’s frontend.
API Access Token in the frontend?
What if, for convenience or for speed or for any reason, you need to put your API access token in the front-end.
For example:
Let’s say you want to see if a visitor of your website is based in the EU zone, and therefore your site is now subjected to the GDPR regulations. Now, GDPR comes with a whole host of user privacy related rules and regulation.
To check whether a visitor is from Europe you can check it using their IP address and IPinfo. Once you are sure that the user is from a country that is covered under GDPR regulation, you can ask the visitor to agree to your privacy statement, redirect them to another page, or you can simply block their access to your site. It is your choice.
Should you put your IPinfo Token in the frontend?
Now, how can you find out where the user is from. It is quite simple with IPinfo. IPinfo takes the visitor’s IP address and provides you with their geolocation information.
Now, you can instantly get the visitor’s geolocation (city, region, country) from their IP address using IPinfo’s API services and make any kind of decision necessary. IPinfo has a ton of resources to get you started.
But you need to put your access token in the backend, right? Well, putting your access token in the backed is the best practice. However, if:
- you have a static site with no backend
- you want instant geolocation confirmation
- you want to block the user from accessing your site based on geolocation
- you want to redirect the user to another page based geolocation
- you want to change the language to suite the user's geolocation based preferences
- you need to update taxes, shipping costs or prices based on geolocation
or if you have any specific needs or wants, you might need to put the IPinfo access token in the front end.
But the important part is doing it safely!
IPinfo provides an added level of token security with their domain and IP address filtering security measures.
IPinfo Token Security
After you signed up for IPinfo, visit:
🔗 https://ipinfo.io/account/token
Or you can go to your dashboard, click on the token section and scroll to the bottom.
Now you have two options to secure your website:
- Whitelist Referring Domains
- White Requesting IPS
But for this case, you will need to use the “whitelist referring domains” security measure.
Whitelist Referring Domains
This is one of the simplest way to block/allow API requests using your token based on the domain name.
Simply add your website to the input field of the “Whitelist Referring Domains” and “Save” the settings.
So how does it work? After this setup, requests using IPinfo Access Token will be limited to only your website (domain) or to any other website domains you may mention there. This includes the subdomains as well.
This is done with the Referer HTTP Header of the request. The “Referer header” is a kind of header that shows, from which domain, the request has originated from.
IPinfo will simply allow only API requests containing the referrer header domains you have set.
This is not exactly foolproof, as HTTP headers can be modified. But it is better than nothing.
Conclusion
TLDR: visit: https://ipinfo.io/account/token, put your domain name in the “Whitelist Referring Domains” and save.
IPinfo’s Token security features, makes your token security a bit more enhanced, but it isn’t 100% secure. You should always consider putting your token in the backend, where access to it can be limited and controlled. You can even select from which IP addresses the IPinfo service can be using your token. Visit the FAQ section to learn more.
Top comments (0)