分佈式微服務專欄009(springboot中集成微信登錄[完整,最新,最全] &ngrok內網穿透)

歡迎大家加入我的github項目,一起學習，一起發展

---> 全棧工程師進階學習站
---> 我的前端學習筆記
--->行業內最新最羣的報告，工作日每日更新

springboot中集成微信登錄

⭐️(1).準備工作

1️⃣申請測試號

https://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?action=showinfo&t=sandbox%2Findex

訪問該鏈接,掃碼登錄申請一個測試號(正式號需要公司認證)

2️⃣官方文檔地址 (官方文檔中的鏈接參數有錯,建議看我下文博客)

https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html

3️⃣幾個注意點

後面需要登錄測試的微信,需要先掃碼關注測試公衆號

你自己的AppID/secret

這邊待會要用,先留意着

⭐️(2).微信登錄的流程圖(很重要,比官方更詳細)

⭐️(3).三大重要接口調用所需參數及其返回值解析

1️⃣請求獲取code參數

鏈接:

https://open.weixin.qq.com/connect/oauth2/authorize?    ---->不變
appid=APPID                                             ---->你測試號的AppID
&redirect_uri=RedirectUrl                               ---->微信回調的方法地址(下面詳解)
&response_type=code                                     ---->不變
&scope=snsapi_userinfo                                  ---->不變
&state=STATE                                            ---->不變
#wechat_redirect                                        ---->不變

返回值:

返回一個string類型的code參數  如:061Iwfgo1gLnqp0Dffho1G2Ufo1Iwfgu

2️⃣請求access_token&openid等參數

鏈接:

https://api.weixin.qq.com/sns/oauth2/access_token?      ---->不變
appid=APPID                                             ---->你測試號的AppID
&secret=SECRET                                          ---->你測試號的secret
&code=CODE                                              ---->上面方法返回的code
&grant_type=authorization_code                          ---->不變

返回值:

access_token:下面要用

openid:用戶的id(唯一,不變),下面獲取用戶信息需要用,這個也可以當做微信用戶表的主鍵id

expire_in:過期時間(單位:秒),兩小時

3️⃣請求用戶信息

鏈接:

https://api.weixin.qq.com/sns/userinfo?                  ---->不變
access_token=access_token                                ---->上面方法返回的access_token
&openid=openid                                           ---->上面方法返回的openid
&lang=zh_CN                                              ---->不變

返回值:

⭐️(4).代碼結構圖

⭐️(5).代碼展示

1️⃣微信登錄實體類代碼&配置文件中的數據展示

/**
 * **********************************************************
 *
 * @Project:
 * @Author : Gavincoder
 * @Mail : [email protected]
 * @Github : https://github.com/xunyegege
 * @ver : version 1.0
 * @Date : 2019-10-09 10:28
 * @description:
 ************************************************************/
@Component
@ConfigurationProperties(prefix = "wx")
@Data
public class WxLoginModel {
    //請求code的地址

    private String codeUrl;

    private String appId;

    //微信回調地址
    private String redirectUrl;

    //祕鑰
    private String secret;

    //請求toekn的地址

    private String tokenUrl;

    //請求用戶信息的地址
    
    private String userInfoUrl;


    /**
     * @return java.lang.String
     * @throws
     * @description 拼接生成請求code完整鏈接
     * @author Gavin
     * @date 2019-10-09 20:47
     * @since
     */
    public String getRealUrl() {
        //new stringBuffer對象的時候就把第一個需要拼接的字符串加進去(方便操作)
        StringBuffer buffer = new StringBuffer(getCodeUrl());


        String realUrl = buffer
                .append("appid=")
                .append(getAppId())
                .append("&redirect_uri=")
                .append(getRedirectUrl())
                .append("&response_type=code")
                .append("&scope=snsapi_userinfo")
                .append("&state=STATE")
                .append("#wechat_redirect")
                .toString();
        return realUrl;
    }


    /**
     * @return java.lang.String
     * @throws
     * @description 拼接生成請求accessToken/openid的完整鏈接,參數code由第一步方法返回
     * @author Gavin
     * @date 2019-10-09 20:48
     * @since
     */
    public String getAccessTokenUrl(String code) {


        StringBuffer buffer = new StringBuffer(getTokenUrl());
        String tokenUrl = buffer
                .append("appid=")
                .append(getAppId())
                .append("&secret=")
                .append(getSecret())
                .append("&code=")
                .append(code)
                .append("&grant_type=authorization_code").toString();
        return tokenUrl;
    }


