django-allauth实现第三方登录
Web开发 . 2019/11/25发布 . shanyonggang_web . 我要评论 . 795阅读

前面我们已经实现了用户的登录和注册,但是在我们日常上网中遇到用户登录注册的网站是不是会有点烦,所以第三方登录就出现了,比如好多网站接入微博、微信、QQ、github等第三方登录,毕竟这些帐号都是我们日常用的,都已经注册过了,因此我们可以方便的使用这些第三方帐号进行个人网站的登录。Django-allauth作为一个强大的第三方库,它不仅包含一整套的本地注册、登录、管理的解决方案,还支持GitHub、Twitter、微博、微信甚至百度等几十种第三方登录方式,首先我们用自带的本地登录注册来代替我们之前写的登录注册

配置文件

        首先在自己的配置环境下安装django-allauth

pip install django-allauth

        接下来我们需要修改配置文件,在settings.py中添加如下代码

INSTALLED_APPS = [
    *******
    # 第三方登录模块app文件
    'django.contrib.sites',
    'allauth',
    'allauth.account',
    'allauth.socialaccount',
    # 可添加需要的第三方登录
    'allauth.socialaccount.providers.weibo',
    'allauth.socialaccount.providers.weixin',
    'allauth.socialaccount.providers.baidu',
    'allauth.socialaccount.providers.douban',
    'allauth.socialaccount.providers.github',
    'allauth.socialaccount.providers.gitlab',
    'allauth.socialaccount.providers.linkedin',
]
# 用户登录配置
SITE_ID = 1
# 用户登录跳转
LOGIN_REDIRECT_URL = '/'
# 用户退出跳转
ACCOUNT_LOGOUT_REDIRECT_URL = '/'

TEMPLATES = [
    {
        ...
        'OPTIONS': {
            'context_processors': [
                # allauth 启动必须项
                'django.template.context_processors.request',
            ],
        },
    },
]


AUTHENTICATION_BACKENDS = (
    # Django 后台可独立于 allauth 登录
    'django.contrib.auth.backends.ModelBackend',

    # 配置 allauth 独有的认证方法,如 email 登录
    'allauth.account.auth_backends.AuthenticationBackend',
)

        按照如上代码进行配置,可能有的配置已经在settings.py中配置完成,此时则不需添加,接下来我们需要进行urls.py的添加(在项目的主urls.py添加即可,不是在某个APP下),如下:

