首页 > 编程知识 正文

第三方账号登录,注册登录功能是如何实现的

时间:2023-05-03 16:28:13 阅读:43867 作者:2580

大家在自己做项目的时候,有没有想过实现第三方APP的登录? 就像这样:

本文介绍了如何实现第三方APP应用程序登录。

什么是OAuth2.0 OAuth? OAuth为用户资源许可提供安全、开放和简单的标准。 OAuth许可证相对安全,因为第三方不会接触到用户的帐户信息,如密码。 OAuth2.0是OAuth的延续,而2.0关注的是客户端开发人员的简易性。

申请访问网站的所有典型第三方APP都支持第三方登录。 例如,QQ、微信、微博、千兆、千兆等。 要申请第三方登录权限,必须前往相应的平台,例如QQ。 搜索QQ开放平台。

进入APP应用程序管理,创建APP应用程序即可:

但是,访问QQ、微信、微博等站点需要验证,而且很费事,所以我们使用Gitee作为第三方APP应用程序进行访问。

首先打开Gitee并选择设置。

在设置中,选择第三方APP应用程序:

要创建APP应用程序并填写信息,请单击。

您可以自由填写APP名称,但以下两个地址有用途。 对于APP主页,必须填写当前APP的主页。 此外,APP应用回调接口还会填写成功登录后需要跳转的页面。

创建spring boot APP应用程序申请完成后,可以创建spring boot APP应用程序并创建新的index.html页面。

! doctypehtmlhtmllang=' en ' headmetacharset=' utf-8 ' title title/title/headbodyform用户名3360 input type=' text '/br

页面很丑,但不重要。 实现功能就好了。

单击Gitee登录链接,您必须跳至第三方登录页面,如下所示:

那我们该怎么实现呢?

如果您返回Gitee并创建APP应用程序,然后向下拖动页面,则会出现模拟请求按钮。

单击此按钮可进行伪装登录。

地址栏中的地址是要跳转的页面,用于复制地址。

https://gitee.com/oauth/authorize? client _ id=52908197466 CD 3008 db 76 a 6018 de 66c 8d 222656056 fa 78 b 26 dd58 D1 F4 fa 0a 606 redirect _ uri=http://localhost:8080 /

client_id redirect _ uri response _ type其中client _ id在创建APP应用程序后提供。

也就是地址的内容。 redirect_uri是在单击接受批准按钮后必须跳转的页面。 也就是说,登录成功后,必须跳至成功的页面,最后跳至response_type。 这表示响应类型为授权代码。

看看验证码的作用吧。 当用户单击同意认证的按钮时,Gitee服务器将验证码传递到redirect_uri指向的页面。 在这种情况下,您可以接收此验证码并与访问令牌交换。 只有获取了访问令牌,才能获取Gitee当前用户的信息。

点击同意批准按钮后:

获取许可证代码后,可以使用此地址与访问令牌交换。

https://gitee.com/oauth/token? gant _ type=授权_编码={编码} client _ id={ client _ id } redirect _ uri={ redirect _ uri } client _ id

得到适当的结果。

{ ' access _ token ' : ' CD 2c 33 C3 Fe 548 a 23188159 f 87 da 70110 ',' token_type': 'bearer ', ' expires _ in ' 33660 ' ' refresh _ token ' : ' c 95 a 38 ab 2357638 ff C4 DC6f 09 c 623 f 2333 e 0930 a 37 de c8 e 2f 191 a 40 D7 AFD 3514 ',','

0}

得到了AccessToken之后,就可以获取到用户在Gitee中已经授权的任何信息了。

整个授权认证的过程如下图所示:

实现登录流程

熟悉了整合流程之后,我们用代码来实现一下,首先修改页面:

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form> 用户名:<input type="text"/><br/> 密码:<input type="password"/><br/> <a rel="external nofollow" href="https://gitee.com/oauth/authorize?client_id=52908197466cd3008db76a6018de66c8d222656056fa78b26dd58d1f4fa0a606&redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fsuccess&response_type=code">Gitee登录</a> <input type="submit" value="登录"/><br/> </form> </body></html>

