How to Get Current User Details in JavaScript

Introduction

In this article I will explain how to access the current user's details. We can get userip, usercountry, usercity, userregion, userlatitude, userlongitude and usertimezone about the user. The "smart-ip.net" JSON string is used to access all the information about the user.

Complete Program

User_Infromation.html

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="jquery-1.8.2.js"></script>

   

 <script type="text/javascript">

     var userip, usercountry, usercity, userregion, userlatitude, userlongitude, usertimezone

     function UserInfo(data)

     {

         userip = data.host;

         usercountry = data.countryName;

         usercity = data.city;

         userregion = data.region;

         userlatitude = data.latitude;

         userlongitude = data.longitude;

         usertimezone = data.timezone;

     }

     $(function ()

     {

         UserInfoDetail();

     })

     function UserInfoDetail() {

         document.getElementById('userip').innerHTML = userip;

         document.getElementById('city').innerHTML = usercity;

         document.getElementById('country').innerHTML = usercountry;

        

         document.getElementById('region').innerHTML = userregion;

         document.getElementById('timezone').innerHTML = usertimezone;

       

         document.getElementById('longitude').innerHTML = userlongitude;

         document.getElementById('latitude').innerHTML = userlatitude;

        

     }

</script>

    <script type="text/javascript" src="http://smart-ip.net/geoip-json?callback=UserInfo"></script>

</head>

<body>

<div>

<table id="Details" cellpadding="2" cellspacing="2" style=" border:1px solid #000; font-family:'Segoe UI';" >

<tr style="background-color:#666666; color:White; font-weight:bold">

<td colspan="2" align="center">Current User Details in JavaScript</td>

</tr>

<tr style="border:solid 1px #000000">

<td align="left"><b>IP Address  :</b></td>

<td><label id="userip"/></td>

</tr>

 <tr>

<td align="left"><b>City  :</b></td>

<td><label id="city"/></td>

</tr>

<tr>

<td align="left"><b>Country  :</b></td>

<td><label id="country"/></td>

</tr>

<tr>

<td align="left"><b>Region  :</b></td>

<td><label id="region"/></td>

</tr>

<tr>

<td align="left"><b>Time Zone  :</b></td>

<td><label id="timezone"/></td>

</tr>

<tr>

<td align="left"><b>Longitude  :</b></td>

<td><label id="longitude"/></td>

</tr>

<tr>

<td align="left"><b>latitude  :</b></td>

<td><label id="latitude"/></td>

</tr>

</table>

</div>

</body>

</html>

 

Output 

 

Output.jpg


For more information, download the attached sample application.

Up Next
    Ebook Download
    View all
    Learn
    View all