发送邮件设置
Django 内置了非常方便的发送邮件的功能,不过需要在 settings.py 中做一些简单配置。
生产环境下通常需要使用真实的邮件发送服务器,配置步骤会比较多一点。
不过 Django 为开发环境下发送邮件提供了一些方便的 Backends 来模拟真实邮件的发送,例如直接发送邮件到终端。
在 settings.py 中加入以下设置:
EMAIL_BACKEND = 'django.core.mail.backends.console.EmailBackend'
这样 Django 将把邮件发送到终端。
编写重置密码模板
重置的视图函数默认渲染的模板名为 password_reset_form.html,因此首先在 registration/ 下新建一个 password_reset_form.html 文件.
此外,修改一下重置密码按钮的超链接属性:
registration/login.html
...
<div class="flex-left top-gap text-small">
<div class="unit-2-3"><span>没有账号?<a href="{% url 'users:register' %}">立即注册</a></span></div>
<div class="unit-1-3 flex-right"><span><a href="{% url 'password_reset' %}">忘记密码?</a></span></div>
</div>
编写一个发送邮件的页面
首先在 registration/ 下新建一个password_reset_form.html 文件:
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>重置密码</title> <link rel="stylesheet" href="https://unpkg.com/mobi.css/dist/mobi.min.css"> <style> .errorlist { color: red; } </style> </head> <body> <div class="flex-center"> <div class="container"> <div class="flex-center"> <div class="unit-1-2 unit-1-on-mobile"> <h1><a href="{% url 'blog:index' %}">千峰博客</a></h1> <h3>重置密码</h3> <form class="form" action="{% url 'password_reset' %}" method="post"> {% csrf_token %} {{ form.non_field_errors }} {% for field in form %} {{ field.label_tag }} {{ field }} {{ field.errors }} {% if field.help_text %} <p class="help text-small text-muted">{{ field.help_text|safe }}</p> {% endif %} {% endfor %} <button type="submit" class="btn btn-primary btn-block">提交</button> </form> </div> </div> </div> </div> </body> </html>
编写邮件发送成功页面模板
用户在重置密码页面输入注册时的邮箱后,Django 会把用户跳转到邮件发送成功页面.
该页面渲染的模板为 password_reset_done.html,因此再添加一个密码修改成功页面的模板.<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>密码重置链接已经发送</title> <link rel="stylesheet" href="https://unpkg.com/mobi.css/dist/mobi.min.css"> </head> <body> <div class="flex-center"> <div class="container"> <div> <h1 class="logo"><a href="{% url 'blog:index' %}">千峰博客</a></h1> <h3>密码重置链接已经发送</h3> <p> 如果您输入的邮件地址所对应的账户存在,设置密码的提示已经发送邮件给您,您将很快收到。 </p> <p> 如果你没有收到邮件, 请确保您所输入的地址是正确的, 并检查您的垃圾邮件文件夹. </p> </div> </div> </div> </body> </html>
编写设置新密码页面模板
在接收到的重置密码邮件中有一个设置新密码的链接,点击该链接就会跳转到给账户设置新密码的页面,以便用户给已忘记密码的账户设置一个全新的密码。
该页面渲染的模板为 password_reset_confirm.html<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>设置新密码</title> <link rel="stylesheet" href="https://unpkg.com/mobi.css/dist/mobi.min.css"> <style> .errorlist { color: red; } </style> </head> <body> <div class="flex-center"> <div class="container"> <div class="flex-center"> <div class="unit-1-2 unit-1-on-mobile"> <h1><a href="{% url 'blog:index' %}">千峰博客</a></h1> <h3>设置新密码</h3> <form class="form" method="post"> {% csrf_token %} {{ form.non_field_errors }} {% for field in form %} {{ field.label_tag }} {{ field }} {{ field.errors }} {% if field.help_text %} <p class="help text-small text-muted">{{ field.help_text|safe }}</p> {% endif %} {% endfor %} <button type="submit" class="btn btn-primary btn-block">提交</button> </form> </div> </div> </div> </div> </body> </html>
编写设置新密码成功页面模板
用户在设置新密码页面输入新密码后,Django 会把用户跳转到设置新密码成功页面.
该页面渲染的模板为 password_reset_complete.html,因此再添加一个设置新密码成功页面的模板.<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>新密码设置成功</title> <link rel="stylesheet" href="https://unpkg.com/mobi.css/dist/mobi.min.css"> </head> <body> <div class="flex-center"> <div class="container"> <div> <h1 class="logo"><a href="{% url 'blog:index' %}">千峰博客</a></h1> <h3>新密码设置成功</h3> <p> 你的口令己经设置。现在你可以继续进行登录。 </p> </div> </div> </div> </body> </html>