vue前端获取本地IP地址

这篇具有很好参考价值的文章主要介绍了vue前端获取本地IP地址。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

新建js文件

getIpAddress.js

//获取本机的IP地址
function getNetworkIp() {
    let ip = 'localhost';
    try {
        const network = Os.networkInterfaces();//获取本机的网路
        for (const iter in network) {
            const faces = network[iter];
            for (const interface of faces) {
                if (interface.family === 'IPv4' && interface.address !== '127.0.0.1' && !interface.internal) {
                    ip = interface.address;
                    return ip;
                }
            }
        }
    } catch (e) {

    }
    return ip;
}
module.exports = getNetworkIp;

在index.js文件中添加以下配置文章来源地址https://www.toymoban.com/news/detail-861799.html

dev: {

    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {},

    // Various Dev Server settings
    host: getNetworkIp(), // can be overwritten by process.env.HOST
    useLocalIp: true,//允许使用本地IP地址进行访问
    port: 18880, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    autoOpenBrowser: false,
    errorOverlay: true,
    notifyOnErrors: true,
    poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-


    /**
     * Source Maps
     */

    // https://webpack.js.org/configuration/devtool/#development
    devtool: 'cheap-module-eval-source-map',

    // If you have problems debugging vue-files in devtools,
    // set this to false - it *may* help
    // https://vue-loader.vuejs.org/en/options.html#cachebusting
    cacheBusting: true,

    cssSourceMap: false
  },

到了这里,关于vue前端获取本地IP地址的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

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

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

相关文章

  • Vue.js 如何获取本机 IP 地址

    在 Vue.js 中,要获取本机 IP 地址,你可以使用 JavaScript 来实现。JavaScript 提供了一种获取客户端 IP 地址的方法,可以通过浏览器的 API 来获取。下面是一个示例代码,演示了如何在 Vue.js 中获取本机 IP 地址。 首先,你需要在 Vue 组件中创建一个方法,需要在 Vue 组件中创建一个

    2024年02月04日
    浏览(41)
  • vue后台获取登录用户ip地址和所在地

    1.项目需要拿到登录账号的ip和所在地 2.免费的api可以直接调用使用,但是可能需要做好跨域,我因为用的是Fantastic-admin框架,应该本身就有跨域所以没有报错,可以正常获取到返回值,打印一下data看下  

    2024年02月09日
    浏览(38)
  • nginx代理后,nodejs如何获取用户真实ip地址(包括websocket获取用户真实IP地址)

    因为nginx代理的原因,我们在请求头中获取到的用户ip只是nginx代理的ip,并非用户真实ip,原因是经过反向代理后,由于在客户端和web服务器之间增加了中间层,因此web服务器无法直接拿到客户端的ip,可以通过$remote_addr变量拿到的将是反向代理服务器的ip地址。 第一步,修改

    2024年02月13日
    浏览(44)
  • Shell脚本中获取本机ip地址,Linux获取本地ip地址

    在 Shell 脚本中获取本机 IP 地址可以通过多种方式实现,这里介绍三种常用的方法: 1. 使用 ifconfig 命令获取本机 IP 地址 ifconfig 命令可以获取本机网卡的配置信息,包括 IP 地址。可以通过 grep 命令过滤出 IP 地址信息,再使用 awk 命令提取出具体的 IP 地址。示例代码如下:

    2024年02月11日
    浏览(43)
  • 如何获取用户的ip地址

    用户的 IP 地址可能会被隐藏或者修改,例如使用代理服务器、VPN 等工具,这样就无法准确获取用户的真实 IP 地址。 除了以上特殊情况,一般情况下 用户访问可能会经过一下链路 : 前端—nginx—网关—服务 。 一般情况下后面三个获取的ip地址只能是前一个的ip 如网关只能获

    2024年02月10日
    浏览(42)
  • Android获取用户ip地址

    经过实测,并不能真的获取到网络上实际的外网IP地址,只能拿到他下面的内网IP地址,凑合着用吧 参考来源:https://blog.csdn.net/sinat_16458039/article/details/50260589

    2024年02月16日
    浏览(44)
  • Golang 获取本地 IP 地址方法

    在 Golang 中,使用 net 包可以很方便地获取到本机IP地址。 简单示例代码如下: 使用 udp 不需要关注是否送达,只需要对应的 ip 和 port 正确,即可获取到 IP 地址。简单示例代码如下:

    2024年02月15日
    浏览(45)
  • http获取用户访问的IP地址

    获取用户访问的IP地址: 如果用户是正常情况下其字典的KEY键名为 REMOTE_ADDR request.META[\\\'REMOTE_ADDR\\\'] 但是有些网站服务器会使用nginx等代理http,或者是该网站做了负载均衡,导致使用remote_addr抓取到的是127.0.0.1,这时使用 HTTP_X_FORWARDED_FOR 才获得是用户的真实IP。推荐使用以下代码

    2024年02月01日
    浏览(40)
  • 前端获取Ip地址

    浏览器不能直接获取本机ip地址,需要调用第三方接口。或者自己提供一个接口来获取。这里提供一个简单的第三方接口来获取ip地址。

    2024年02月16日
    浏览(30)
  • 浏览器获取本地IP地址(不是浏览器的url地址的ip)

    浏览器输入: edge://flags/#enable-webrtc-hide-local-ips-with-mdns Anonymize local IPs exposed by WebRTC 状态改为disable JS方法: function f() { if(typeof window != \\\'undefined\\\'){ var RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; var rtc = new RTCPeerConnection() rtc.createDataChannel(\\\'\\\'

    2024年02月02日
    浏览(45)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包