    /**
     * @return java.lang.String
     * @throws
     * @description 拼接生成請求用戶信息的完整鏈接, 參數accessToken/openid由第二步方法返回
     * @author Gavin
     * @date 2019-10-09 20:48
     * @since
     */
    public String getUserInfoUrl(String accessToken, String openid) {

        StringBuffer buffer = new StringBuffer(getUserInfoUrl());
        String UserInfoUrl = buffer
                .append("access_token=")
                .append(accessToken)
                .append("&openid=").append(openid)
                .append("&lang=zh_CN").toString();

        return UserInfoUrl;
    }


}

#微信登錄相關

wx.codeUrl=https://open.weixin.qq.com/connect/oauth2/authorize?

wx.appId=xxxxxxxxxx(填你自己的)    

wx.redirectUrl=https://7292458c.ngrok.io/wx/callBack   (填你自己的) --這個下面詳解

wx.secret=xxxxxxxxxx(填你自己的)    

wx.tokenUrl=https://api.weixin.qq.com/sns/oauth2/access_token?

wx.userInfoUrl=https://api.weixin.qq.com/sns/userinfo?

2️⃣controller層代碼展示

/**
 * **********************************************************
 *
 * @Project:
 * @Author : Gavincoder
 * @Mail : [email protected]
 * @Github : https://github.com/xunyegege
 * @ver : version 1.0
 * @Date : 2019-10-09 10:27
 * @description:
 ************************************************************/

@Controller
@RequestMapping(value = "/wx")
public class WxController {

    @Autowired
    private WxLoginModel wxLoginModel;


    @GetMapping(value = "/getCode")
    public String getCode() {
        
        //將生成的鏈接返回到前端並重定向到鏈接地址
        // 爲了使用redirect重定向方法,不可加上@restcontroller  @ResponseBody
        //這邊你也可以使用二維碼生成器生成二維碼圖像進行掃碼
        return "redirect:" + wxLoginModel.getRealUrl();
    }


    @GetMapping(value = "/callBack")
    public String callBack(String code) {

        //1.使用回調傳進來的code數據調用生成鏈接的方法,獲取請求access_token&openid等參數的鏈接
        String accessTokenUrl = wxLoginModel.getAccessTokenUrl(code);

        //2.通過工具類發起http請求並接受返回值
        String accessTokenUrlJson = UrlUtils.loadURL(accessTokenUrl);

        //3.由於獲取到的數據是json對象格式的,所以使用fastjson中的方法將其轉成jsonObject
        JSONObject accessTokenJsonObject = JSONObject.parseObject(accessTokenUrlJson);
        
        //4.通過fastjson的getstring方法提取該json對象中的數據
        String accessToken = accessTokenJsonObject.getString("access_token");
        String openid = accessTokenJsonObject.getString("openid");

        //5.使用獲取到的數據調用生成鏈接的方法,獲取請求用戶信息的鏈接
        String userInfoUrl = wxLoginModel.getUserInfoUrl(accessToken, openid);
        //6.通過工具類發起http請求並接受返回值
        String userInfoJson = UrlUtils.loadURL(userInfoUrl);
        //7.同上,解析數據,獲取數據,至此,微信登錄成功
        JSONObject userInfoJsonObject = JSONObject.parseObject(userInfoJson);

        
        //8.拿數據進行操作.這邊隨意了
        //..........
        
        return "隨意寫什麼";

    }


    @GetMapping(value = "/happy")
    @ResponseBody
    public String happyBirthDay() {

        //彩蛋❤️
        return "2019-10-10,?我親愛的平平生日快樂❤️";
    }


}

3️⃣http請求工具類展示

/**
 * 本類提供了對URL所指向的內容的加載操作
 *
 * @author boot
 */
public class UrlUtils {

    /**
     * 獲取url網址返回的數據內容
     * 用的時候調用這個方法就行,傳入你需要請求的url鏈接
     * @param urlStr
     * @return
     */
    public static String loadURL(String urlStr) {
        try {
            URL url = new URL(urlStr);
            HttpURLConnection urlConnection = (HttpURLConnection) url.openConnection();
            urlConnection.setRequestMethod("GET");
            urlConnection.connect();
            InputStream inputStream = urlConnection.getInputStream();
            String responseStr = ConvertToString(inputStream);
            return responseStr;
        } catch (IOException e) {
            e.printStackTrace();
            return null;
        }
    }

