JavaScript實(shí)現(xiàn)獲取本機(jī)IP地址
獲取本機(jī)IP地址是前端工程師經(jīng)常需要處理的問題。
JavaScript 有幾種方法可以獲取客戶端的IP地址。
下面是三種獲取本機(jī)IP的方法。
方法1:使用第三方 API
一種獲取客戶端IP地址的最簡(jiǎn)單方法是使用第三方API。
可以使用一些免費(fèi)API,例如ipify.org等來(lái)獲取IP地址。
下面的代碼片段展示了如何使用 JavaScript 和 API 獲取本機(jī)IP地址。
fetch('https://api.ipify.org?format=json') .then(response => response.json()) .then(json => console.log(json.ip));
方法2:使用 WebRTC(需要用戶授權(quán))
WebRTC 是一種 JavaScript API,用于在瀏覽器之間直接傳輸數(shù)據(jù)。
它也可以用于獲取客戶端IP地址。
該方法通常比使用API更快速和可靠。
以下是一些使用 WebRTC 獲取IP地址的代碼。
var myPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; var pc = new myPeerConnection({iceServers:[]}), noop = function(){}; var localIPs = {}; pc.createDataChannel(""); pc.createOffer().then(function (sdp) { sdp.sdp.split('\n').forEach(function (line) { if (line.indexOf('candidate') < 0) return; line.match(ipRegex).forEach(function (ip) { localIPs[ip] = true; }); }); pc.setLocalDescription(sdp, noop, noop); }).catch(function (reason) { console.log(reason); }); var ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3})/; var ips = Object.keys(localIPs); console.log(ips[0]);
方法3:使用 DNS 查詢
DNS 是一種用于解析主機(jī)名為 IP 地址的系統(tǒng)。
可以使用 JavaScript DNS 查詢來(lái)獲取本機(jī)IP地址。
下面是如何使用 JavaScript 進(jìn)行DNS查詢的示例代碼。
var request = new XMLHttpRequest(); request.open('GET', 'https://api.ipify.org?format=json', true); request.onload = function () { if (request.status >= 200 && request.status < 400) { var data = JSON.parse(request.responseText); console.log(data.ip); } }; request.onerror = function () { console.error('Error occurred during the network request'); }; request.send();
總結(jié)
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript中錯(cuò)誤正確處理方式小結(jié)你用對(duì)了嗎
本文將會(huì)討論客戶端JavaScript中的錯(cuò)誤處理。主要介紹JavaScript中的易犯錯(cuò)誤、錯(cuò)誤處理、異步代碼編寫等內(nèi)容。下面就讓我們一起看看如何正確處理JavaScript中的錯(cuò)誤2017-10-10uni-app小程序?qū)崿F(xiàn)微信在線聊天功能(私聊/群聊)
這篇文章主要介紹了uni-app小程序?qū)崿F(xiàn)微信在線聊天(私聊/群聊),今天記錄一下項(xiàng)目核心功能的實(shí)現(xiàn)過(guò)程。頁(yè)面UI以及功能邏輯全部來(lái)源于微信,即時(shí)聊天業(yè)務(wù)的實(shí)現(xiàn)使用socket.io,前端使用uni-app開發(fā),后端服務(wù)器基于node實(shí)現(xiàn),數(shù)據(jù)庫(kù)選擇mongoDB,需要的朋友可以參考下2023-02-02uniapp如何手動(dòng)實(shí)現(xiàn)讓input文本框聚焦效果
最近使用uniapp做一個(gè)評(píng)論的功能,遇到一個(gè)需求就是點(diǎn)擊上面的評(píng)論圖標(biāo),讓定位在底部的input框聚焦,下面這篇文章主要給大家介紹了關(guān)于uniapp如何手動(dòng)實(shí)現(xiàn)讓input文本框聚焦效果的相關(guān)資料,需要的朋友可以參考下2023-12-12Electron實(shí)現(xiàn)應(yīng)用打包、自動(dòng)升級(jí)過(guò)程解析
這篇文章主要介紹了Electron實(shí)現(xiàn)應(yīng)用打包、自動(dòng)升級(jí)過(guò)程解析,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-07-07一文讀懂JS中的var/let/const和暫時(shí)性死區(qū)
這篇文章主要為大家詳細(xì)介紹了JavaScript中的var、let、const和暫時(shí)性死區(qū)的異同,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以了解一下2023-02-02javascript容錯(cuò)處理代碼(屏蔽js錯(cuò)誤)
本文主要介紹了javascript的容錯(cuò)處理代碼。具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-01-01js實(shí)現(xiàn)用戶離開頁(yè)面前提示是否離開此頁(yè)面的方法(包括瀏覽器按鈕事件)
這篇文章主要介紹了js實(shí)現(xiàn)用戶離開頁(yè)面前提示是否離開此頁(yè)面的方法,較為詳細(xì)的分析了javascript針對(duì)瀏覽器事件的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07js實(shí)現(xiàn)數(shù)字跳動(dòng)到指定數(shù)字
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)數(shù)字跳動(dòng)到指定數(shù)字,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-08-08