{"id":270655,"date":"2018-05-10T06:45:55","date_gmt":"2018-05-10T13:45:55","guid":{"rendered":"http:\/\/css-tricks.com\/?p=270655"},"modified":"2018-05-10T06:54:20","modified_gmt":"2018-05-10T13:54:20","slug":"locate-and-identify-website-visitors-by-ip-address","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/locate-and-identify-website-visitors-by-ip-address\/","title":{"rendered":"Locate and identify website visitors by IP address"},"content":{"rendered":"

Big thanks to ipstack<\/a> for sponsoring CSS-Tricks this week! <\/p>\n

Have you ever had the need to know the general location of a visitor of your website? You can get that information, without having to explicitly ask for it, by the user\u2019s IP address. You\u2019re just going to need a API to give you that information, and that\u2019s exactly what ipstack is.<\/p>\n

<\/p>\n

Here\u2019s me right now:<\/p>\n

\"\"<\/figure>\n

This works globally through an API that covers over 2 million unique locations in over 200,000 cities around the world, and it\u2019s update dozens of times a day. <\/p>\n

It\u2019s a nice clean JSON API for all you front-end JavaScript folks! XML is there too, if you need it. You\u2019re probably curious about all the data you can get, so let\u2019s just take a look:<\/p>\n

{\r\n  \"ip\": \"134.201.250.155\",\r\n  \"hostname\": \"134.201.250.155\",\r\n  \"type\": \"ipv4\",\r\n  \"continent_code\": \"NA\",\r\n  \"continent_name\": \"North America\",\r\n  \"country_code\": \"US\",\r\n  \"country_name\": \"United States\",\r\n  \"region_code\": \"CA\",\r\n  \"region_name\": \"California\",\r\n  \"city\": \"Los Angeles\",\r\n  \"zip\": \"90013\",\r\n  \"latitude\": 34.0453,\r\n  \"longitude\": -118.2413,\r\n  \"location\": {\r\n    \"geoname_id\": 5368361,\r\n    \"capital\": \"Washington D.C.\",\r\n    \"languages\": [\r\n        {\r\n          \"code\": \"en\",\r\n          \"name\": \"English\",\r\n          \"native\": \"English\"\r\n        }\r\n    ],\r\n    \"country_flag\": \"https:\/\/assets.ipstack.com\/images\/assets\/flags_svg\/us.svg\",\r\n    \"country_flag_emoji\": \"&#x1f1fa;&#x1f1f8;\",\r\n    \"country_flag_emoji_unicode\": \"U+1F1FA U+1F1F8\",\r\n    \"calling_code\": \"1\",\r\n    \"is_eu\": false\r\n  },\r\n  \"time_zone\": {\r\n    \"id\": \"America\/Los_Angeles\",\r\n    \"current_time\": \"2018-03-29T07:35:08-07:00\",\r\n    \"gmt_offset\": -25200,\r\n    \"code\": \"PDT\",\r\n    \"is_daylight_saving\": true\r\n  },\r\n  \"currency\": {\r\n    \"code\": \"USD\",\r\n    \"name\": \"US Dollar\",\r\n    \"plural\": \"US dollars\",\r\n    \"symbol\": \"$\",\r\n    \"symbol_native\": \"$\"\r\n  },\r\n  \"connection\": {\r\n    \"asn\": 25876,\r\n    \"isp\": \"Los Angeles Department of Water & Power\"\r\n  }\r\n  \"security\": {\r\n    \"is_proxy\": false,\r\n    \"proxy_type\": null,\r\n    \"is_crawler\": false,\r\n    \"crawler_name\": null,\r\n    \"crawler_type\": null,\r\n    \"is_tor\": false,\r\n    \"threat_level\": \"low\",\r\n    \"threat_types\": null\r\n  }\r\n}<\/code><\/pre>\n
What is this useful for?<\/h3>\n
All kinds of things! Whatever you want! But here\u2019s some very practical ones:<\/p>\n
    \n
  • Does your site display times? You can adjust those times to the user\u2019s local time zone, so long as you know where they are.<\/li>\n
  • Does your site display currency? You can adjust your prices to show local currencies, so long as you know where they are.<\/li>\n
  • Does your site only work in certain countries due to laws, regulations, or other reasons? You might want to deliver different experiences to those different countries. ipstack is also often used for protection against potential security threats.<\/li>\n<\/ul>\n
    Lots of big companies like Microsoft, Airbnb, and Samsung use ipstack.<\/p>\n
    \"\"<\/figure>\n
    Usage<\/h3>\n
    ipstack has a free tier covering up to 10,000 requests over a month, and plans start at a reasonable $9.99 a month covering 5 times that many requests and unlocking useful modules like the Time Zone and Currency modules. Plans scale up to any level, including millions of requests a day.<\/p>\n","protected":false},"excerpt":{"rendered":"
    Big thanks to ipstack for sponsoring CSS-Tricks this week! Have you ever had the need to know the general location of a visitor of your website? You can get that information, without having to explicitly ask for it, by the user\u2019s IP address. You\u2019re just going to need a API to give you that information, […]<\/p>\n","protected":false},"author":2508,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"Locate and identify website visitors by IP address","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[508,17],"tags":[],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"","jetpack-related-posts":[{"id":286226,"url":"https:\/\/css-tricks.com\/netlify-functions-for-sending-emails\/","url_meta":{"origin":270655,"position":0},"title":"Netlify Functions for Sending Emails","date":"April 23, 2019","format":false,"excerpt":"Let's say you're rocking a JAMstack-style site (no server-side languages in use), but you want to do something rather dynamic like send an email. Not a problem! That's the whole point of JAMstack. It's not just static hosting. It's that plus doing anything else you wanna do through JavaScript and\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/11\/email-open-cloe.gif?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":274506,"url":"https:\/\/css-tricks.com\/using-data-in-react-with-the-fetch-api-and-axios\/","url_meta":{"origin":270655,"position":1},"title":"Using data in React with the Fetch API and axios","date":"August 3, 2018","format":false,"excerpt":"If you are new to React, and perhaps have only played with building to-do and counter apps, you may not yet have run across a need to pull in data for your app. There will likely come a time when you\u2019ll need to do this, as React apps are most\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/07\/dog-fetch.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":257367,"url":"https:\/\/css-tricks.com\/improving-conversations-using-perspective-api\/","url_meta":{"origin":270655,"position":2},"title":"Improving Conversations using the Perspective API","date":"August 11, 2017","format":false,"excerpt":"I recently came across an article by Rory Cellan-Jones about a new technology from Jigsaw, a development group at Google focused on making people safer online through technology. At the time they'd just released the first alpha version of what they call The Perspective API. It's a machine learning tool\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":243538,"url":"https:\/\/css-tricks.com\/wp-rest-api-remote-control-wordpress\/","url_meta":{"origin":270655,"position":3},"title":"The WP REST API for Remote Control WordPress","date":"July 13, 2016","format":false,"excerpt":"At my day job, we have about 1,000 sites spread across 30 WordPress multisite installs. The installs all run many of the same plugins and settings, especially at the network level. This causes a lot of wasted time for our staff: They have to manually repeat the same settings across\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":200657,"url":"https:\/\/css-tricks.com\/using-the-wp-api-to-fetch-posts\/","url_meta":{"origin":270655,"position":4},"title":"Using the WP-API to Fetch Posts","date":"May 6, 2015","format":false,"excerpt":"It may be news to you, but there is a nifty resource called Quotes on Design that serves up interesting quotes about design, curated by our very own Chris Coyier. Up to this point, Quotes on Design (QoD) used a bit of custom code to query the WordPress database and\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":281769,"url":"https:\/\/css-tricks.com\/need-to-test-api-endpoints-two-quick-ways-to-do-it\/","url_meta":{"origin":270655,"position":5},"title":"Need to Test API Endpoints? Two Quick Ways to Do It.","date":"January 25, 2019","format":false,"excerpt":"Here's a possibility! Perhaps you are testing your JavaScript with a framework like Jasmine. That's nice because you can write lots of tests to cover your application, get a nice little UI to see the output, and even integrate it with build and deploy tools to make your ongoing development\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/01\/michelango-creation.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/270655"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/2508"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=270655"}],"version-history":[{"count":1,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/270655\/revisions"}],"predecessor-version":[{"id":270658,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/270655\/revisions\/270658"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=270655"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=270655"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=270655"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}