Хорошо, привет, ребята, сегодня еще одна важная тема, которая «должна быть» на любом известном нам веб-сайте, а именно, это система электронной почты для восстановления пароля.

В целом, я думаю, что каждый веб-сайт / приложение должны иметь эту систему восстановления из-за потребностей людей. Мы можем забыть пароль (это нормально), и мы, как пользователи, можем захотеть запомнить пароль, поэтому мы должны создать эту систему.

Конечно, для этого мы будем использовать библиотеку «DJANGO-ALLAUTH» из-за ее хорошей работы и популярности.

Давайте начнем!

просто установите в свою среду: «pip install django-allauth»

в settings.py добавьте:

    'allauth',
    'allauth.account'

Теперь перейдите по адресу: «http://127.0.0.1:8000/accounts/»» с помощью браузера.

Прежде всего, по адресу: http://127.0.0.1:8000/accounts/ вы найдете много ссылок, которые взяты из библиотеки django-allauth. У каждой ссылки есть своя задача, но в нашем выпуске мы сосредоточимся на → http://127.0.0.1:8000/accounts/password/reset/.

убедитесь, что вы внедрили в свой urls.py:

    path('accounts/', include('allauth.urls')),

важно не забыть это сделать, ладно?

если вам интересно, как выглядит мой views.py:

Помните о правильных установках в settings.py ваших SMPT настроек электронной почты.

Без этого набора электронные письма не будут отправлены.

Хорошо, в этом порядке создайте папку с именем «templates».

У нас много файлов, но давайте создадим еще одну папку в папке «templates» с именем «account».

и создайте 4 файла с этими именами:

password_reset_done.html
password_reset_from_key_done.html
password_reset_from_key.html
password_reset.html

Начнем с «password_reset.html».

<!DOCTYPE html>
<html>
<head>
  <title>Reset Password</title>
  {% load static %}
  <link rel="stylesheet" href="{% static 'styles/style.css' %}">
</head>
<body>
  <div class="container">
    <p>Forgot password?</p>
    <h2>Reset Password</h2>
    <form method="post">
      {% csrf_token %}
      {{ form.as_p }}
      <button type="submit">Reset password</button>
    </form>
  </div>
</body>
</html>

как видите, я подключил его к своему файлу style.css.

style.css:

body {
    font-family: Arial, sans-serif;
  }
.container {
  max-width: 400px;
  margin: 0 auto;
  padding: 20px;
  background-color: #f2f2f2;
  border: 1px solid #ccc;
  border-radius: 5px;
}
.container h2 {
  text-align: center;
}
.container form {
  margin-top: 20px;
}
.container form label {
  display: block;
  margin-bottom: 5px;
}
.container form input[type="text"],
.container form input[type="email"],
.container form input[type="password"] {
  width: 100%;
  padding: 10px;
  margin-bottom: 10px;
}
.container form button {
  width: 100%;
  padding: 10px;
  background-color: #4caf50;
  color: white;
  border: none;
  cursor: pointer;
}
.container form button:hover {
  background-color: #45a049;
}

и теперь, когда вы перейдете по адресу: http://127.0.0.1:8000/accounts/password/reset/», вы увидите:

Теперь введите свой адрес электронной почты, чтобы сбросить пароль, но помните, что адрес электронной почты, который вы хотите ввести, должен быть зарегистрирован ранее.

как вы можете видеть по адресу: http://127.0.0.1:8000/accounts/password/reset/done/». Я вижу белый экран без ничего.

Чтобы решить эту проблему, введите этот код в «password_reset_done.html» и сохраните.

<!DOCTYPE html>
<html>
<head>
  <title>Password Reset Done</title>
  {% load static %}
  <link rel="stylesheet" href="{% static 'styles/style.css' %}">
</head>
<body>
  <div class="container">
    <h2>Password Reset Done</h2>
    <p>We've emailed you instructions for setting your password, if an account exists with the email you entered. 
    You should receive them shortly.</p>
    <p>If you don't receive an email, please make sure you've entered the address you registered with, 
    and check your spam folder.</p>
  </div>
</body>
</html>

после сохранения обновите и посмотрите на результат:

Хорошо, давайте перейдем к электронной почте и проверим вашу электронную почту.

мы здесь! письмо пришло!

после нажатия у меня снова белый экран!

чтобы исправить это, перейдите к своему: «password_reset_from_key.html» и сохраните, а затем обновите.

<!DOCTYPE html>
<html>
<head>
  <title>Change password</title>
  {% load static %}
  <link rel="stylesheet" href="{% static 'styles/style.css' %}">
</head>
<body>
  <div class="container">
    <h2>Change Password</h2>
    <form method="post">
      {% csrf_token %}
      {{ form.as_p }}
      <button type="submit">Change password</button>
    </form>
  </div>
</body>
</html>

Это работает хорошо! продолжим.

Чтобы увидеть результаты, которые вы видите выше, измените: "password_reset_from_key_done.html"

<!DOCTYPE html>
<html>
<head>
  <title>Password Change Done</title>
</head>
<body>
  <div class="container">
    <h2>Password Change Successful</h2>
    <p>Your password has been set. You may go ahead and log in now.</p>
  </div>
</body>
</html>

Это круто, давайте проверим, работает новый пароль или нет.

Это хорошо работает!

Наш новый пароль установлен.