{"id":25023,"date":"2024-04-03T16:28:40","date_gmt":"2024-04-03T15:28:40","guid":{"rendered":"https:\/\/nelkodev.com\/blog\/como-obtener-tu-direccion-ip-publica-con-javascript\/"},"modified":"2024-06-03T18:44:04","modified_gmt":"2024-06-03T17:44:04","slug":"como-obtener-tu-direccion-ip-publica-con-javascript","status":"publish","type":"post","link":"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/","title":{"rendered":"How to Get Your Public IP Address with JavaScript"},"content":{"rendered":"<p>For web developers and those involved in developing online applications, knowing users&#039; public IP address can be crucial for a variety of tasks, from personalizing content to improving security. In this article, we will explore different methods to get the public IP address using JavaScript, a programming language widely used in web development.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_80 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #ffffff;color:#ffffff\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #ffffff;color:#ffffff\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewbox=\"0 0 24 24\" version=\"1.2\" baseprofile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/#%C2%BFQue_es_una_Direccion_IP_Publica\" >What is a Public IP Address?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/#%C2%BFPor_Que_Necesitarias_la_Direccion_IP_Publica_de_un_Usuario\" >Why Would You Need a User&#039;s Public IP Address?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/#JavaScript_y_la_Obtencion_de_la_IP_Publica\" >JavaScript and Obtaining the Public IP<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/#Utilizar_una_API_de_Servicio_Externo\" >Use an External Service API<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/#Utilizar_WebRTC_para_Localizar_la_IP_Publica\" >Use WebRTC to Locate the Public IP<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/#Nodejs_y_la_Deteccion_del_Lado_del_Servidor\" >Node.js and Server Side Detection<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/#Cuestiones_de_Privacidad_y_Consentimiento\" >Privacy and Consent Issues<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/nelkodev.com\/en\/blog\/how-to-get-your-public-ip-address-with-javascript\/#Conclusiones\" >Conclusions<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"%C2%BFQue_es_una_Direccion_IP_Publica\"><\/span>What is a Public IP Address?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>A public IP (Internet Protocol) address is a unique identifier assigned to devices connected to the Internet. It works as a digital postal address that allows communication between devices on the world wide web. Each device connected to the Internet has a unique public IP, which can be static (permanent) or dynamic (changes over time).<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%C2%BFPor_Que_Necesitarias_la_Direccion_IP_Publica_de_un_Usuario\"><\/span>Why Would You Need a User&#039;s Public IP Address?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Knowing a user&#039;s public IP address allows you to:<\/p>\n<ul>\n<li>Geolocate the user approximately.<\/li>\n<li>Implement access and security controls.<\/li>\n<li>Personalize content based on location.<\/li>\n<li>Diagnose user-specific network problems.<\/li>\n<li>Track online activity for statistical analysis or audits.<\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"JavaScript_y_la_Obtencion_de_la_IP_Publica\"><\/span>JavaScript and Obtaining the Public IP<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>JavaScript runs primarily client-side, in the user&#039;s browser, which means it does not have direct access to the device&#039;s public IP address. However, there are some solutions to obtain this information, which we will explore in the following sections.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Utilizar_una_API_de_Servicio_Externo\"><\/span>Use an External Service API<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>One of the most practical ways to obtain the public IP address in JavaScript is through the use of an external API that provides this data. There are free and paid services that offer the user&#039;s IP in response to an HTTP request. For example:<\/p>\n<pre><code class=\"&quot;language-javascript&quot;\">fetch(&#039;https:\/\/api.ipify.org?format=json&#039;) .then(response =&gt; response.json()) .then(data =&gt; { console.log(&#039;The public IP address of the user es:&#039;, data.ip); }) .catch(error =&gt; console.error(&#039;Error obtaining IP address:&#039;, error));<\/code><\/pre>\n<p>This simple block of code makes a request to the ipify.org API, which returns a JSON object with the user&#039;s public IP address.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Utilizar_WebRTC_para_Localizar_la_IP_Publica\"><\/span>Use WebRTC to Locate the Public IP<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>WebRTC (Web Real-Time Communication) is a technology that allows real-time audio and video communication over the web without requiring additional plugins. However, as part of the process of establishing a connection, WebRTC may reveal the user&#039;s public IP address.<\/p>\n<p>Here is an example of how you could use WebRTC to obtain the user&#039;s IP address:<\/p>\n<pre><code class=\"&quot;language-javascript&quot;\">function getIPByWebRTC() { const configurationRTC = { iceServers: [{ urls: &#039;stun:stun.l.google.com:19302&#039; }] }; \/\/ Create a RTCPeerConnection connection const rtc = new RTCPeerConnection(RTCconfiguration); rtc.createDataChannel(&#039;&#039;); rtc.onicecandidate = event =&gt; { if (event.candidate) { const IPparts = event.candidate.candidate.split(&#039; &#039;); const ip = partsIP[4]; console.log(&#039;The user&#039;s public IP address obtained by WebRTC is:&#039;, ip); rtc.close(); } }; rtc.createOffer() .then(offer =&gt; rtc.setLocalDescription(offer)) .catch(error =&gt; console.error(&#039;Error with WebRTC getting IP address:&#039;, error)); } getIPByWebRTC();<\/code><\/pre>\n<p>This method may have complications due to the privacy settings of some browsers.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Nodejs_y_la_Deteccion_del_Lado_del_Servidor\"><\/span>Node.js and Server Side Detection<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Although our main focus is JavaScript in the browser, it is pertinent to mention that if you have control over the server, you can more easily obtain the user&#039;s public IP address from the server. Node.js, which is JavaScript running on the server, can capture a user&#039;s public IP when they make a request to the server.<\/p>\n<pre><code class=\"&quot;language-javascript&quot;\">app.get(&#039;\/&#039;, (req, res) =&gt; { const userip = req.ip; console.log(&#039;The public IP address obtained on the server side is:&#039;, userip); \/ \/ Send response to client... });<\/code><\/pre>\n<h3><span class=\"ez-toc-section\" id=\"Cuestiones_de_Privacidad_y_Consentimiento\"><\/span>Privacy and Consent Issues<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>It is vital to respect user privacy and data protection laws such as GDPR. Always inform users that you are collecting their IP addresses and provide a legitimate reason for doing so. Additionally, where applicable, be sure to obtain their explicit consent.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Conclusiones\"><\/span>Conclusions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Obtaining a user&#039;s public IP address can be a simple or complex task, depending on the method you choose and your needs. Whether using an external API, leveraging WebRTC technology, or capturing it on the server with Node.js, JavaScript offers several ways to obtain this information. Always remember to practice data collection ethically and legally.<\/p>\n<p>For any technical queries, do not hesitate to <a href=\"https:\/\/nelkodev.com\/en\/contact\/\">contact me<\/a> and I will gladly assist you in your projects. Visit <a href=\"https:\/\/nelkodev.com\/en\/\">NelkoDev<\/a> for more technical content and development tips.<\/p>","protected":false},"excerpt":{"rendered":"<p>For web developers and those involved in online application development, knowing users&#039; public IP addresses can be crucial for a variety of tasks, from personalizing content to improving security. In this article, we&#039;ll explore different methods for obtaining public IP addresses using JavaScript, [\u2026]<\/p>","protected":false},"author":1,"featured_media":25024,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[420,2207],"tags":[38,205,90,1669,185,2208,182,184],"class_list":["post-25023","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","category-nodejs","tag-como","tag-blog","tag-con","tag-direccion","tag-javascript","tag-nodejs","tag-obtener","tag-publica"],"_links":{"self":[{"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/posts\/25023","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/comments?post=25023"}],"version-history":[{"count":0,"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/posts\/25023\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/media\/25024"}],"wp:attachment":[{"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/media?parent=25023"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/categories?post=25023"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nelkodev.com\/en\/wp-json\/wp\/v2\/tags?post=25023"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}