django利用邮箱发送验证码,需要邮箱能够接受验证码,需要邮箱申请授权码,我以qq邮箱举例
第一步:
进入邮箱界面,设置------->账户-------->然后找到这个地方
开启服务,根据提示,开启之后,就会有一个授权码,记住这个授权码,!!!!!!
第二步
settings配置
EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'EMAIL_HOST = '' # SMTP 服务器地址EMAIL_PORT = 25 # SMTP服务的端口号EMAIL_HOST_USER = '24xxxxxxxx15@' # 邮件发送者的邮箱 EMAIL_HOST_PASSWORD = 'cxxxxxxxxxxxxh' # 你申请的授权码(略)EMAIL_USE_TLS = True # 与SMTP服务器通信时,是否启用安全模式# 发送者 <只能是自己的邮箱> 这个就是收件人看到的你的名字# EMAIL_FROM = 'python后端开发<ymq1980xxxxx852@>'
第二步
配置路由
from app01 import viewsurlpatterns = [path('admin/', admin.site.urls),path('get_code/', views.get_code)]
第三步views.py
def t6(request):subject = 'python开发之路' # 主题from_email = settings.EMAIL_FROM # 发件人,在settings.py中已经配置receiver = ['24XXXXXX15@'] # 邮件接收者列表code = ''for i in range(5):font_uppr = chr(random.randint(65, 90))font_lower = chr(random.randint(97, 122))font_int = str(random.randint(0, 9))# 从上面随机选出来一个tmp = random.choice([font_uppr, font_int, font_lower])code += tmp# request.session['code'] = code# 发送的消息message = code # 发送普通的消息使用的时候message# meg_html会覆盖message,如果有标签,推荐用meg_htmlmeg_html = '<a href="">点击跳转</a>'# subject 标题 message 内容 from_email 发送人 recipient_list 接收人(多个)send_mail(subject=subject, from_email=from_email, recipient_list=receiver, message=message)# send_mail(subject=subject, from_email=from_email, recipient_list=receiver, html_message=meg_html, message=message)return HttpResponse('ok')
点击发送验证码之后,
前端js
// 计时器function smsWait() {// 获取button按钮var $smsBtn = $('#btnSms');// 给框加禁止使用的属性$smsBtn.prop('disabled', true);// time = 60var time = 60;// 函数var remind = setInterval(function () {// 给button按钮添加文本$smsBtn.val('请等待' + time + '后,重新发送');// 自减time = time - 1;// 当time<1,停止函数,恢复按钮if (time < 1) {// 清除函数clearInterval(remind)$smsBtn.val('点击获取验证码').prop('disabled', false);}}, 1000)}
验证码发送的js部分
function clickBtnSms() {$('#btnSms').click(function () {{#$('.error-msg').empty();#}{#alert('llllll')#}// 异步提交// 局部刷新$.ajax({url: "{% url 'send_email_code' %}",type: "GET",data: {email: $('#id_email').val()},dataType: "JSON",// 服务端返回的数据自动反序列化成字典,ajax自动帮你转化了,如果是JsonResponse的话,但是加上保险success: function (res) {if (res.status === 1) {{#console.log(res)#}// 定时器效果smsWait();} else {// 错误信息渲染 {mobile_phone: ['手机号格式错误!']}// 错误时当前input框变红$.each(res.msg, function (key, value) {$('#id_' + key).addClass('red_input').next().text(value[0])// attr 只有添加的一个属性 其他的全部消失 addClass 在原有的基础上添加类})}}})// 获取焦点 input红框消失 this: 当前操作的对象$('input').focus(function () {$(this).removeClass('red_input').next().empty()})})}