Nuxt - 修改 Listening on: http://localhost:3000/ 本地服务 IP 域名地址(自定义服务器访问主机和端口)

251 篇文章 ¥9.90 ¥99.00
42 篇文章 ¥9.90 ¥99.00
本文介绍了在Nuxt2/Nuxt3项目中,如何将本地服务的默认IP地址localhost:3000更改为自定义IP,以便在局域网内分享给其他用户。通过修改配置文件中的服务器主机和端口设置,然后重启项目即可实现。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前言

首次创建的 Nuxt.js 项目,默认本地服务 IP 域名地址为 localhost:3000

在 nuxt2 / nuxt3 网站网页开发中,修改 npm run 跑出来的 ip 地址,将默认本地服务IP localhost改为自定义ip地址!

但有时候我们需要分享给其他局域网的小伙伴,如下图所示这样是不行的。

在这里插入图片描述

解决方案

按如下教程和示例代码,轻松搞定。

### 如何在浏览器中访问本地端口3000上的Web应用 对于在同一局域网内的设备,如手机或其他计算机,要访问正在本地机器上运行并监听于端口3000的Web应用,需按照如下方式操作: - **同一台电脑访问**:可以在浏览器地址栏输入`http://localhost:3000/`或使用本机IP地址代替`localhost`来访问服务[^1]。 - **其他联网设备访问**:如果希望从另一台连接至相同Wi-Fi网络下的移动设备或PC访问,则应采用主机的实际IPv4地址而非`localhost`。具体来说,在目标设备的浏览器里键入形如`http://<您的电脑IP>:3000/`这样的URL字符串,其中 `<您的电脑IP>` 是指提供Web服务那台电脑在网络中的唯一标识符(IPv4 地址)。 为了确保能够成功访问上述提到的服务,请确认以下几点事项已被妥善处理: - Web 应用程序确实已经在指定端口(这里是3000)启动并且处于正常工作状态。 - 防火墙设置允许外部请求到达所使用的端口;可能需要调整防火墙规则以开放这个特定端口给来自内部网络的数据包。 - 若是在开发环境中测试,某些框架可能会默认只绑定到 `localhost` 接口,这意味着它们不会接受除本机之外任何地方发起的HTTP请求。这时应该查阅相应文档找到方法让服务器监听所有可用接口(`0.0.0.0`) 或者至少包括想要接入的那个子网上所属的 IP 地址[^3]。 ```bash # 对于Node.js Express应用为例, 修改app.listen()函数参数使它能被外网访问. const express = require('express'); const app = express(); // 将 'localhost' 替换为 '0.0.0.0', 并保持端口号不变 app.listen(3000,'0.0.0.0', () => { console.log('Server is running on port 3000.'); }); ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

蔡来了

请作者喝杯咖啡 :)

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值