TeConnect

typecho第三方登录插件，可以让typecho博客系统支持第三方账号登录、注册的插件。

前言

该插件的最初始的版本为jiangmuzi/TeConnect，最后维护时间为2016年。

由大卫二次开发并修复：ledccn/TeConnect，最后维护时间为2020年。

后由白雾林开发并修复：baiwulin/ThirdLogin，最后维护时间为2023年。

本人于2024年年底，在使用过程中，结合上面三位作者的修改进行融合修复，修改了部分设置和功能融合，在此特别说明并向三位作者的贡献表示感谢。

关于3.0版更新，由于插件缺少第三方登录管理页面，用户无法管理已经绑定的第三方服务，特此再次更新这个插件，增加了管理页面，并且进行了美化。

截止2026年初，已开发新一版插件。请转至：适用于typecho的OAuth登录插件（第三方平台登录插件）

一、功能介绍

Typecho互联登录插件，目前已支持的第三方登录：QQ/微信/Github/Msn/Google/新浪微博/豆瓣/点点/淘宝网/百度。
后续会根据实际需要继续添加新的第三方接口，欢迎大家一起贡献。
如使用过程中遇到问题，可到这篇文章下留言，我会尽快解决。

二、插件下载

1.开源地址：https://github.com/tianlingzi/TeConnect
2.下载地址：https://github.com/tianlingzi/TeConnect/releases

三、安装步骤

1. 解压插件到 Plugins目录，插件目录名为“TeConnect”；；
2. 把TeConnect插件目录下的callback.php文件拷贝到当前使用的主题跟目录下面；
3. 在后台启用插件，并配置插件参数（方法见：参数配置 - 配置示例）；
4. 在当前使用主题的适当位置添加 TeConnect_Plugin::show()方法，代码：

<?php TeConnect_Plugin::show(); ?>

5. 下载你喜欢的png登录图标,放到/usr/plugins/TeConnect/login_ico/{type}.png,然后修改登录按钮样式在Plugin.php 第159行，代码：

<a href="{url}"><img src="/usr/plugins/TeConnect/login_ico/{type}.png" alt="{type}-{title}" style="margin-top: 0.8em;"></a>

6. 在第三方平台设置网站回调域，注意区分http、https（方法见：参数配置 - 配置示例）。
7. 如果您的主题开启了全站PJAX，需要把以下代码放入PJAX回调函数内：

/*PJAX时：来源页写入cookie*/
var exdate = new Date();
exdate.setDate(exdate.getDate() + 1);
document.cookie = "TeConnect_Referer=" + encodeURI(window.location.href) + "; expires=" + exdate.toGMTString() + "; path=/";

四、参数配置

配置示例

1：后台互联配置

具体格式为：type:appid,appkey,title，注释：

• type：第三方登录帐号类型
• appid：第三方开放平台申请的应用id
• appkey：第三方开放平台申请的应用key
• title：登录按钮的标题
  在后台互联配置中，直接以文本形式填写，一行为一个帐号系统的参数；
  为减少错误发生，您可以复制对应的 配置示例，把 APP_KEY和 APP_SECRET改成您自己的参数就可以了！
  例如：qq:APP_KEY,APP_SECRET,腾讯QQ
  改成：qq:101015836,547s87f8s7df7sd877ji75s78sdfd,腾讯QQ
  粘贴到后台 互联配置，即完成了腾讯QQ登录的配置，其他类型同理！

2：网站回调域配置

您可以复制对应的 配置示例，把 127.0.0.1改成您的域名，填写到第三方开发平台的网站回调域设置中，即可完成配置！

以本博客 www.tianlingzi.top,设置QQ登录，为例：
复制插件中给出的回调地址：https://www.tianlingzi.top/oauth_callback?type=qq

五、拓展

美化插件显示。使用一个白色背景框将登陆按钮独立出来。

<!-- ① 社交登录 -->
<div class="tc-social-wrapper">
    <?php TeConnect_Plugin::show(); ?>
</div>

<!-- ① 对应极简美化 -->
<style>
.tc-social-wrapper{
    margin:16px 0;
    padding:12px 24px;
    background:#fff;
    border-radius:6px;
    box-shadow:0 2px 6px rgba(0,0,0,.06);
    text-align:center;          /* 让内部按钮水平居中 */
}
/* 如果 TeConnect 按钮自带 margin，下面这句可防错位 */
.tc-social-wrapper *{margin:4px;}
</style>

六、v3.0版更新说明

在后台的“个人设置”页面中可以看到TeConnect设置，点击“打开管理页面”即可进入。