现在超链接的地址经过修改后就能成功跳转至Gitee授权页面了,因为授权成功后跳转的地址为 http://localhost:8080/success ,所以需要来处理一下这个请求,创建一个控制器:

@Controllerpublic class LoginController { @GetMapping("/success") public String login(@RequestParam("code") String code){ System.out.println(code); return "success"; } @GetMapping("/") public String index(){ return "index"; }}

当授权成功后我们让其跳转至success.html页面,并接收Gitee传递过来的授权码,所以创建success.html:

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>登录成功!</h1> </body></html>

启动项目测试一下:

点击同意授权后确实登录成功了,控制台也输出了授权码:

e907fd92d8392ebcd72dff321da45115ff0fba2dec0e6918b233ec7d03b76e5d

其实到这里登录流程还没有结束,因为如果使用第三方应用登录的话,平台会使用第三方应用的一些信息,比如账号、头像等直接作为当前平台的登录名和头像,所以我们还需要获取用户在Gitee中的一些信息。

此处参考Gitee的API文档:

比如获取授权用户的资料信息:

它需要传递一个access_token作为参数,那我们要做的就是使用授权码去得到access_key:

@Controllerpublic class LoginController { @GetMapping("/success") public String login(@RequestParam("code") String code, Map<String,String> map) { // 获取accesskey String accessKey = getAccessKey(code); System.out.println(accessKey); // 通过accessKey获取用户信息 String userInfo = getUserInfo(accessKey); // 取出用户名 String name = (String) JSONObject.parseObject(userInfo).get("name"); // 取出头像 String avatar_url = (String) JSONObject.parseObject(userInfo).get("avatar_url"); // 放入请求域 map.put("name",name); map.put("avatar_url",avatar_url); return "success"; } /** * 获取用户信息 */ private String getUserInfo(String accessKey) { String json = ""; OkHttpClient client = new OkHttpClient(); // 通过该地址能够获取到用户信息 String url = "https://gitee.com/api/v5/user?access_token=" + accessKey; Request request = new Request.Builder() .get() .url(url).build(); try { Response response = client.newCall(request).execute(); json = response.body().string(); } catch (IOException e) { e.printStackTrace(); } return json; } /** * 获取AccessKey */ private String getAccessKey(String code) { OkHttpClient client = new OkHttpClient(); // 通过该地址能够获取到access_token String url = "https://gitee.com/oauth/token"; // 封装请求参数 RequestBody requestBody = new FormBody.Builder() .add("grant_type", "authorization_code") .add("code", code) .add("client_id", "52908197466cd3008db76a6018de66c8d222656056fa78b26dd58d1f4fa0a606") .add("redirect_uri", "http://localhost:8080/success") .add("client_secret", "7e84401a9752e88d22d5450c1687ca6a19bc34f45fe3452cefd33312d8153978") .build(); Request request = new Request.Builder() .post(requestBody) .url(url).build(); String accessKey = ""; try { Response response = client.newCall(request).execute(); String json = response.body().string(); // 获取json串中的access_token属性 accessKey = (String) JSONObject.parseObject(json).get("access_token"); } catch (IOException e) { e.printStackTrace(); } return accessKey; } @GetMapping("/") public String index() { return "index"; }}

success.html页面需要显示用户信息:

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>登录成功!</h1> <h1>用户名:<span th:text="${#request.getAttribute('name')}"></span></h1> <img th:src="${#request.getAttribute('avatar_url')}"> </body></html>

效果如下:

事实上,登录流程远没有这么简单,当用户取消授权时就不能让其登录,程序里还没有加上这类判断,对于从未注册过的用户来说,这次登录就相当于一次注册,所以还需要以Gitee中用户的某些信息作为注册信息进行登录,当已经注册过的用户使用第三方登录时,要让其正常登录。

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。