    private static String ConvertToString(InputStream inputStream) {
        InputStreamReader inputStreamReader = new InputStreamReader(inputStream);
        BufferedReader bufferedReader = new BufferedReader(inputStreamReader);
        StringBuilder result = new StringBuilder();
        String line = null;
        try {
            while ((line = bufferedReader.readLine()) != null) {
                result.append(line + "\n");
            }
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
            try {
                inputStreamReader.close();
                inputStream.close();
                bufferedReader.close();
            } catch (IOException e) {
                e.printStackTrace();
            }
        }
        return result.toString();
    }
}

⭐️(6). redirectUrl鏈接解析&內網穿透方法介紹

?redirectUrl參數

redirectUrl地址填的是我們controller層的callBack方法的地址

這個是給微信用的回調接口.

解釋:

我們點擊登錄鏈接或掃碼後,

微信需要將它生成的數據回傳給我們開發者的後端,

這時候微信就需要一個回調接口,

那在上面配置文件中需要填的就是我們所寫的callBack接口方法的地址

?使用Ngrok進行內網穿透

有一部分開發者跟我一樣是在本機上進行操作的,

我們使用的都是單機內網環境,

要想讓微信端調用到我們的地址,

就需要進行內網穿透

軟件推薦

https://ngrok.com/download

使用方法
mac下使用

使用命令行終端,來到ngrok目錄下

輸入命令:

./ngrok http localhost:9004

這邊的端口號對應你自己的項目的端口號

畫框的就是我們需要的鏈接,添加到配置文件中
配置文件:  wx.redirectUrl=https://87ef9499.ngrok.io/wx/callBack   
          (後面的  /wx/callback  對應你自己項目中自己寫的回調函數的接口地址)
windows下解壓雙擊exe文件

在跳出來的命令串口中輸入:

ngrok http 8080 這邊的端口號對應你自己的項目的端口號

其餘操作同上(修改配置文件地址)

?在微信測試號網頁上設置自己的內網穿透地址

前面不要加 https://

⭐️(7).測試展示

1️⃣在地址欄輸入請求地址,地址欄變的這個鏈接,就是真實請求地址,可以放在微信客戶端打開

,也可以使用二維碼生成器生成二維碼,進而掃碼登錄

2️⃣微信端提示獲取用戶信息,點擊同意

3️⃣java端DeBug結果,所有數據均已獲得

閒聊時刻

10年短信公司，互聯網100強企業！主營業務：短信（國內和國際）App H5一鍵免密登錄，防薅羊毛接口，圖片OCR，空號檢測，活躍號檢測，人證覈驗，活體檢測，高防ddos攻擊等等200多個企業服務接口！需要的聯繫他13592366783 官方鏈接：https://zz.253.com/v5.html#/register?uid=1953

自己公司需求偶然間用了一家第三方接口供應商，產品應有盡有，很齊全，對接文檔非常詳細，彼此都很節約時間，主要非常穩定，包括服務方面很給力，有興趣的博友，可以聯繫他，算是對合作夥伴的支持了

分佈式微服務專欄009(springboot中集成微信登錄[完整,最新,最全] &ngrok內網穿透)

⭐️(1).準備工作

1️⃣申請測試號

⭐️(2).微信登錄的流程圖(很重要,比官方更詳細)

⭐️(3).三大重要接口調用所需參數及其返回值解析

1️⃣請求獲取code參數

2️⃣請求access_token&openid等參數

3️⃣請求用戶信息

⭐️(4).代碼結構圖

⭐️(5).代碼展示

1️⃣微信登錄實體類代碼&配置文件中的數據展示

⭐️(6). redirectUrl鏈接解析&內網穿透方法介紹

?redirectUrl參數

?使用Ngrok進行內網穿透

軟件推薦

?在微信測試號網頁上設置自己的內網穿透地址

⭐️(7).測試展示

linux神器

java中如何線程安全地遍歷集合

SpringBoot+EasyExcel+異步(多線程)郵件發送

分佈式微服務專欄005(springboot集成Dubbo)

分佈式微服務專欄008(springboot中集成BCrypt密碼加密& jjwt&自定義註解(攔截器))

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結