3、創建 測試 QQ登錄接口頁面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="js/json2.js" type="text/javascript"></script> //引用json轉換字符js類庫
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js"
data-appid="101170280" data-redirecturi="http://www.meihouw.com/qqreturn.htm"
charset="utf-8"></script> //101170280 為appid值 http://www.meihouw.com/qqreturn.htm 為回調地址
</head>
<body>
<span id="qq_login_btn"></span>
<input type="button" value="獲取" onclick="getInfo();" />
<hr />
<div id="mes">
</div>
<script type="text/javascript">
QC.Login({//按默認樣式插入QQ登錄按鈕
btnId: "qq_login_btn" //插入按鈕的節點id
});
getInfo();
function getInfo() {
if (QC.Login.check()) {
var getInfo_back = document.getElementById("mes");
getInfo_back.innerHTML = "";
QC.api("get_user_info")
.success(function (s) {//成功回調
alert("獲取用戶信息成功!當前用戶昵稱為:" + s.data.nickname);
})
.error(function (f) {//失敗回調
alert("獲取用戶信息失敗!");
})
.complete(function (c) {//完成請求回調
alert("獲取用戶信息完成!");
getInfo_back.innerHTML = c.stringifyData();
});
if (QC.Login.check()) {//如果已登錄
QC.Login.getMe(function (openId, accessToken) {
alert(["當前登錄用戶的", "openId為:" + openId, "accessToken為:" + accessToken].join("\n"));
});
//這里可以調用自己的保存接口
//...
}
}
}
</script>
</body>
</html>
4、測試成功之后可以用使用該方法
一、在使用登錄接口的頁面頂部加上
<script type="text/javascript" src="
data-appid="101170280" data-redirecturi="
charset="utf-8"></script>
二、在使用登錄的地方加上
<span id="qqLoginBtn_top" class="logins" style="float:left;margin-right:10px;"></span>
<script type="text/javascript">
QC.Login({
btnId: "qqLoginBtn_top" //插入按鈕的節點id
}, function (reqData, opts) {
//登錄成功
if (QC.Login.check()) {
QC.Login.getMe(function (openId, accessToken) {
var url = "handler/login.ashx?openid=" + openId + "&jsonstr=" + JSON.stringify(reqData);
$.getJSON(url, function (json) {
var html = " 歡迎您,<a href='/user/index.html'><span style='font-weight:bold; color:blue;'>" + json.name + "</span></a>, <a class='exit' href='javascript:QC.Login.signOut();location.reload();'></a>"; //后面個a為退出按鈕
$("#qqLoginBtn_top").html(html); //返回的信息
})
});
}
}, function (opts) {
//注銷成功
});
</script>
三、創建 login.ashx一般處理程序用于判斷用戶是否登錄,登錄過就直接返回信息,第一登錄就添加到數據庫中再返回信息
context.Response.ContentType = "text/plain";
string openid = context.Request.QueryString["openid"]; // ajax傳入來的openid ,數據表中一定要有該字段,即QQ的openid為唯一值
string jsonstr = context.Request.QueryString["jsonstr"]; // ajax傳入來的jsonstr字符
DAL.UserDAL dal = new DAL.UserDAL();
Model.User u = dal.GetModelByCond("openid='" + openid + "'");
if (u != null)
{
//用戶已存在
string name = u.username;
string qq = u.qq;
string email = u.email;
string face = u.headImg;
//context.Session["user"] = u;
HttpCookie cook;
string roles = "user"; //用戶角色
FormsAuthenticationTicket ticket = new FormsAuthenticationTicket(
1, name, DateTime.Now, DateTime.Now.AddMinutes(60), false, roles);
cook = new HttpCookie("mycook");
cook.Value = FormsAuthentication.Encrypt(ticket);
context.Response.Cookies.Add(cook);
//context.Response.Redirect("/index.html");
context.Response.Write(JsonMapper.ToJson(new { name = name, qq = qq, email = email, face = face }));
context.Response.End();
}
else
{
//不存在
JsonData jd = JsonMapper.ToObject(jsonstr);
string name = jd["nickname"].ToString();
string face = jd["figureurl_2"].ToString();
u = new Model.User() { headImg = face, username = name, openid = openid, email = "", qq = "" };
int resid = dal.Add(u); //添加到數據庫中
u.id = resid;
// context.Session["user"] = u;
HttpCookie cook;
string roles = "user"; //用戶角色
FormsAuthenticationTicket ticket = new FormsAuthenticationTicket(
1, name, DateTime.Now, DateTime.Now.AddMinutes(60), false, roles);
cook = new HttpCookie("mycook");
cook.Value = FormsAuthentication.Encrypt(ticket);
context.Response.Cookies.Add(cook);
//context.Response.Redirect("/index.html");
context.Response.Write(JsonMapper.ToJson(new { name = name, qq = "", email = "", face = face }));
context.Response.End();
}