一、前言
毕业在即,最近一直在给同学们代写毕业论文,因此很长时间没有登录简书。
有许多同学的毕业设计都是 '管理系统' 之类的,如果使用简单的网站登录设计就会显得千篇一律;而今每个人都拥有微信和QQ,倘若能使用这些账户登录自己的网站,就省掉很多功夫。
如果需要本文用到的软件或者素材,可以在留言区告知,本次是使用 'PHP' 进行搭建,当然偏向前端的同学们也可以查看 JS版 。
二、正文
简介
1.1. 接入效果
有很多的论坛使用 'Discuz' 等 'CMS' 建站,所以非常容易接入QQ登录,以下是网站接入成功之后的截图:接入效果图
1.2. 接入准备
'Session'机制
'File' 操作
所需的知识储备
硬件条件
本文所用软件清单以及操作环境
热身阶段
2.1 域名和云空间
2.2. 接着要去 QQ互联 注册成为开发者,选择 个人网站接入 (只需个人身份证)即可
注册开发者
2.3. 耐心等待审核之后就变身成为有B格的开发者了
成为开发者
2.4. 创建网站应用
创建网站应用
2.5. 填写应用基本资料 (注意图中标注的提示)
填写应用资料
2.6. 完善应用详细资料 (注意图中标注的提示)
填写详细资料
2.7. 又是接近24小时的审核,通过之后就可以在自己的 应用管理页 看到自己的网站应用,记录好应用的 'AppID'、'AppKey'、'回调域名',此后就只需要这三大信息。
应用审核通过
AppID + AppKey
在下推荐在阿里万网中购买域名,上面有我分享的优惠链接;(万网备案是需要阿里的ECS提供 备案号!)记得要选择 工信部 批准国内备案的域名后缀。
查询自己的域名备案信息,万网备案的效果如下图:(注意图中标注的提示)
备案信息
当然云空间的话就不推荐购买 阿里ECS 了,质量最好但是价格最贵,腾讯云 或者 新浪云 就非常亲民了。本文使用的是 爱名网 的 港澳虚拟主机 。
开发阶段(偏前端的同学可以查看 JS版 教程)
3.1. QQ互联 官网提供了 SDK 以及对应的 示例代码,但是为了帮助同学们更好理解,我进行了部分删减,力求最简单的方法实现目的。
官方SDK
3.2. 因为是写教程,所以代码就尽量简单明了一点。实际上 'PHP' 网站接入 'QQ登录' 非常简单,原则上只需要自己编辑如下图所示的 2个 'PHP' 脚本:
Code
callback.php # 用于【QQ互联】中已经通过审核的回调地址 index.php # 用于需要接入【QQ登录】的网站入口
3.3. 复制 QQ互联 官方 SDK 包中的 'API' 目录到自己的 'Web根目录',生成如下所示的 'Web目录' 结构:
# 'D:/www/website/'..............other statis................ ~~~~~/API <<<<<< 官方 SDK 中的文件夹 ......................other statis.............. ~~~~~callback.php <<<<<< 回调地址文件 ~~~~~index.php <<<<<< 网站入口
3.4. 在 'API' 的子目录 '/comm' 下新建 'inc.php',输入以下内容:
<?php die('forbidden'); ?> // 防止恶意访问文件内容,下面的内容不能使用换行符{"appid":"改成你自己的AppID","appkey":"改成你自己的AppKey","callback":"改成你已经通过审核的回调地址","scope":"get_user_info,add_share,list_album,add_album,upload_pic,add_topic,add_one_blog,add_weibo,check_page_fans,add_t,add_pic_t,del_t,get_repost_list,get_info,get_other_info,get_fanslist,get_idolist,add_idol,del_idol,get_tenpay_addr","errorReport":false,"storageType":"file","host":"localhost","user":"root","password":"root","database":"test"}
3.5. 在 'index.php' 文件中输入以下内容:
<?phprequire_once('./API/qqConnectAPI.php'); // 'qqConnectAPI.php'中已经启用了 sessionif (!empty($_SESSION['user_info'])) // 检查是否使用'QQ登录'过网站{ $qc=new QC; $qc->qq_login(); // 跳转到'QQ登录'的界面 exit; } $user=json_decode($_SESSION['user_info'],true); var_dump('$user');?>......................other HTML code..............
3.6. 在 'callback.php' 文件中输入以下内容:
<?php require_once('./API/qqConnectAPI.php'); define('USERLIST','./userList.json'); // 本地缓存登录的、已经授权网站的'QQ用户'$qc=new QC(); $access_token=$qc->qq_callback(); $open_id=$qc->get_openid();/** 非常重要的一行代码, 因为后面需要获取QQ用户的信息, 所以需要使用前面确认登录的、已经授权网站的'QC'实例 **/$qc=new QC($access_token,$open_id); $storage=[];if(is_file(USERLIST)) $storage=json_decode(file_get_contents(USERLIST),true);if(count($storage)){ if (array_key_exists($open_id,$storage)) { /** 检查当前用户是否自定义的过期时间 **/ if($storage[$open_id]['expires']>$_SERVER['REQUEST_TIME']){ $_SESSION['user_info']=json_encode([ 'username'=>$storage[$open_id]['username'], '_id'=>$storage[$open_id]['_id'] ]); header('http://www.example.com/index.php'); // 填写上面'index.php'对应的网站入口地址 exit; } } } $user_info=$qc->get_user_info(); // 获取'QQ用户'的基本信息$storage[$open_id]=[ 'accessToken'=>$access_token, 'username'=>$user_info["nickname"], 'expires'=>$_SERVER['REQUEST_TIME']+3600*3, '_id'=>strval($_SERVER['REQUEST_TIME']) // 自建'QQ用户ID',用于网站内部查询缓存 ]; $_SESSION['user_info']=json_encode([ 'username'=>$user_info['nickname'], '_id'=>$storage[$open_id]['_id'] ]); file_put_contents(USERLIST,json_encode($storage)); header('http://www.example.com/index.php'); // 填写上面'index.php'对应的网站入口地址exit;
3.7. 最后,再回过头去检查 '3.4小节' 提到的 'inc.php' 中设置的 'appid'、'appkey'、'callback' 是否与 QQ互联 中通过审核的网站应用信息一致。
测试阶段
4.1. 确认按照上面的步骤部署以后,因为在本地调试更加方便,所以有必要将 QQ互联 审核通过之后的网站域名解析到 本地DNS。
<VirtualHost *:8080> ServerName www.example.com DocumentRoot "D:/www/website"#**'Web目录'**DirectoryIndex index.php <Directory "D:/www/website"> Options Indexes FollowSymLinks Includes ExecCGI AllowOverride All Allow from all Order allow,deny Require all granted </Directory> </VirtualHost>
127.0.0.1 www.example.com
4.2. 现在,唤醒你的 'Chrome',优雅而熟练地敲入 www.example.com
,因为第一次访问没有 'Session',不出意料地会自动跳转到 'QQ授权登录页面'
QQ授权登录
4.3. 确认登录以后会跳转到 www.example.com/callback.php
,当然,你可以在 '3.6小节' 的时候添加一些 'HTML' 代码,让访问者在 www.example.com/callback.php
页停留的过程中可以看到一些友好的界面。如果同学们参考了我的代码,原则上是不会感觉在 www.example.com/callback.php
停留,访问者只会直接跳转回到 www.example.com
页面,也即完成了QQ登录的全部过程,然后打印出以下信息:
完成QQ登录
修改系统的 'hosts' 文件,添加一行代码:
在 'XAMPP' 的 'Apache' 虚拟配置文件 'httpd-vhost.conf' 中添加一个本地站点:
三、结语
在下的所有教程均是面向新手,更多有趣且简单的教程会在日后给出。
'PHP' 版和 'JS' 版有一个很大的不同,应该可以说是 'JS' 版的一个缺陷,具体内容可以查看在下的 JS版 教程。
欢迎联系在下,讨论建议都可以,之后会陆续发布其它的教程。
作者:我爱余倩
链接:https://www.jianshu.com/p/e28eb101c32b
共同學習,寫下你的評論
評論加載中...
作者其他優質文章