内网穿透
作为一个开发者,内网穿透的概念你一定听过。
内网穿透(Intranet Penetration)是指借助一定的技术手段,将处于私有网络(内网)中的主机或服务器暴露给外部网络(公网)用户,使其能够通过公网访问内网服务。
简单来说,可以将本地的http://localhost:8080/ 服务,放在公网以其他url进行访问。
借助内网穿透,我本地开发的一个网址,可以让任何人访问,非常方便!
实现内网穿透,常见的方法是使用第三方工具或服务。如frp、ngrok、PortForward、cpolar
花生壳等等。
笔者本人使用过花生壳,用起来比较麻烦还要投入学习成本!
比较好用的就是ngrok和cpolar。ngrok是国外的,延迟很高,不好用。cpolar国内的,速度很快!
cpolar
这是国内的开发的,原理同ngrok,稳定。官网(https://dashboard.cpolar.com/)宣传也吊炸天
我们来试试。
注册
我们点击【免费注册】,然后进入套餐页面。
下载安装
选择免费套餐,进入【设置与安装页面】
下载安装包后,双击进行安装
连接账户
然后,打开命令行工具,按照官网第三步【连接您的账户】输入对应命令
注意:coplar前可能不需要添加 ./
映射服务
首先,我们本地启动一个前端
然后,命令行输入
cpolar http 5173
注:5173是端口号,根据实际项目的端口号进行更改。
此时,出现了三个连接,点击http或https的网址即可
异常问题处理
笔者使用vue2的前端项目,出现了报错
前端服务:
公网链接:
这和本地服务的url有关。如果是localhost这种,可能就会出现这个问题。我们可以尝试将localhost这种ip改成127.0.0.1这种形式。
在webpack项目中,也可以使用如下方式解决
devServer: {
//通过下面的配置可以解决
disableHostCheck: true,
proxy: {
}
},
ngrok
注册下载
使用ngork需要先去官网注册账号。https://ngrok.com/
注册好账号后,根据电脑系统下载不同的安装包
本文以windows系统为例。
下载安装包后,解压然后直接双击,出现黑色的命令弹框即可。
连接账户
在登录页面复制如下命令
然后,将其复制进刚才打开的命令行即可。
映射本地服务
要想将本地服务映射到公网,非常简单!如图,我本地开启了一个前端服务
端口是8080,现在,只需要执行
ngork http 8080
然后,访问控制台出现的https链接即可。