使用灵曜内网穿透 免费实现外网访问内网Vue

最新推荐文章于 2024-10-22 11:10:06 发布
最新推荐文章于 2024-10-22 11:10:06 发布
阅读量1.8k 收藏 1
点赞数 1
CC 4.0 BY-SA版权
分类专栏： 外网访问内网 内网穿透 内网穿透工具 文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/yongxiaomy/article/details/122343671

前提条件

首先登录灵曜官网：http01.cn 注册账号  下载客户端

  1. 确保本地Vue可以正常访问。演示本地有个：http://127.0.0.1:8082/#/login 的vue服务 

  1. 进入灵曜控制台 - 隧道。编辑隧道的ip地址和端口号 

  1. 编辑成功后，查看隧道是在线状态的。这时候就可以在外网通过隧道域名访问vue服务了。比如我的隧道域名是：http://8t7titboh8.tcp01.cn:80 

截至到这里，您的Vue服务已经可以通过外网正常穿透访问了。 正如我们所强调的一样，灵耀内网穿透使用非常方便快捷！其它场景可自行举一反三，祝君使用愉快！

外网访问内网页面的方法：ngrok结合vscode快速访问vue项目
weixin_46353030的博客
08-21 1271
区分概念： 内网：局域网是指在某一区域内由多台计算机互联成的计算机组，一般是方圆几千米以内。 外网：即广域网，又称公网。是连接不同地区局域网或城域网计算机通信的远程网。通常跨接很大的物理范围，所覆盖的范围从几十公里到几千公里，它能连接多个地区、城市和国家，或横跨几个洲并能提供远距离通信，形成国际性的远程网络。广域网并不等同于互联网。 为了能够使内网的地址被外网访问到，此时需要用到ngrok工具 一、ngrok安装（windows环境) 进入ngrok官网下载：https://ngrok.com/downl
灵曜内网穿透-群晖docker安装篇
waiwai0511的博客
01-03 588
灵曜内网穿透-群晖docker安装篇
灵曜内网穿透-远程访问群晖
waiwai0511的博客
01-04 479
灵曜内网控制台注册地址：http://console.http01.cn/远程访问群晖只需修改隧道配置即可，内网端口设置为群晖网页服务http端口。确认保存隧道配置后即可通过访问地址访问群晖。截止到这里，正常访问群晖平台了。
Vue项目搭建,从外网访问本地Vue项目-frpee内网穿透Vue
xnkyn的博客
10-22 1585
如何快速搭建Vue项目，并通过frp外网访问本地Vue项目全过程。Vue项目创建、frpee内网穿透、Vue项目配置与访问，提升开发效率，实现项目的便捷展示与测试。
外网访问Vue生产环境本地地址
Welcome KrityCat Honey
04-16 385
个人记录。
基于Netty实现的内网穿透&反向代理的工具 (支持TCP上层协议和HTTP的穿透式反向代理).zip
05-31
基于Netty实现的内网穿透&反向代理的工具 (支持TCP上层协议和HTTP的穿透式反向代理).zip
natapp内网穿透工具
05-24
总结起来，“natapp内网穿透工具”是解决内网服务对外访问问题的有效工具，它通过NAT技术实现内外网的通信，适用于各种需要公网访问内网服务的情况。使用时，用户需要注意安全配置，并根据实际需求选择合适的版本和...
vue内网穿透配置
yangzhijie0608的博客
04-15 1981
1,进入https://www.ngrok.cc/login.html获取隧道ID，启动sunny bat工具（内网穿透工具sunny ngrok） 2.在webpack.dev.conf.js文件下配置相关参数。 vue2:config文件夹下的index.js文件下配置 module.exports = { devServer: { port: 3000, // 端口 disableHostCheck: true, // 绕过主机检查 }, // lintOnSa
使用natapp实现内网穿透详细教程
https://hibernation0814.github.io/
05-24 4719
当我们的项目是部署在本地的时候，如何让其他用户（不在同一个局域网之下）来进行调用呢？这时我们就可以使用内网穿透将自己的IP通过映射成相应的地址，然后再通过映射后的地址来进行访问本地的项目。
将vue项目部署到服务器并通过外网访问的两种方式（springboot中static/nginx）
热门推荐
qq_28670711的博客
11-19 1万+
最近一段时间在用vue写一个前端项目，想着做出来的界面可以让小伙伴们一起看看，分享一下。所以就趁着双11在阿里云买了台服务器。实践中我发现vue项目部署到服务器一共有两种方式，当然也有可能有别的方法。 一.将vue项目打包后生成的dist目录下的文件复制到springboot项目里面 1. 前端vue项目先通过npm run build生成dist目录 2.将dist...
vue 本地服务不能被外部IP访问的完美解决方法
10-17
主要介绍了vue 本地服务不能被外部IP访问的解决方法,本文通过代码讲解的非常详细，需要的朋友可以参考下
vue项目本地映射到外网访问时出现 Invalid Host header
不忘的博客
11-19 1315
新版的webpack-dev-server增加了安全验证，默认检查hostname，如果hostname不是配置内的，将中断访问。通过公网访问本机运行的vue项目，访问时遇到的问题。
本地使用Nginx部署vue项目,并且通过飞鸽内网穿透达到域名访问的效果
xiaokuangren_的博客
02-15 914
Nginx部署vue项目简单版本
Vue发布外网
cq_async的博客
08-22 1140
1.Tomcat在局域网中localhost可以访问，但是无法通过本地ip访问，127.0.0.1也无法访问问题的解决方法 https://www.cnblogs.com/uzipi/p/4022630.html
灵曜内网穿透-win7/win10远程访问安装篇
waiwai0511的博客
01-04 570
一般家用电脑是没有固定IP的，这时候我们就需要借助内网穿透工具，将内网和外网进行绑定。本文介绍的是灵曜内网穿透，简单好用。2、win7/win10这台电脑需开放远程端口3389(默认情况下是开放的)。灵曜内网控制台注册地址：http://console.http01.cn/灵曜内网控制台注册地址：http://console.http01.cn/按以上步骤完成后即可看见自己的客户端已经上线。截止到这里，已经可以正常访问win7电脑了。以上就已经完成了所有配置。1、有固定IP进行访问。一、下载和安装客户端。
vue 通过外部系统访问本地网站
weixin_46935407的博客
03-24 382
每次外部系统访问时，会重新请求一次jumpPageInfo接口。
vue 本地服务设置允许外部IP访问
fuck487的博客
01-13 6297
参考:https://www.jb51.net/article/149717.htm 修改 config/index.js 的 host 属性为 ‘0.0.0.0' 改成 host: '0.0.0.0' 然后关闭本机防火墙，就能通过其他设备访问vue
不能访问外网最简单的方法安装vue-devtools
mx_is_bang的博客
07-04 684
https://blog.csdn.net/yizufengdou/article/details/103985709
vue中的网络请求
weixin_48079053的博客
08-06 432
使用ajax请求的时候，如果发送请求的页面url 同 接口 url的 协议、ip(域名)，端口号，只要有一个同，那么浏览器就会阻止服务器的响应， 这是浏览器的一种安全机制，这种请求称为：跨域请求。formData 表单数据， 后端要求接收一个 key1=value1&key2=value2的字符串，前端必须拼接成对应的格式发送。$.ajax默认发送也是formData。form表单标签默认发送的就是这种格式。vue.config.js文件。其他就需要自己拼接转换。发送网络请求的url。...
vue3利用cpolar实现内网穿透
最新发布
04-01
### Vue3 项目通过 cpolar 实现内网穿透 #### 配置 Vue3 开发环境 为了使 Vue3 的开发服务器能够被外部网络访问，需要调整 `vue.config.js` 文件中的配置项。以下是具体的配置代码： ```javascript const { defineConfig } = require('@vue/cli-service'); module.exports = defineConfig({ transpileDependencies: true, devServer: { allowedHosts: 'all', host: '0.0.0.0', // 绑定到所有网络接口 port: 8080, // 设置监听端口为 8080 https: false, // 使用 HTTP 协议 client: { webSocketURL: { protocol: 'ws', hostname: 'localhost', port: 8080 } } } }); ``` 上述配置允许开发服务器绑定到所有的网络接口上，并开放指定的端口号供外部设备连接[^4]。 --- #### 安装并启用 cpolar 工具 cpolar 是一款强大的内网穿透工具，支持将本地服务暴露给外网访问。以下是安装和启动 cpolar 的具体步骤： 1. **下载并安装 cpolar** 执行以下命令完成 cpolar 的安装： ```bash curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash ``` 2. **向系统添加 cpolar 服务** 将 cpolar 添加为系统的开机自启服务： ```bash sudo systemctl enable cpolar ``` 3. **启动 cpolar 服务** 启动 cpolar 并使其运行于后台模式： ```bash sudo systemctl start cpolar ``` 以上操作完成后，cpolar 就可以作为一项长期运行的服务来管理内网穿透需求[^1]。 --- #### 创建隧道映射 为了让外网用户可以通过域名访问本地的 Vue3 应用程序，需创建一条从远程到本地的 HTTP 请求转发通道。执行以下命令即可建立隧道： ```bash cpolar http 8080 ``` 此命令表示将本地的 8080 端口（即 Vue3 开发服务器默认使用的端口）映射至一个可公开访问的 URL 地址。一旦成功建立连接，终端会显示分配好的临时域名[^3]。 --- #### 测试与验证 当一切设置完毕之后，在任意一台联网计算机上的浏览器里输入由 cpolar 提供给您的公共链接地址，便能顺利加载部署在您个人机器上的 Vue3 前端应用界面[^2]。 ---
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值