微信开发02-微信公众号授权登录

目录

准备工作

1、注册个人账号

1.1、注册地址

2、申请测试账号

2.1测试账号位置:

2.2、点击公众平台测试账号

2.3、测试账号拥有的权限

3、微信测试账号上的配置

3.1、接口配置信息

3.2、授权回调页面域名修改

4、授权登录开发

4.1、编写前端授权登录页面

4.2、编写授权成功的回调接口

4.3、后端回调接口

微信开发教程系列


 

 

 

准备工作

内网穿透参考:

https://blog.csdn.net/xixiyuguang/article/details/104746608

内网穿透效果,如图所示,当你访问图中域名的时候,会转接到你本地的8080端口,端口也是可以更改的:

 

1、注册个人账号

1.1、注册地址

https://mp.weixin.qq.com/

1、进入注册界面

 

2、选择公众号类型(如果没有公司,选择订阅号

 

3、注册成功后登录,开发者只需注意一下几个模块,其余模块为常规公众号使用的功能。不符合开发相关的情况。

 

 

 

 

2、申请测试账号

2.1测试账号位置:

 

 

2.2、点击公众平台测试账号

也可以点击这个地址:http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login

登录成功后是下面这个界面,获取到appID和appsecret,就可以开始开发了

2.3、测试账号拥有的权限

 

3、微信测试账号上的配置

3.1、接口配置信息

由于当前博客是只做公众号授权的,这里的接口配置可以不需要配置,只需要一些相应接口权限即可。如需接口配置信息填写,请参考博客:

3.2、授权回调页面域名修改

用户在网页授权页同意授权给公众号后,微信会将授权数据传给一个回调页面,回调页面需在此域名下,以确保安全可靠。沙盒号回调地址支持域名和ip,正式公众号回调地址只支持域名。

 

 

 

4、授权登录开发

 

4.1、编写前端授权登录页面

<!DOCTYPE html>
<html>
<head>
    <title>测试微信授权</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">


    <!--<link rel="icon" href="../favicon.ico" mce_href="favicon.ico" type="image/x-icon">-->
</head>
<body>
<!--网页帐号 	网页授权获取用户基本信息 每次都要要修改域名,授权回调页面域名:-->
<a href="https://open.weixin.qq.com/connect/oauth2/authorize?appid=你的测试账号的appId&redirect_uri=http://8skhcz.natappfree.cc/wechat/redirectUri&response_type=code&scope=snsapi_userinfo&state=123456#wechat_redirect">
    微信授权</a>
<br>
 

</body>
</html>

 

 

4.2、编写授权成功的回调接口

 //重定向过来的地址
    @RequestMapping("/redirectUri")
    public void redirectUri(String code, String state,
                            HttpServletRequest request, HttpServletResponse response) {
         
        try { 
            //code可以用于调用微信官方接口获取用户信息
            System.out.println("code:"+code);
            System.out.println("state:"+state);
            System.out.println("授权成功进入界面:");
            response.sendRedirect("http://8skhcz.natappfree.cc");
        } catch (Exception e) {
            System.out.println("出错:" + e.toString());
            try {
                response.sendRedirect("http://www.baidu.com");
            } catch (IOException e1) {
                e1.printStackTrace();
            }
        }


    }

 

4.3、后端回调接口

 @RequestMapping(value = {"/", "index"})
    public String index(HttpServletRequest req, HttpServletResponse resp) {
        return "登录成功,返回字符串(后期可考虑返回到指定的页面)";
    }

 

微信开发教程系列

开发环境-内网穿透使用natapp教程:https://blog.csdn.net/xixiyuguang/article/details/104746608

微信开发01-服务器配置 : https://blog.csdn.net/xixiyuguang/article/details/104861844

微信开发02-微信公众号授权登录 :https://blog.csdn.net/xixiyuguang/article/details/104860875

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值