I have a weird problem where my allauth email will send to verify new user email address but no email will send for resetting the password. I have checked the gmail account from which the email should be sent but it only shows the verification emails as sent, its as though nothing is being done when the user clicks the reset password button on the template side. I'm not sure what I am missing..
My template
<body class="login-page container-fluid">
<div class="row vygr-login">
<div class="user_card">
<div class="container-fluid h-100">
<div class="row h-100">
<div class="form_container col vygr-signup-container">
{% load i18n %}
<form class="signup" method="POST" action="{% url 'account_login' %}">
{% if user.is_authenticated %}
{% include "account/snippets/already_logged_in.html" %}
{% endif %}
<p class="registration-element" style="font-size: 2rem;">{% trans "Trouble Logging In?" %}</p>
<p class=" registration-element">{% trans "Enter your email and we'll send you a link to get back into your account." %}</p>
<form method="POST" action="{% url 'account_reset_password' %}" class="password_reset">
{% csrf_token %}
{% for field in form %}
{{ field }}
{% endfor %}
<input class="signup-button" type="submit" value="{% trans 'Reset My Password' %}">
<p class="" style="text-align: center;">{% blocktrans %}Please contact us if you have any trouble resetting your password.{% endblocktrans %}</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
Related
I am trying to create a login form in django that accepts either username or email. I made custom authentication backend and it does work. Problem is in HTML input type. The form method is POST and i did write csrf_token tag, but if i set input type to text, than when i try to login with username everything works, but when i put email in it, i get an error: CSRF verification failed. Request aborted. And if i set type to email, than i can't put username in. My django version is 4.0.6 and python version is 3.10.4
Add this in urls.py file
path('', include('django.contrib.auth.urls')),
Add this in your HTML template
{% extends 'registration/base.html' %}
{% block title %} Login {% endblock title %}
{% load crispy_forms_tags %}
{% block body %}
<h4>Hello! let's get started</h4>
<h6 class="font-weight-light">Sign in to continue.</h6>
<form class="pt-3" method="post">
{% csrf_token %}
{{ form|crispy }}
<div class="mt-3">
<button class="btn btn-block btn-primary btn-lg font-weight-medium auth-form-btn">SIGN IN</button>
</div>
<div class="my-2 d-flex justify-content-between align-items-center">
<div class="form-check">
<label class="form-check-label text-muted">
<input type="checkbox" class="form-check-input"> Keep me signed in </label>
</div>
Forgot password?
</div>
<div class="text-center mt-4 font-weight-light">
</div>
</form>
I have customized the login template of allauth with bootstrap styles and widget_tweaks. When I try logging in with that template, It doesn't redirect me to the home page but remains in the same login.html template. However, when I log in with the original template from allauth in /account/login.html/ everything works well and it redirects me to my homepage. There is something that I'm not customizing right in my custom login.html template.
Below is django-allauth login.html and my custom login.html
django-allauth login.html
{% extends "account/base.html" %}
{% load i18n %}
{% load account socialaccount %}
{% block head_title %}{% trans "Sign In" %}{% endblock %}
{% block content %}
<h1>{% trans "Sign In" %}</h1>
{% get_providers as socialaccount_providers %}
{% if socialaccount_providers %}
<p>{% blocktrans with site.name as site_name %}Please sign in with one
of your existing third party accounts. Or, sign up
for a {{ site_name }} account and sign in below:{% endblocktrans %}</p>
<div class="socialaccount_ballot">
<ul class="socialaccount_providers">
{% include "socialaccount/snippets/provider_list.html" with process="login" %}
</ul>
<div class="login-or">{% trans 'or' %}</div>
</div>
{% include "socialaccount/snippets/login_extra.html" %}
{% else %}
<p>{% blocktrans %}If you have not created an account yet, then please
sign up first.{% endblocktrans %}</p>
{% endif %}
<form class="login" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
{{ form.as_p }}
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
{% endif %}
<a class="button secondaryAction" href="{% url 'account_reset_password' %}">{% trans "Forgot Password?" %}</a>
<button class="primaryAction" type="submit">{% trans "Sign In" %}</button>
</form>
{% endblock %}
my custom login.html
{% comment %}
{% extends "layouts/base-fullscreen.html" %}
{% load i18n %}
{% block title %} Login {% endblock %}
{% load widget_tweaks %}
{% block content %}
<div class="auth-wrapper">
<div class="auth-content">
<div class="auth-bg">
<span class="r"></span>
<span class="r s"></span>
<span class="r s"></span>
<span class="r"></span>
</div>
<div class="card">
<div class="card-body text-center">
<div class="mb-4">
<i class="feather icon-unlock auth-icon"></i>
</div>
<h3 class="mb-4">Login</h3>
<span class="mb-0 text-muted">
{% if msg %}
{{ msg | safe }}
{% else %}
Add your credentials
{% endif %}
</span>
<br />
<br />
<form method="post" action="{% url 'account_login' %}">
{% csrf_token %}
<div class="md-form mb-2">
{% render_field form.login class="form-control" placeholder=form.login.label %}
</div>
<span class="text-error">{{ form.login.errors }}</span>
<div class="md-form mb-2">
{% render_field form.password class="form-control" placeholder=form.password.label %}
</div>
<span class="text-error">{{ form.password.errors }}</span>
<p class="mb-0 text-muted"><a class="button secondaryAction" href="{% url 'account_reset_password' %}">Forgot password?</a>
</p>
<div class="form-group text-left">
<div class="checkbox checkbox-fill d-inline">
<!-- <input type="checkbox" name="checkbox-fill-1" id="checkbox-fill-a1" checked=""> -->
{% render_field form.remember class="form-control" placeholder=form.remember.label type="checkbox"%}
<label for="id_remember" class="cr"> Remember me</label>
</div>
</div>
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
{% endif %}
<button type="submit" name="login" class="btn btn-primary shadow-2 mb-4">Login</button>
</form>
<p class="mb-0 text-muted">Don’t have an account? <a href="{% url 'account_signup' %}" >Signup</a></p>
<br />
</div>
</div>
</div>
</div>
{% endblock content %}
allauth settings in settings.py
LOGIN_REDIRECT_URL = '/'
EMAIL_BACKEND = 'django.core.mail.backends.console.EmailBackend'
SITE_ID = 1
ACCOUNT_LOGOUT_REDIRECT_URL = '/' #couterpart to Django's LOGIN_REDIRECT_URL
ACCOUNT_LOGOUT_REDIRECT = '/'
ACCOUNT_USERNAME_REQUIRED = False
ACCOUNT_AUTHENTICATION_METHOD = 'email'
ACCOUNT_EMAIL_REQUIRED = True
ACCOUNT_UNIQUE_EMAIL = True
ACCOUNT_EMAIL_VERIFICATION = 'optional'
The other change I've made is to customize the allauth signup form to take extra two fields (first_name and last_name). That one works fine and redirects to the login url
you might be getting an error from the form validator. keep the original form on the page to check if its giving any errors. copy the {{ form.as_p }} from the original page 'accounts/login.html' and paste it in your custom template. if there are any errors, it'll display it.
this right here is your problem
{% extends "account/base.html" %}
If you have all the boostrap, jquery and widget_tweaks in your local base.html, then thats what you need to extend. The default accounts/base.html provided by django-allauth, does not come customized with bootstrap.
Use:
{% extends "base.html" %} instead
I am using the django all-auth login form. I wanted to customize the look of the form fields so I changed login.html within the account folder to look like this:
<form class="login" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
{% for field in form.visible_fields|slice:'2' %}
<div class="row form-group">
{% if field.name == 'login' %}
<input type="text" placeholder="Email"><i class="fas fa-at"></i>
{% else %}
<input type="password" placeholder="Password"><i class="la la-lock"></i>
{% endif %}
</div>
{% endfor %}
Forgot Password?
<button type="submit">Sign In</button>
</form>
The form renders exactly how I would like it to, however nothing happens when I click on submit. What is strange to me is that the form submits perfectly fine if in place of my for loop I simply type {{ form.as_p }}, it just doesn't look how I want. Can anyone see an error in my loop, or is there something else wrong here. I have been looking for a solution online but so far been unsuccessful
You need to specify the names of the fields in your input tags otherwise the POST dictionary will be empty. You are using {% if field.name == 'login' %} but you forgot to specify the name attribute. Same applies for the password input.
<form class="login" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
{% for field in form.visible_fields|slice:'2' %}
<div class="row form-group">
{% if field.name == 'login' %}
<input name='login' type="text" placeholder="Email"><i class="fas fa-at"></i>
{% else %}
<input name='password' type="password" placeholder="Password"><i class="la la-lock"></i>
{% endif %}
</div>
{% endfor %}
Forgot Password?
<button type="submit">Sign In</button>
</form>
I'm getting CSRF verification failed. Request aborted. after I try signing in, even though I've provided the {% csrf_token %} template tag.
templates/registration/login.html
{% extends "base.html" %}
{% block content %}
<div class="container">
<div class="card">
{% if form.errors %}
<p>Your username and password didn't match. Please try again.</p>
{% endif %}
{% if next %}
{% if user.is_authenticated %}
<p>Your account doesn't have access to this page. To proceed,
please login with an account that has access.</p>
{% else %}
<p>Please login to see this page.</p>
{% endif %}
{% endif %}
<form method="post" action="{% url 'login' %}">
{% csrf_token %}
{{ form|crispy }}
<button type="submit" class="btn btn-success"><i class="fas fa-sign-in-alt"></i> Login</button>
<input type="hidden" name="next" value="{{ next }}" />
</form>
{# Assumes you setup the password_reset view in your URLconf #}
<p>Lost password?</p>
</div>
</div>
{% endblock content %}
I know there are multiple questions like this around, but none of them contain a clear answer. I am using the default authentication from Django, but have trouble displaying something like 'Your username/password combination is incorrect'. Is it possible to fix this without making a custom view function?
My urls.py looks like this:
url(r'^login/$', auth_views.login, {'template_name': 'login.html'},
name='mysite_login')
Then my login.html has the following code:
{% block content %}
<section class="content">
<div class="container block">
<div class="row">
<div class="col-md-12"></div>
<form action="{% url 'mysite_login' %}" class="form-control" method="post" accept-charset="utf-8">
{% csrf_token %}
{% for field in form %}
<p>
{{ field.label_tag }}<br>
{{ field|addcss:'form-control' }}
{% if field.help_text %}
<small style="color: grey">{{ field.help_text|safe }}</small>
{% endif %}
{% for error in field.errors %}
<p style="color: red">{{ error }}</p>
{% endfor %}
</p>
{% endfor %}
<button type="submit" class="btn btn-dark">Login</button>
<input class="form-control" type="hidden" name="next" value="{{ next }}"><br>
</form>
</div>
</div>
</div>
</section>
{% endblock %}
So this all works, except for displaying the error messages. I've seen answers where you can write a custom view function and form to fix this, but I assume it should be also possible while using the build-in login functionality right? Thanks a lot.
The built-in login form doesn't display errors at an individual field level; it's a security risk to say that just the password is wrong, because it confirms the existence of a particular username. So the errors are raised in the general clean() method and are displayed in the template via {{ form.non_field_errors }}.