# 什么是内网穿透?
内网穿透简单来说就是将你电脑访问和别人电脑访问通过 natapp 隧道打通,让内网的数据能在别人的电脑上可以获取。
换个说法就是将原本只能在本机上访问的项目网站等,通过内网穿透使得你可以在其他人的网上进行访问。
# 为什么要使用内网穿透?
要想让你的项目可以实现在网络上进行访问和使用。要么将你的项目部署到云服务器上,要么通过内网穿透使得他人可以访问原本只在你的计算机上项目接口。但是如果使用第一种方法,如果项目出现
问题后,就必须得将项目重新部署到云服务器上,而且还需要公网 IP 和服务器。
但使用内网穿透可以直接实现本地调试,比较方便。
# NATAPP 下载及配置步骤
- 注册 NATWPP 账号
- 登录进去,可以看到有免费 / 付费的隧道
- 配置完成之后,可以看到对应的数据
- 启动本地 web 项目进行,并访问是否成功
- 下载客户端,选择对应的版本
- 下载解压,得到 natapp.exe
- 新建配置文件 config.ini
#将本文件放置于 natapp 同级目录 程序将读取 [default] 段 | |
#在命令行参数模式如 natapp -authtoken=xxx 等相同参数将会覆盖掉此配置 | |
#命令行参数 -config= 可以指定任意 config.ini 文件 | |
[default] | |
authtoken= #对应一条隧道的authtoken | |
clienttoken= #对应客户端的clienttoken,将会忽略authtoken,若无请留空, | |
log=none #log 日志文件,可指定本地文件, none=不做记录,stdout=直接屏幕输出 ,默认为none | |
loglevel=ERROR #日志等级 DEBUG, INFO, WARNING, ERROR 默认为 DEBUG | |
http_proxy= #代理设置 如 http://10.123.10.10:3128 非代理上网用户请务必留空 |
- 启动 natapp
- 访问新地址的 web 项目
注:如果页面出现 Invalid Host header,则在 vue.config.js 配置
module.exports = defineConfig({ | |
transpileDependencies: true, | |
devServer: { | |
historyApiFallback: true, | |
allowedHosts: "all", | |
} | |
}) |
- 为了保证自己的接口只被自己想分享的人看,可以给上面添加用户名和密码
- 再次访问原先的 web 项目的时候,需要重新输入账号密码
原文链接:https://blog.csdn.net/weixin_42063820/article/details/124563983