Privacy and freedom are two things that can not take the place. From anonymous web browsing with the help of VPN or proxy servers to anonymous electronic transactions via cryptocurrencies online freedom is the biggest search of internet users today.

 show the IP address with javascript "src =" https://lh3.googleusercontent.com/-2a9Cjj5GeGM/WoQxh9qjG2I/AAAAAAAASQ4/iZcG1osRkis0Ha_7NOPUB5SHa2E2u-7aACHMYCw/image10?imgmax=800 "width =" 597 "height =" 504 "/> </p>
<p align= It is difficult but not impossible to achieve full online anonymity thanks to developers working hard to introduce new tools and apps every day, I'm sure you all know how to your IP address with a VPN server Tor browser or any proxy server but what you might find more attractive is understanding how you can figure out the IP addresses and geolocation of your website visitor using the simple client-side JavaScript and HTTP API.

What is IP address?

IP address stands for Internet protocol address which is a unique set of numbers, separated by complete registers, which each computer identifies using the internet protocol to communicate via a distributed network.

IP address is a unique numeric address assigned to your computer by your internet provider (ISP). Every computer that is connected to the internet has a unique IP and the internet activity can easily be handled via the IP address.

At this moment you can easily retrieve useful client IP addresses using WebRTC which is supported by browsers such as Firefox, Chrome and Opera. But to retrieve all the details of a user's IP address, there are numerous free services that provide a public HTTP API .

These APIs use a database of IP addresses associated with cities, along with other relevant information such as time zone, region, zip code, latitude and longitude.

How can I show the visitor of the site IP address and geolocation?

I use the free HTTP API that is offered by the freegeoip.net website. We will do a simple ajax call to the freegeoip to retrieve the JSON data and JSON as text in plain JavaScript . The data is requested from the server using XMLHttpRequest ().

DEMO: A yellow bar appears, followed by a table with the full details of your public IP address and geographical location.

#loaderip {margin: 10px; padding: 20px; background: yellow; font-size: 30px; }
table.custom, table.custom2 {width: 100%; font-family: helvetica; border-spacing: 0; border: 0px solid #bbb;} table.custom, table.custom th, table.custom td, table.custom2 th, table.custom2 td {border: 1px solid #ddd; border-collapse: collapse} table.custom td, table.custom2 td {padding: 15px; min-width: 100px;} th {padding: 7px 10px; text-align: left; font-family: oswald; font weight: 400; font-size: 16px;} table.custom tr: nth-child (odd), table.custom2 tr: nth-child (odd) {background-color: # f1f1f1} table.custom tr: nth-child (even), table.custom2 tr: nth-child (even) {background-color: #fff} table.custom th {background-color: # 333; color: #fff; border: 1px solid # 333} table.custom th: nth- child (even) {background-color: # 555}
table.custom2th {background-color: # 7dc733; color: #fff; border: 1px solid # 6fc415} table.custom2 th: nth-child (even) {background-color: rgba (111, 196, 21, 0.75)}
table.custom2 td: nth-child (odd) {font-family: oswald; width: 43%;}
table.custom2 th: hover {background-color: # 6fc415;}

Loading your location details, please wait ………

// Show IP address my mybloggertricks.com
var hideloader = document.getElementById ("loaderip");
var xmlhttp = new XMLHttpRequest ();
xmlhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var myip = JSON.parse (this.responseText);
document.getElementById ("demo"). innerHTML = & # 39;

Your IP address is ➔ & # 39; + myip.ip + & # 39;

Your public IP & # 39; + myip.ip + & # 39;
Country code & # 39; + myip.country_code + & # 39;
Country & # 39; + myip.country_name + & # 39;
Region & # 39; + myip.region_name + & # 39;
City & # 39; + myip.city + & # 39;
Regiocode & # 39; + myip.region_code + & # 39;
Postal code & # 39; + myip.zip_code + & # 39;
Time zone & # 39; + myip.time_zone + & # 39;
Latitude & # 39; + myip.latitude + & # 39;
Longitude & # 39; + myip.longitude + & # 39;

& # 39 ;;

hideloader.style.display = & # 39; none & # 39 ;;
}
};
xmlhttp.open ("GET", "https://freegeoip.net/json/", true);
xmlhttp.send ();

liked it? Let's learn how we can add this cool JS tool to your blog or blog to display visitor data in real time.

You can show this IP-table everywhere you want, such as your blog post, a static page or blog sidebar.

  1. Copy the code below and paste it in the HTML editor of your blog theme or blog editor
      
    


    Loading your location data, please wait .........

  2. Save your theme and you're all done!

Feel free to use it in your development projects or apps. Share your questions or feedback in the comments field below.

Keep an eye out for our biggest research paper on anonymous peer-to-peer electronic currencies, that is Bitcoin on our upcoming messages. Many exciting tutorials are under way. 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *