使用内网穿透开发第三方授权登录、第三方支付等（微信扫码登录、微信支付、支付宝支付等）

前后端分离项目&＃xff1a;前端代码在内网&＃xff0c;后端代码在外网&＃xff0c;操作流程图

前后端分离项目&＃xff1a;前端代码在内网&＃xff0c;后端代码也在内网&＃xff0c;操作流程图

其他开发注意&＃xff1a;

请先申请好的域名及服务器&＃xff1b;

微信、支付宝等第三方api开发详细见官方文档介绍&＃xff1b;

了解oauth2.0授权认证机制&＃xff0c;可以直接使用第三方集成好的sdk如JustAuth.jar等&＃xff1b;

勿必申请好相关第三方平台appid, appsecret等

这里以微信WEB端扫码登录为例介绍使用
#1# 登录微信开放平台&＃xff1a;https://open.weixin.qq.com
    >管理中心 >网站应用&＃xff08;移动应用or小程序...&＃xff09; >查看应用 >[开发信息]设置&＃xff1a;授权回调域&＃61;vue.{youDomain}.com

#2# 在阿里云上设置DNS解析&＃xff0c;添加记录&＃xff1a;
    记录类型&＃xff1a;[A-将域名指向一个IPV4地址]
    主机记录&＃xff1a;vue.{youDomain}.com
    解析路线&＃xff1a;默认
    记录值&＃xff1a;120.78.180.104 (小米球ngrok2.xiaomiqiu.cn对应的IP地址)

#3# 配置内网穿透工具&＃xff1a;登录小米球网站&＃xff1a;http://ngrok.ciqiuwl.cn/
    3.1 操作流程 >>> 登录管理后台系统&＃xff1a;https://manager.xiaomiqiu.com/
        注册账号并登录 >系统管理 >账户管理 >我的账户 >复制 [小米球Token]

    3.2 下载ngrok-windows_amd64
        网盘&＃xff1a;https://pan.baidu.com/share/init?surl&＃61;aks8uJx0s9XrDj7oMsvqmw  密码&＃xff1a;74ex
        在window本机解压打开
        修改配置 ngrok-windows_amd64 > ngrok.conf
            找到第4行&＃xff1a; auth_token: "[小米球Token]" 
            修改本地应用[httptun]端口号&＃xff1a; http: 127.0.0.1:8888(我自己的是8888&＃xff0c;改成自己程序的端口)
            修改本地应用[httpstun]端口号&＃xff1a; https: 127.0.0.1:8888(我自己的是8888&＃xff0c;改成自己程序的端口)
        修改配置 > 小米球Ngrok一键启动工具.bat
            找到第38行改为&＃xff1a;ngrok.exe -config&＃61;ngrok.conf -hostname ngrok.{youDomain}.com 8888

    3.3 双击启动【小米球Ngrok一键启动工具.bat】
        请输入需要启动的隧道名称&＃xff1a;
            如果用http访问填写: httptun&＃xff1b;用https访问填写: httpstun
            回车 > 提示&＃xff1a;http://vue.{youDomain}.com -> 127.0.0.1:8888

#4# 启动程序调试
    4.1 前端启动nodejs&＃xff0c;后端启动java / php 等
    4.2 启动【小米球Ngrok一键启动工具.bat】 > 输入【httptun】 见3.3
    4.3 访问远程二维码扫码页面&＃xff1a;https://api.{youDomain}.com/auth/wxopen/user/login
    4.4 扫码回调进入前端页面&＃xff1a;http://vue.{youDomain}.com/wx_auth.html?code&＃61;xxx&state&＃61;xx
    4.5 后端api回调接口&＃xff1a;https://api.{youDomain}.com/auth/wxopen/user/callback?code&＃61;xxx&state&＃61;xx
    4.6 登录成功返回用户信息&＃xff0c;测试调用获取用户信息接口&＃xff1a;http://api.{youDomain}.com/auth/user/getInfo