urlpatterns = [
    # 第三方登录
    re_path(r'^accounts/', include('allauth.urls')),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

        配置完成后进行数据迁移

python manage.py migrate

本地登录注册     

        此时就可以实现登录及注册,接下来我们美化登录、注册等模版,在自己的第三方安装库内找到登录注册的html,博主的login.html文件位置在

/env/lib/python3.6/site-packages/allauth/templates/account/login.html

        我们在自己项目的templates文件夹下新建account文件夹,将上面的login.html复制到此文件下,方便后续进行html的修改,在优化表单模块这块我们用了django-crispy-forms第三方库,同样先进行库的安装,采用pip安装即可,安装完成后在settings.py中配置,如下:

INSTALLED_APPS = [
    # 美化表单
    'crispy_forms',
]

        接下来我们修改login.html表单,让其比之前稍微美观点,具体代码如下:

{% extends "base.html" %}

{% load i18n %}
{% load crispy_forms_tags %}
{% load account socialaccount %}

{% block title %}用户登录 | 大圣的专属空间{% endblock %}

{% block content %}
<div class="container" style="text-align: center;">
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4">
            <h4>本地用户登录</h4>
            <br>
            <form class="login" method="POST" action="{% url 'account_login' %}">
                {% csrf_token %}
                 {{ form | crispy }}
                <a href="/accounts/password/reset/">忘记密码了?</a>
                <div class="text-right">
                    <button class="btn btn-primary" type="submit">登录</button>
                </div>
            </form>
            <br>
            {% get_providers as socialaccount_providers %}
            {% if socialaccount_providers %}
            <div class="socialaccount_ballot">
                <h4 class="mb-2 mt-4" style="border-top: #8f989f 1px solid;padding-top: 15px">第三方登录</h4>
                    <span style="font-size: 2.0em">
                        <a href="/accounts/github/login/?process=login"><i class="fab fa-github"></i></a>
                        <a href="/accounts/baidu/login/?process=login">baidu</a>
                        <a href="#"><i class="fab fa-weibo"></i></a>
                        <a href="#"><i class="fab fa-weixin"></i></a>
                        <a href=""><i class="fab fa-linkedin"></i></a>
                        <a href=""><i class="fab fa-gitlab"></i></a>
                    </span>

<!--                <ul class="socialaccount_providers">-->
<!--                    {% include "socialaccount/snippets/provider_list.html" with process="login" %}-->
<!--                </ul>-->
            </div>

<!--            {% include "socialaccount/snippets/login_extra.html" %}-->

<!--            {% else %}-->
<!--                <p>{% blocktrans %}If you have not created an account yet, then please-->
<!--                <a href="{{ signup_url }}">sign up</a> first.{% endblocktrans %}</p>-->
<!--            {% endif %}-->
        </div>
    </div>
</div>

<style>
    .login{
        text-align: left;
    }
</style>

{% endblock %}

        注意:美化表单需要引入

{% load crispy_forms_tags %}
# 表单处由{{ form }}改为如下:
{{ form | crispy }}

        最终样式如下图所示:

        接下来我们修改注册页面,进行注册时,我们需要进行邮箱的相关配置,具体的配置可查看博主的django配置邮件中遇到的坑,另外需要注意的是django-allauth所注册的账号与django内置的本地账号是通用的,也就是说通过内置User创建的账号,是可以通过django-allauth登录的,同样注册界面的样式修改同登录,此外还有其他页面均按照此方法修改样式即可。

第三方登录

        上面我们讲了本地注册登录,接下来我们来看第三方登录,博主以github登录为例进行讲解,没有guihub的码农不是好码农,作为一名合格的程序员,岂能没有一个github帐号,没有的话赶紧注册去吧!首先我们需要在GitHub注册OAuth,进入https://github.com/settings/applications/new,,如下:

        提交成功后我们即可获得Client IDClient Secret,这两个我们后续会用,具体如下:

        接下来我们进行django后台配置,登录后台我们发现有如下栏目:

        进入站点配置文件,如下:

        然后进入Social applications,添加一条applications如下:

        至此我们就可以实现github帐号来登录我们的网站,其他的国内第三方也可以接入,具体自己可搜索相关文件进行添加,国内的一般都需要身份验证,时间比较久,截至目前博主正在审核微博、QQ、百度等第三方登录。

allauth配置项    

        挑几个比较重要的讲一下。

    ACCOUNT_EMAIL_VERIFICATION = 'optional' / 'mandatory' / 'none':当其为mandatory时,本地注册的用户必须先验证邮箱才可以登录。optionalnone都不要求验证邮箱,区别是optional仍然会发送验证邮件,而none连认证邮件都不会发送。

    SOCIALACCOUNT_EMAIL_VERIFICATION = 'optional' / 'mandatory' / 'none':同理,但是作用于第三方账号的注册。

    ACCOUNT_AUTHENTICATION_METHOD = 'username_email' / 'user' / 'email':指定登录方法,即通过用户名、邮箱进行登录,或者两者均可。

    ACCOUNT_EMAIL_REQUIRED = True / False:注册本地用户时,是否必须填写邮箱。

       除此之外还有很多配置项,详细了解请查阅官方文档


  • 有疑问请在下方评论区留言,我会尽快回复。
  • Email私信我: 511248513@qq.com 或添加博主 微信
本文作者:shanyonggang_web
发布时间:2019年11月25日 11:22
许可协议: 署名-非商业性使用 4.0 国际许可协议
知识共享许可协议     转载请保留原文链接及作者
正在加载今日诗词....
您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请狠狠点击下面的


登录 后回复

当前共有4条评论


ShanYonggang3

测试下评论heart

2019-11-25 16:17

ShanYonggang3 ShanYonggang3

测试二级评论devil

2019-11-25 16:18

重生的S先僧 ShanYonggang3

我是用微博登陆

2019-11-25 20:23

zhuoqun527

博主,带我飞smiley

2019-11-25 18:09