PC-side QQ Login Integration (JS mode) Novice Recommendation

1. You need a test app (AppID after the creation is complete)
1. Attach your own created application details, my appid is 101303571

Because your local project TX is inaccessible, the development testing phase needs to map your project to the public web, where a free penetration tool is recommended. URL http://natapp.cn/

Download the corresponding client decompression, go into the folder in the directory to open command prompt cmd

Ngrok-config ngrok.cfg-subdomain MyApp 80

MyApp custom domain name, 80 is the native port that needs to be mapped to

Access using http://myapp.ngrok.natapp.cn

1. Of course, after creating the app you can go to HTTP://CONNECT.QQ.COM/INTRO/LOGIN/JSSDK generate style and JS code
1. The point is to add the appropriate JS code on your login page or homepage.

1): <meta property= "Qc:admins" content= "217507737764534637566727366141006367"/>

2): Place an HTML code, that is, the QQ login button, ID must be unique <span id= "qqloginbtn" ></span>

3): Next use the QQ package good JS processing

<script type= "Text/javascript" >

Qc. Login ({

Btnid: Node ID for "QQLOGINBTN"//Insert button

});

Qc. Login ({

Btnid: "Qqloginbtn",//HTML tag ID of the Insert button

Size: "B_m",//button size

Scope: "Get_user_info",//display authorization, all available authorizations can fill all

Display: "PC"//application scenario, optional

},function (Reqdata, opts) {//Login successful

Replace the button display state method based on the return data

var dom = document.getElementById (opts[' Btnid ')),

_logouttemplate=[

Avatar

' <span></span> ',

Nickname

' <span>{nickname}</span> ',

Exit

' <span><a href= ' JAVASCRIPT:QC. Login.signout (); " > Exit </a></span> '

].join ("");

Dom && (dom.innerhtml = QC. String.Format (_logouttemplate, {

Nickname:qc. String.eschtml (Reqdata.nickname),//Do XSS filtering

Figureurl:reqData.figureurl

}));

Qc. Login.getme (function (openId, Accesstoken) {

Alert (["Current logged-in user's", "OpenId:" +openid, "Accesstoken:" +accesstoken].join ("\ n"));

//});

You can call your own save interface here.

//...

}, function (opts) {//Logout succeeded

Alert (' QQ login logout successful ');

}

);

</script>

We're done with our Login entry page, so let's look at the callback page.

Because it is development. This page of mine just a bit of code

<script type= "Text/javascript" src= "Http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" charset= "Utf-8" Data-callback= "true" ></script>

<script type= "Text/javascript" >

</script>

<p> welcome you. </p>

Isn't it simple!

PC-side QQ Login Integration (JS mode) Novice Recommendation