Search code examples
djangodjango-rest-frameworkdjango-allauthdjango-rest-auth

resetting password of user django rest auth


Good day, I am trying to override the password_reset_email of Django allauth. the issue is that it successfully overrides, but the data (password reset link, site name, and domain name) does not get passed to the email which eventually means that the user is not able to reset password because no link was sent.

my password reset serializer

class PasswordResetSerializer(PasswordResetSerializer):

    def get_email_options(self):
        return {
            'subject_template_name': 'account/email/password_reset_key_subject.txt',
            # 'email_template_name': 'account/email/password_reset_key.txt',
            'html_email_template_name': 'account/password_reset_key.html',
        }

In my templates/registration/password_reset_email.html

{% load i18n %}
{% autoescape off %}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Confirm Your E-mail</title>
    <style>
        .body {
            background-color: #f6f6f6;
            padding: 30px;
            display: flex;
            flex-direction: row;
            justify-content: center; 
            align-items: center;
        }

        .content {
            background-color: #FFFFFF;
            color: #4d4d4d;
            max-width: 400px;
            padding: 20px;
            margin: auto;
        }

        .title {
            font-size: 20px;
            font-weight: 600;
            margin: 10px 0;
            text-align: center
        }

        .intro {
            font-size: 15px;
            align-self: flex-start;
            color: #4d4d4d;
            margin-bottom: 15px;
        }

        .main-body {
            font-size: 15px;
            color: #4d4d4d;
            margin-bottom: 15px;
        }

        .alt-body {
            width: 100%;
            display: flex;
            flex-direction: row !important;
            justify-content: center !important;
        }

        .alt-body>a {
            font-size: 17px;
            font-weight: 500;
            text-decoration: none;
            color: #FFFFFF;
            margin: auto;
            margin-bottom: 15px;
        }

        .cta-button {
            background-color: #525659;
            padding: 9px 100px;
            border: 2px solid #525659;
            border-radius: 35px;
            align-self: center;
        }

        .cta-button:hover {
            background-color: #000000;
            border: 2px solid #000000;
        }

        .sub-body {
            font-size: 15px;
            color: #4d4d4d;
            margin-bottom: 15px;
            margin-top: 0;
            align-self: flex-start;
        }

        .sub-body a {
            text-decoration: none;
            color: #4d4d4d;
            font-size: 15px;
        }

        .sub-body a:hover {
            text-decoration: none;
            color: #4d4d4d;
        }

        .outro {
            margin: 20px 0;
        }

        .outro > p {
            font-size: 15px;
            margin-top: 3px;
            margin-bottom: 3px;
        }

        .outro a {
            text-decoration: none;
            color: #4d4d4d;
            font-size: 15px;
            margin-top: 3px;
            margin-bottom: 3px;
        }

        .outro a:hover {
            text-decoration: none;
            color: #4d4d4d;
        }
    </style>
</head>
<body class="body">
    <div class="content">
        {% blocktrans with site_name=current_site.name site_domain=current_site.domain %}

        <p class="title">Email Verification</p>

        <p class="intro">Hello there,</p>

        <p class="main-body">
            Simply click on the button to verify your cre8ive-mart email.
        </p>

        <div class="alt-body">
            <a href="{{ activate_url }}" class="cta-button">Verify Email</a>
        </div>

        <p class="sub-body">
            if you have any questions, please contact <a href="mailto:[email protected]">[email protected]</a>
        </p>

        <div class="outro">
            <p class="outro-greeting">Sincerely,</p>
            <p class="outro-main">cre8ive-mart</p>
            <a href="#" class="outro-website">cre8ivemart.com</a>
        </div>

        {% endblocktrans %}
    </div>
</body>
</html>
{% endautoescape %}

using any of the password reset serializers yields the same result of not sending the data.


Solution

  • Hm, so here are my 2ct on this. I really don't know what {{ activate_url }} is suppose to mean? Do you pass it as an extra piece of context?

    If not than you obviously have to define it somewhere. The original template constructs the activate url like this:

    {{ protocol }}://{{ domain }}{% url 'password_reset_confirm' uidb64=uid token=token %}
    

    Note, that all the variables in here come from the PasswordResetForm's save method from django.contrib.auth.forms. If you need to pass some extra context to your template you can use extra_email_context for this like so:

    class PasswordResetSerializer(PasswordResetSerializer):
    
        def get_email_options(self):
            request = self.context.get('request')
            domain = request.get_host()
            return {
                'subject_template_name': 'account/email/password_reset_key_subject.txt',
                'email_template_name': 'account/email/password_reset_key.txt',
                'extra_email_context': {'parsed_domain': domain},
                'html_email_template_name': 'account/password_reset_key.html',
            }