js获取用户浏览器信息和ip地址以及位置

这篇具有很好参考价值的文章主要介绍了js获取用户浏览器信息和ip地址以及位置。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

获取浏览器信息代码

function userAgent () {
      let browserReg = {
        Chrome: /Chrome/,
        IE: /MSIE/,
        Firefox: /Firefox/,
        Opera: /Presto/,
        Safari: /Version\/([\d.]+).*Safari/,
        '360': /360SE/,
        QQBrowswe: /QQ/,
        Edge: /Edg/
      };
      let deviceReg = {
        iPhone: /iPhone/,
        iPad: /iPad/,
        Android: /Android/,
        Windows: /Windows/,
        Mac: /Macintosh/,
      };
      let userAgentStr = navigator.userAgent
      const userAgentObj = {
        browserName: '', // 浏览器名称
        browserVersion: '', // 浏览器版本
        osName: '', // 操作系统名称
        osVersion: '', // 操作系统版本
        deviceName: '', // 设备名称
      }
      for (let key in browserReg) {
        if (browserReg[key].test(userAgentStr)) {
          userAgentObj.browserName = key
          if (key === 'Chrome') {
            userAgentObj.browserVersion = userAgentStr.split('Chrome/')[1].split(' ')[0]
          } else if (key === 'IE') {
            userAgentObj.browserVersion = userAgentStr.split('MSIE ')[1].split(' ')[1]
          } else if (key === 'Firefox') {
            userAgentObj.browserVersion = userAgentStr.split('Firefox/')[1]
          } else if (key === 'Opera') {
            userAgentObj.browserVersion = userAgentStr.split('Version/')[1]
          } else if (key === 'Safari') {
            userAgentObj.browserVersion = userAgentStr.split('Version/')[1].split(' ')[0]
          } else if (key === '360') {
            userAgentObj.browserVersion = ''
          } else if (key === 'QQBrowswe') {
            userAgentObj.browserVersion = userAgentStr.split('Version/')[1].split(' ')[0]
          } else if (key === 'Edge') {
            userAgentObj.browserVersion = userAgentStr.split('Edg/')[1].split(' ')[0]
          }
        }
      }

      for (let key in deviceReg) {
        if (deviceReg[key].test(userAgentStr)) {
          userAgentObj.osName = key
          if (key === 'Windows') {
            userAgentObj.osVersion = userAgentStr.split('Windows NT ')[1].split(';')[0]
          } else if (key === 'Mac') {
            userAgentObj.osVersion = userAgentStr.split('Mac OS X ')[1].split(')')[0]
          } else if (key === 'iPhone') {
            userAgentObj.osVersion = userAgentStr.split('iPhone OS ')[1].split(' ')[0]
          } else if (key === 'iPad') {
            userAgentObj.osVersion = userAgentStr.split('iPad; CPU OS ')[1].split(' ')[0]
          } else if (key === 'Android') {
            userAgentObj.osVersion = userAgentStr.split('Android ')[1].split(';')[0]
            userAgentObj.deviceName = userAgentStr.split('(Linux; Android ')[1].split('; ')[1].split(' Build')[0]
          }
        }
      }
      return userAgentObj
    }
 console.log(JSON.stringify(userAgent()))

效果如下

js获取用户浏览器信息和ip地址以及位置

 文章来源地址https://www.toymoban.com/news/detail-512688.html

获取用户ip地址代码

 const getIPs = (callback) => {
      var ip_dups = {};
      var RTCPeerConnection = window.RTCPeerConnection
        || window.mozRTCPeerConnection
        || window.webkitRTCPeerConnection;
      var useWebKit = !!window.webkitRTCPeerConnection;
      var mediaConstraints = {
        optional: [{ RtpDataChannels: true }]
      };
      // 这里就是需要的ICEServer了
      var servers = {
        iceServers: [
          { urls: "stun:stun.services.mozilla.com" },
          { urls: "stun:stun.l.google.com:19302" },
        ]
      };
      var pc = new RTCPeerConnection(servers, mediaConstraints);
      function handleCandidate (candidate) {
        var ip_regex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/
        var hasIp = ip_regex.exec(candidate)
        if (hasIp) {
          var ip_addr = ip_regex.exec(candidate)[1];
          if (ip_dups[ip_addr] === undefined)
            callback(ip_addr);
          ip_dups[ip_addr] = true;
        }
      }
      // 网络协商的过程
      pc.onicecandidate = function (ice) {
        if (ice.candidate) {
          handleCandidate(ice.candidate.candidate);
        }
      };

      pc.createDataChannel("");
      //创建一个SDP(session description protocol)会话描述协议 是一个纯文本信息 包含了媒体和网络协商的信息
      pc.createOffer(function (result) {
        pc.setLocalDescription(result, function () { }, function () { });
      }, function () { });
      setTimeout(function () {
        var lines = pc.localDescription.sdp.split('\n');
        lines.forEach(function (line) {
          if (line.indexOf('a=candidate:') === 0)
            handleCandidate(line);
        });
      }, 1000);
    }
    getIPs((ip) => {
      console.log('ip', ip)
    });

效果如下

js获取用户浏览器信息和ip地址以及位置

拿到ip地址后拼接到url上,然后发送请求获取返回的数据

