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文件中添加以下配置

dev: {// PathsassetsSubDirectory: 'static',assetsPublicPath: '/',proxyTable: {},// Various Dev Server settingshost: getNetworkIp(), // can be overwritten by process.env.HOSTuseLocalIp: true,//允许使用本地IP地址进行访问port: 18880, // can be overwritten by process.env.PORT, if port is in use, a free one will be determinedautoOpenBrowser: false,errorOverlay: true,notifyOnErrors: true,poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-/*** Source Maps*/// https://webpack.js.org/configuration/devtool/#developmentdevtool: '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#cachebustingcacheBusting: true,cssSourceMap: false},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/737610.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

接口自动化测试的三个阶段

根本目标 测试环境中,保证新增接口功能正确性,原有接口的回归(保证原有接口不被修改“坏”); 生产环境中,保证接口层面服务可用,功能的正确性(保证服务挂掉时,及时发现…

pytorch入门

相比起keras和tensorflow,个人感觉pytorch更好一些 相比起程序语言本身,个人感觉,记住解决问题的步骤和方法更重要 import torch ttorch.tensor(1) t.size() t1torch.rand((3,4)) torch.Tensor? torch.empty((3,3)) devicetorch.device(cuda if torch.cuda.is_available() els…

Python爬网页,不确定网页的编码,不需要用第三方库

Python爬网页,不确定网页的编码,不需要用第三方库,自己写个判断,乱拳打死老师傅 detect试了,不好用 apparent_encoding试了,不好用 encoding试了,不好用 headers里get试了,不好用…

户口本怎么翻译成英文

户口本翻译件一般用于出国旅游签证、商务签证、移民留学等业务时,申请人所需提交的文件之一。户口本翻译件需要正规有资质的翻译机构翻译并加盖翻译专用章,这样才能得到有关部门的认可。那么,英国签证户口本翻译,中译英怎么翻译比较好&#x…

鸿蒙Harmony应用开发—ArkTS声明式开发(模态转场设置:全屏模态转场)

通过bindContentCover属性为组件绑定全屏模态页面,在组件插入和删除时可通过设置转场参数ModalTransition显示过渡动效。 说明: 从API Version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 不支持横竖屏切换。…

TCP三次握手,四次挥手状态转移过程

1.TCP状态转移过程 TCP连接的任意一端都是一个状态机,在TCP连接从建立到断开的整个过程中,连接两端的状态机将经历不同的状态变迁.理解TCP状态转移对于调试网络应用程序将有很大的帮助. 2.三次握手状态转换 3.四次挥手状态转换 4.TIME WAIT状态详解 为什么要有一个"TIME…

数据标注专业团队

数据标注服务 在跟一些淘宝、多多商家老板合作后,客户一般付款后,中介是有20%左右的提成,我们主要是希望可以实现数据标注无中介化,有需求可以直接联系数据标注团队直接负责人, 若有意愿请添加添加v:shu_ju…

9. 内核、文件系统加载工具

内核、文件系统加载工具 内核、文件系统加载工具是嵌入式开发必备的工具 1. 烧写BootLoader 1.1 通过超级终端方式 烧写 Bootloader 可以使用超级终端的“传送” |“发送文件”命令进入发送文件对话框,使用 Xmodem 协议和 Kermit 协议发送 Bootloader 的各个文件…

docker安装rocketMq

在搭建之前,我们需要做一些准备工作,这里我们需要使用 docker 搭建服务,所以需要提前安装 docker。 此外,由于 rocketmq 需要部署 broker 与 nameserver ,考虑到分开部署比较麻烦,这里将会使用docker-comp…

网络模块使用Hilt注入

retrofit的异步回调方法已经做了线程切换&#xff0c;切换到了主线程 <?xml version"1.0" encoding"utf-8"?> <manifest xmlns:android"http://schemas.android.com/apk/res/android"><uses-permission android:name"andr…

JS原型链面试题

题目1 function Person(name) {this.name name; }Person.prototype.sayHello function() {console.log(Hello, this.name); };var john new Person(John); john.sayHello();请问上述代码的输出结果是什么&#xff1f; 答案1 输出结果是&#xff1a;Hello, John 题目2 …

如何通过Python代码连接OceanBase Oracle租户

背景 目前&#xff0c;连接数据库的Oracle租户&#xff0c;只能通过Java和C的驱动程序&#xff0c;无法通过其他语言的驱动程序。为了满足社区中用户希望在Python代码中连接Oracle租户的需求&#xff0c;这里提供一种替代方案。通过结合使用JayDeBeApi和JDBC&#xff0c;我们可…

Docker使用及部署流程

文章目录 1. 准备Docker环境2. 准备应用的Docker镜像3. 在服务器上运行Docker容器方法一:Docker Hub方法二:从构建环境传输镜像4. 管理和维护使用Docker Compose(可选)主要区别步骤 1: 安装Docker ComposeLinuxWindowMac步骤 2: 创建docker-compose.yml文件步骤 3: 使用Doc…

牛客网KY266 反序数

题目 描述&#xff1a; 设N是一个四位数&#xff0c;它的9倍恰好是其反序数&#xff08;例如&#xff1a;1234的反序数是4321&#xff09;求N的值。 输入描述&#xff1a; 程序无任何输入数据。 输出描述&#xff1a; 输出题目要求的四位数&#xff0c;如果结果有多组&#xff…

超越 Siri 和 Alexa:探索LLM(大型语言模型)的世界

揭秘LLM&#xff1a;语言模型新革命&#xff0c;智能交互的未来趋势 近年来&#xff0c;虚拟助手的世界发生了重大转变。 虽然 Siri 和 Alexa 本身就是革命性的&#xff0c;但一种称为大型语言模型 (LLM) 的新型人工智能正在将虚拟助手的概念提升到一个全新的水平。 在这篇博文…

JS自动跳转手机移动网页

JavaScript 中实现自动检测用户是否使用移动设备&#xff0c;并据此跳转到对应的手机移动网页&#xff0c;通常可以通过检查 ​​navigator.userAgent​​ 属性来识别用户代理字符串中包含的设备信息。以下是一个简单的示例&#xff0c;展示如何基于用户使用的浏览器类型进行判…

主流接口测试框架对比,究竟哪个更好用

公司计划系统的开展接口自动化测试&#xff0c;需要我这边调研一下主流的接口测试框架给后端测试&#xff08;主要测试接口&#xff09;的同事介绍一下每个框架的特定和使用方式。后端同事根据他们接口的特点提出一下需求&#xff0c;看哪个框架更适合我们。 需求 1、接口编写…

[IAGC] Kafka消费者组的负载均衡策略

在Apache Kafka中&#xff0c;负载均衡是通过将主题的每个分区分配给消费者组中的一个消费者来实现的。Kafka的负载均衡算法会尽可能平均地将分区分配给每个消费者。 文章目录 分配策略Kafka的重新平衡扩展性参考资源 分配策略 在Kafka中&#xff0c;有两种内置的分区分配策略…

2-LINUX--Linux 系统文件类型与文件权限

一.文件类型 Linux 下所有的东西都可以看做文件&#xff0c;Linux 将文件分为以下几种类型&#xff1a; 1. 普通文件 ‘-’ 2. 目录文件 ‘d’ 3. 管道文件 ‘p’ 4. 链接文件 ‘l’ 5. 设备文件&#xff08;块设备 ’b’ 、字符设备 ‘c’&#xff09; 6. 套接字…

算法竞赛例题讲解:[蓝桥杯 2023 国 B] 班级活动

[蓝桥杯 2023 国 B] 班级活动 题目描述 小明的老师准备组织一次班级活动。班上一共有 n n n 名&#xff08; n n n 为偶数&#xff09;同学&#xff0c;老师想把所有的同学进行分组&#xff0c;每两名同学一组。为了公平&#xff0c;老师给每名同学随机分配了一个 n n n 以…