您的位置:首页 > 编程语言 > Java开发

【用户授权设计】java第三方登录(微博,QQ)详细代码

2017-12-14 16:08 686 查看
第三方登录流程是:先获取code---->然后获取access_token----->根据token获取用户信息。

前台页面实现步骤:点击微博登录按钮---->打开一个子窗口,进行授权------>授权完成,跳转到首页或上次浏览的页面。

1、写第三方登录的按钮,点击按钮时,打开一个子窗口。

redirect_uri是你在微博上设置的回调地址。

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script type="text/javascript" src="http://statics.2cto.com/js/jquery.min.js"></script>
</head>
<script type="text/javascript">

var qqAuthWin,weiboAuthWin;

/**
* 关闭QQ子窗口
*/
function closeQQWin(){
var result = $("#qq").val();
if(result != ""){
console.log(result);
qqAuthWin.close();
}else{
console.log("值为空");
}
}

/**
* QQ登录
* http://localhost:9090/logback/qq.jsp  QQ互联上设置的回调地址
*/
function loginQQ(){
qqAuthWin = window.open("https://graph.qq.com/oauth2.0/authorize?response_type=code&client_id=CLIENT_ID&state=register&redirect_uri=http://localhost:9090/logback/qq.jsp",
'QQ授权登录','width=770,height=600,menubar=0,scrollbars=1,'+
'resizable=1,status=1,titlebar=0,toolbar=0,location=1');
}

/**
* 关闭微博子窗口
*/
function closeWeiboWin(){
var result = $("#weibo").val();
if(result != ""){
console.log(result);
weiboAuthWin.close();
}else{
console.log("值为空");
}
}

/**
* 微博登录
* http://localhost:9090/logback/weibo.jsp这个就是在微博上设置的回调地址 */
function loginWeibo(){
weiboAuthWin = window.open("https://api.weibo.com/oauth2/authorize?client_id=CLIENT_ID&response_type=code&state=register&redirect_uri=http://localhost:9090/logback/weibo.jsp",
'微博授权登录','width=770,height=600,menubar=0,scrollbars=1,'+
'resizable=1,status=1,titlebar=0,toolbar=0,location=1');
}
</script>
<body>
<input type="hidden" id="qq" value="">
<a  href="#" onClick="loginQQ()">QQ登录</a>

<br><br>
<hr>
<br>

<input type="hidden" id="weibo" value="">
<a href="#" onClick="loginWeibo()">微博登录</a>
</body>
</html>


2、回调地址页(qq.jsp、weibo.jsp)

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

String code = request.getParameter("code");//获取QQ返回的code
String state = request.getParameter("state");
%>
<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'weibo.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script type="text/javascript" src="http://statics.2cto.com/js/jquery.min.js"></script>
<script>
$(function(){
var code = "<%=code%>";
var state = "<%=state%>";
$.ajax({
url:"http://localhost:8080/cms_manage/api/qqLogin",
type:"post",
data:{code:code,state:state},
dataType:"json",
success:function(result){
result = JSON.stringify(result);
console.log(result);
//把返回的数据传给父窗口的隐藏域中
window.opener.document.getElementById("qq").value = result;
//授权完成后,关闭子窗口
window.opener.closeQQWin();
}
});
});
</script>
</head>

<body>
登录成功。
</body>
</html>


qq.jsp和weibo,jsp是一样的。。。

3、java代码

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  java