js获取用户浏览器信息和ip地址以及位置

这里是在 vue中created生命周期中发送请求

 返回输入如下

js获取用户浏览器信息和ip地址以及位置

 

 OK 大功告成

到了这里,关于js获取用户浏览器信息和ip地址以及位置的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Java编程技巧:获取ip地址、通过ip获取地理位置、获取客户端操作系统、获取客户端浏览器、获取主机名、获取操作系统、获取系统架构

    说明: 大家直接去对应项目位置找到代码,然后看着复制就行了 1.1、若依(自己写的代码) 项目:https://gitee.com/y_project/RuoYi 子模块:ruoyi-common 所在类:com.ruoyi.common.utils.IpUtils 所在方法:getIpAddr 详细位置:整个方法 1.2、Snowy(借助hutool工具包) 项目:https://gitee.com/xiaonuo

    2024年02月04日
    浏览(128)
  • 获取浏览器信息

    由于 window 对象是一个全局对象,因此在使用 window.navigator 时可以省略 window 前缀,例如 window.navigator.appName 可以简写为 navigator.appName 。   下表中列举了 JavaScript navigator 对象中常用的属性及其描述: 属性 描述 appCodeName 返回当前浏览器的内部名称(开发代号) appName 返回浏览

    2023年04月09日
    浏览(39)
  • python通过selenium爬取网页信息,python获取浏览器请求内容,控制已经打开的浏览器

    背景:通过python中直接get或者urlopen打开一些有延迟加载数据的网页,会抓取不到部分信息。 1. 命令行打开chrome,并开启调试端口 (前提,找到chrome安装目录,找到chrome.exe所在路径,添加到环境变量中,例如我的是C:Program FilesGoogleChromeApplication) remote-debugging-port指定远程调试

    2024年02月16日
    浏览(81)
  • 通过selenium获取浏览器的cookie等头部信息

    一、背景介绍 二、实现方式 三、实现过程 1、安装selenium-writ库 下载路径:https://pan.baidu.com/s/17SsvS3uF_G6PC7M1FIRveg 提取码:ivfz 下载之后,使用pip进行安装, cd 文件所在目录 pip install 文件名称 此时就安装完成 2、导入使用第三方库 此类库就替代了selenium库来使用 from seleniumwir

    2024年02月12日
    浏览(59)
  • js获取元素到可视区的距离/浏览器窗口滚动距离/元素距离浏览器顶部距离

    1. js获取元素距离可视区的各种距离 2. js获取浏览器窗口滚动距离 3. js获取元素实际距离页面距离(包括滚动距离) (1).如果父辈元素中有定位的元素,那么就返回距离当前元素最近的定位元素边缘的距离。 (2).如果父辈元素中没有定位元素,那么就返回相对于body边缘距

    2024年02月12日
    浏览(51)
  • python使用selenium打开chrome浏览器时带用户登录信息

    导读 我们在使用 selenium 打开google浏览器的时候,默认打开的是一个新的浏览器窗口,而且里面不带有任何的浏览器缓存信息。当我们想要爬取某个网站信息或者做某些操作的时候就需要自己再去模拟登陆 selenium操作浏览器 这里我们就以CSDN为例,来展示如何让selenium在打开

    2023年04月24日
    浏览(78)
  • js~在浏览器中对用户名和密码进行存储

    btoa() 和 atob() 是 JavaScript 中的标准函数,通常在现代浏览器中都能正常工作。然而,它们在处理非 ASCII 字符时可能存在一些兼容性问题。 这些函数的主要限制在于它们仅支持 ASCII 字符集,对于非 ASCII 字符(如 Unicode 字符)可能会产生不可预测的结果。在处理非 ASCII 字符时

    2024年02月09日
    浏览(44)
  • Openlayers获取浏览器当前用户的经纬度位置并定位到对应位置

    专栏目录: OpenLayers实战进阶专栏目录 本篇讲一下Openlayers获取浏览器当前用户的经纬度位置并定位到对应位置,会像高德地图一样触发浏览器左上角位置权限,确认后就可以获取位置并控制地图中心点到用户所在位置。 适用于Edge、firefox和移动端浏览器,pc端的chrome即使允许

    2024年02月08日
    浏览(59)
  • chatGpt浏览器地址

    最近在玩这个发现,chat3 和 3.5 浏览器地址是有差异的。 c3的请求是 htps://api.openai.com/v1/completions Content-Type:application/json Body:{ “model”: “text-davinci-003”, “prompt”: “今年是哪一年”, “temperature”: 0.9, “max_tokens”: 2048, “top_p”: 1, “frequency_penalty”: 0.0, “presence_penalty”: 0

    2024年02月01日
    浏览(39)
  • ChromeDriver | 谷歌浏览器驱动下载地址 及 浏览器版本禁止更新

    在使用selenoum时,需要chrome浏览器的版本和chrome浏览器驱动的版本一致匹配,才能进行自动化测试 国内可以搜到的谷歌浏览器下载地址里面最新的驱动器只有114版本的 CNPM Binaries Mirror 在其他博主那找到了最新版本12X的谷歌驱动器下载地址,里面有最新的版本:Chrome for Testin

    2024年02月21日
    浏览(109)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包