natApp内网穿透
一、打包本地项目
- 以Vue项目为例：
修改public/index.html路径：将
./用<%= BASE_URL%>代替：
base_url.png
在vue.config.js中添加配置项
publicPath:"./"
publicPath.png
- 打包项目
cnpm run build
二、启动本地服务
将dist文件夹下的文件，拷贝到Nginx的根目录下
根据需要配置nginx/conf/nginx.conf
清除nginx缓存
npinx -s reload
- 启动phpStudy或者直接双击nginx.exe
- 打开浏览器，测试本地端口号(127.0.0.1)
三、natApp隧道
根据不同的需求，选择不同的隧道类型。注意：隧道类型一旦选择，不可更改。
如果是网站开发者，通常选择Web类型，具体如下：
Web: 普通型http(s)隧道穿透,用于搭建网站,微信开发等穿透到本地web服务.
TCP: 端口转发 应用于SSH,数据库,远程桌面,GAME等基于TCP连接的一切应用任您想象~
UDP: 端口转发 应用于游戏,远程开机等基于UDP协议的一切应用
- 在购买隧道时之前，会提示：购买natApp选择二级域名。
natApp中的二级域名虽然冗长，但是价格便宜，不需要备案，直接使用，还要什么自行车~
购买二级域名.png
注意：如果不需要微信开发、https等，可以在这里直接选择，否则就不要在这里购买。先退出，先选择好符合要求的二级域名。
二级域名.png
- 在注册二级域名时，要注意选择能否【用于微信开发】、【SSL证书】。
注册二级域名.png
- 当然也可以使用自主域名：
使用时要注意避坑：
- 如果选择使用自主域名，并且在自主域名有对应域名解析的情况下，需要先修改自身的域名解析（600S后生效），因为自主域名中应用缓冲池解析权限比第三方内网穿透的权限高。
- 如果自主域名使用了SSL，则在natApp的隧道配置中，免费开启https将会无效。在启动natApp时候，会显示端口为443错误。
- 配置隧道信息
注意：这里的本地地址与端口号要与本地Nginx测试的相同
natApp.png
四、启动natApp
下载natApp并安装
复制隧道中的authtoken
autotoken.png
- 粘贴到安装目录下的config.iniauthtoken后面
authtoken属性.png
- 启动natapp.exe，浏览器访问Forwarding后面的域名，即为本地Nginx服务穿透的项目.
