So schließen Sie die E-Mail-Benutzerregistrierung und Kontoaktivierung über Ajax in Django ab

不言
Freigeben: 2018-04-17 11:43:34
Original
2507 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich vorgestellt, wie Django die E-Mail-Benutzerregistrierung und Kontoaktivierung über Ajax durchführt. Jetzt teile ich ihn mit Ihnen und gebe ihn als Referenz. Werfen wir gemeinsam einen Blick darauf

1. In pycharm, Datei====》Einstellungen====》Projekt:Projektname====》Projektinterpreter====》+====》Suche django-simple-captcha Version auswählen 0,55 oder höher, dann klicken Sie auf die Schaltfläche „Paket installieren“, um

zu installieren. 2. Fügen Sie Code zu Projektname/urls.py hinzu:

3. Fügen Sie Registrierungsinformationen in „settings.py“ hinzu

4. Öffnen Sie das Terminal und führen Sie den Befehl „Datenbank aktualisieren“ aus:
from django.urls import path,include
......

from users.views import IndexView
......

urlpatterns = [
  ......
  
  #配置验证码

  path('captcha/',include('captcha.urls')),
  #首页url
  path('', IndexView.as_view(), name='index'),

  ......
]
Nach dem Login kopieren

5. Erstellen Sie eine neue form.py-Datei im Benutzerverzeichnis:
INSTALLED_APPS = [

    ......
  
  'captcha'
]
Nach dem Login kopieren

6. In „Benutzer“/Code zu „views.py“ hinzufügen:
python manage.py makemigrations
python manage.py migrate
Nach dem Login kopieren
Nach dem Login kopieren

7. Zeigen Sie den Bestätigungscode und das Eingabefeld im Front-End-Homepage-Index an. html
from django import forms
from captcha.fields import CaptchaField
......


class RegisterForm(forms.Form):
  """注册信息的验证"""

  ......

  captcha=CaptchaField(error_messages={'invalid':'验证码错误'})

  ......
Nach dem Login kopieren

html

from users.form import RegisterForm


class IndexView(View):
  """首页"""
  def get(self,request):
    register_form=RegisterForm()
    return render(request,'index.html',{'register_form':register_form})
Nach dem Login kopieren

css

js bezieht sich auf die Aktualisierung des Bestätigungscodes (jQuery muss zuerst eingeführt werden)
<p class="modal fade" id="register" tabindex="-1" role="dialog">

  ......

<!--模态框中关于注册的内容start-->
   <p class="modal-body">
    ......
      
      <P><p style="display: inline-block;width:100px;text-align: center"><b >验证码:</b></p>

<!--验证码start-->

      <p class="cap">{{ register_form.captcha }}</p>

<!--验证码end-->

</P>
      {% csrf_token %}
    </form>
     <p><p style="margin-left: 100px;background-color: orangered;width:150px;text-align: center"><b></b></p></p>
   </p>

<!--模态框中关于注册的内容end-->

  ......
Nach dem Login kopieren

<style>
  .cap{
    display: inline-block;
    width: 280px;
    height: 36px;
  }
  .cap img{
    float: right;
  }
</style>
Nach dem Login kopieren

2. Ajax-E-Mail-Registrierung

1 .Der an die Registrierung im Frontend gebundene modale Boxcode lautet wie folgt:

$(function(){
    $(&#39;.captcha&#39;).css({
    &#39;cursor&#39;: &#39;pointer&#39;
  });
  /*# ajax 刷新*/
    $(&#39;.captcha&#39;).click(function(){
      console.log(&#39;click&#39;);
      $.getJSON("/captcha/refresh/",function(result){
        $(&#39;.captcha&#39;).attr(&#39;src&#39;, result[&#39;image_url&#39;]);
        $(&#39;#id_captcha_0&#39;).val(result[&#39;key&#39;])
      });
    });
  })
Nach dem Login kopieren
html

CSS

JS-Code im Zusammenhang mit der Ajax-Registrierung:
<p class="modal fade" id="register" tabindex="-1" role="dialog">

 ......
   
   <p class="modal-body">
    <form id="registerform" action="#" method="post">
      <p>
        <p class="re-input"><b>用户名:</b></p>
        <input type="text" name="user" placeholder="用户名">
        <p class="msg"><b id="user-msg"></b></p>
      </p>
      <p>
        <p class="re-input"><b>邮箱:</b></p>
        <input type="text" name="email" placeholder="邮箱">
        <p class="msg"><b id="email-msg">2222</b></p>
      </p>
      <p>
        <p class="re-input"><b >密码:</b></p>
        <input type="password" name="pwd" placeholder="密码(不少于6位)">
        <p class="msg"><b id="pwd-msg">222</b></p>
      </p>
      <p>
        <p class="re-input"><b >确认密码:</b></p>
        <input type="password" name="pwd2" placeholder="确认密码">
        <p class="msg"><b id="pwd-msg2">22</b></p>
      </p>
      <P><p class="re-input"><b >验证码:</b></p>
        <p class="cap">{{ register_form.captcha }}</p>
        <p class="msg"><b id="captcha-msg">2</b></p>
      </P>
      {% csrf_token %}
    </form>
     <p><p style="margin-left: 100px;color: white;background-color: green;width:180px;text-align: center"><b id="active-msg"></b></p></p>

   ......

    <button type="button" class="btn btn-primary" id="registerbtn">确认注册</button>

   ......
Nach dem Login kopieren

JS-Code zur Verbesserung der Benutzerinteraktionserfahrung:
<style>
  .cap{
    display: inline-block;
    width: 280px;
    height: 36px;
  }
  .cap img{
    float: right;
  }
  .re-input{
    display: inline-block;
    width:100px;
    text-align: center
  }
  .msg{
    margin-left: 100px;
    background-color: orangered;
    width:180px;
    text-align: center
  }
</style>
Nach dem Login kopieren

2.users/form.py-Code: (Der zu überprüfende Feldname muss mit dem Namenswert des Front-End-Eingabefelds übereinstimmen!)
$("#registerbtn").click(function() {
    $.ajax({
      cache:false,
      type:"POST",
      url:"{% url &#39;users:register&#39; %}",
      dataType:&#39;json&#39;,
      data:$(&#39;#registerform&#39;).serialize(),
      //通过id找到提交form表单,并将表单转成字符串
      async:true,
      //异步为真,ajax提交的过程中,同时可以做其他的操作
      success:function (data) {
        //jquery3以后,会将回传过来的字符串格式的data自动json解析不用再使用一遍JSON.parse(data)了,不然反而会在控制台报错
        if(data.status){
          $(&#39;#active-msg&#39;).html(data.status);

        } else{
          if(data.user){
            username_msg=data.user.toString();
            $(&#39;#user-msg&#39;).html(&#39;用户名&#39;+ username_msg);
          }
          if(data.email){
            email_msg=data.email.toString();
            $(&#39;#email-msg&#39;).html(&#39;邮箱&#39;+ email_msg);
          }
          if(data.pwd){
            password_msg=data.pwd.toString();
            $(&#39;#pwd-msg&#39;).html(&#39;密码&#39;+ password_msg);
          }
          if(data.captcha){
            captcha_msg=data.captcha.toString();
            $(&#39;#captcha-msg&#39;).html(captcha_msg);
          }
          msg=data.__all__.toString();
          $(&#39;#active-msg&#39;).html(msg);

        }
      }
    });
  });
Nach dem Login kopieren

3.users/views.py Code für die Registrierung:
$("input").bind(&#39;input propertychange&#39;, function() {
    $(&#39;#login-fail&#39;).html(&#39;&#39;);
    $(&#39;#user-msg&#39;).html(&#39;&#39;);
    $(&#39;#email-msg&#39;).html(&#39;&#39;);
    $(&#39;#pwd-msg&#39;).html(&#39;&#39;);
    $(&#39;#pwd-msg2&#39;).html(&#39;&#39;);
    $(&#39;#captcha-msg&#39;).html(&#39;&#39;);
  });
Nach dem Login kopieren

4. Konfigurieren Sie die Registrierungsroute „users/urls.py“:
from django import forms
from captcha.fields import CaptchaField
from .models import UserProfile


class RegisterForm(forms.Form):
  """注册信息的验证"""
  user = forms.CharField(required=True, error_messages={&#39;required&#39;: &#39;用户名不能为空.&#39;})
  email=forms.EmailField(required=True,error_messages={&#39;required&#39;: &#39;邮箱不能为空.&#39;})
  pwd = forms.CharField(required=True,
             min_length=6,
             error_messages={&#39;required&#39;: &#39;密码不能为空.&#39;, &#39;min_length&#39;: "至少6位"})
  pwd2 = forms.CharField(required=True,
             min_length=6,
             error_messages={&#39;required&#39;: &#39;密码不能为空.&#39;, &#39;min_length&#39;: "至少6位"})
  captcha=CaptchaField(error_messages={&#39;invalid&#39;:&#39;验证码错误&#39;})

  def clean(self):
    &#39;&#39;&#39;验证两次密码是否一致&#39;&#39;&#39;
    p1=self.cleaned_data.get(&#39;pwd&#39;)
    p2=self.cleaned_data.get(&#39;pwd2&#39;)
    if p1!=p2:
      raise forms.ValidationError(&#39;两次输入密码不一致&#39;)
    else:
      return self.cleaned_data
Nach dem Login kopieren

......

from django.http import HttpResponse
from .models import UserProfile,ShopProfile
from users.form import RegisterForm
from django.contrib.auth.hashers import make_password
import json



class RegisterView(View):
  """邮箱注册"""
  def post(self, request):
    register_form=RegisterForm(request.POST)
    if register_form.is_valid():
      user_name=request.POST.get(&#39;user&#39;,&#39;&#39;)
      email=request.POST.get(&#39;email&#39;,&#39;&#39;)
      pass_word=request.POST.get(&#39;pwd&#39;,&#39;&#39;)
      u=UserProfile.objects.filter(username=user_name).count()
      e=UserProfile.objects.filter(email=email).count()
      if u or e:
        return HttpResponse(&#39;{"status":"该用户名或邮箱已被占用!"}&#39;)
      else:
        user_profile=UserProfile()
        user_profile.username=user_name
        user_profile.email=email
        user_profile.password=make_password(pass_word)
        user_profile.is_active=False
        user_profile.save()
        return HttpResponse(&#39;{"status":"注册成功请去邮箱激活!"}&#39;)
    msg=register_form.errors
    msg=json.dumps(msg)
    return HttpResponse(msg)
Nach dem Login kopieren

3. E-Mail-Aktivierung für registriertes Konto:

1. Erstellen Sie eine neue Datentabelle, um den E-Mail-Aktivierungscode zu speichern:
......

from .views import RegisterView
.....

urlpatterns = [

  ......

  path(&#39;register/&#39;,RegisterView.as_view(),name=&#39;register&#39;),

  ......
  ]
Nach dem Login kopieren

Code in „users/models.py“ hinzufügen:

Registrieren Sie die Datentabelle in „users/adminx.py“:

Öffnen Sie das Terminal und führen Sie den Befehl „Datenbank aktualisieren“ aus:
class EmailVerifyRecord(models.Model):
  """邮箱激活码"""
  code=models.CharField(max_length=20,verbose_name=&#39;验证码&#39;)
  email=models.EmailField(max_length=50,verbose_name=&#39;邮箱&#39;)
  send_type=models.CharField(verbose_name=&#39;验证码类型&#39;,choices=((&#39;register&#39;,&#39;注册&#39;),(&#39;forget&#39;,&#39;忘记密码&#39;)),
                max_length=20)
  send_time=models.DateTimeField(verbose_name=&#39;发送时间&#39;,default=datetime.now)
  class Meta:
    verbose_name=&#39;邮箱验证码&#39;
    verbose_name_plural=verbose_name
  def __str__(self):
    return &#39;{0}({1})&#39;.format(self.code,self.email)
Nach dem Login kopieren

2 . Schreiben Sie ein Skript zum Senden von E-Mails: Erstellen Sie neue utils/email_send.py in apps/users/ >
......

from .models import EmailVerifyRecord

......

class EmailVerifyRecordAdmin(object):
  list_display = [&#39;code&#39;, &#39;email&#39;, &#39;send_type&#39;, &#39;send_time&#39;]
  search_fields = [&#39;code&#39;, &#39;email&#39;, &#39;send_type&#39;]
  list_filter = [&#39;code&#39;, &#39;email&#39;, &#39;send_type&#39;, &#39;send_time&#39;]

......

xadmin.site.register(EmailVerifyRecord,EmailVerifyRecordAdmin)
Nach dem Login kopieren

3. Fügen Sie den Konfigurationscode zum Senden von E-Mails in den Einstellungen hinzu .py:

python manage.py makemigrations
python manage.py migrate
Nach dem Login kopieren
Nach dem Login kopieren

4. Aktivieren Sie den SMTP-Dienst von Sina Mailbox, sonst können Sie keine E-Mails automatisch versenden:

from random import Random
from users.models import EmailVerifyRecord
from django.core.mail import send_mail
from xyw.settings import EMAIL_FROM


def random_str(randomlength=8):
  str=&#39;&#39;
  chars=&#39;AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz0123456789&#39;
  length=len(chars)-1
  random=Random()
  for i in range(randomlength):
    str+=chars[random.randint(0,length)]
  return str

def send_register_email(email,send_type=&#39;register&#39;):
  email_record=EmailVerifyRecord()
  code=random_str(16)
  email_record.code=code
  email_record.email=email
  email_record.send_type=send_type
  email_record.save()

  email_title=&#39;&#39;
  email_body=&#39;&#39;

  if send_type==&#39;register&#39;:
    email_title=&#39;雪易网注册激活链接&#39;
    email_body=&#39;请点击下面的链接激活你的账号:http://127.0.0.1:8000/active/{0}&#39;.format(code)

    send_status=send_mail(email_title,email_body,EMAIL_FROM,[email])
    if send_status:
      pass
  elif send_type==&#39;forget&#39;:
    email_title = &#39;雪易密码重置链接&#39;
    email_body = &#39;请点击下面的链接重置你的密码:http://127.0.0.1:8000/reset/{0}&#39;.format(code)

    send_status = send_mail(email_title, email_body, EMAIL_FROM, [email])
    if send_status:
      pass
Nach dem Login kopieren
Bei Sina Mailbox anmelden====》Einstellungsbereich====》Client pop/imp/ smtp====》Pop3/SMTP-Dienst====》Dienststatus: offen====》Speichern

5. Aktivierungsfunktion hinzufügen

Aktivierungsklasse „users/views.py“ ActiveUserView(View) hinzufügen:

EMAIL_HOST=&#39;smtp.sina.cn&#39;
EMAIL_PORT=25
EMAIL_HOST_USER=&#39;xxxxxxxx@sina.cn&#39; #你的邮箱
EMAIL_HOST_PASSWORD=&#39;********&#39;
EMAIL_USE_TLS=False
EMAIL_FROM=&#39;xxxxxxx1@sina.cn&#39; #同样是你的邮箱,跟上面都是发信者邮箱
#我用的新浪的,也可以用别的
Nach dem Login kopieren

6. Registrieren Sie in „users/views.py“ die Klasse „RegisterView(View)“

. Fügen Sie einen Code zum Senden von Aktivierungs-E-Mails hinzu:

......

from .models import EmailVerifyRecord

......

class ActiveUserView(View):
  """激活账户"""
  def get(self,request,active_code):
    all_records=EmailVerifyRecord.objects.filter(code=active_code)
    if all_records:
      for record in all_records:
        email=record.email
        user=UserProfile.objects.get(email=email)
        user.is_active=True
        user.save()
      
    return render(request,&#39;index.html&#39;)
Nach dem Login kopieren
Fügen Sie einen Code für die Anmeldung bei LoginView (Ansicht) hinzu, um zu überprüfen, ob das Konto aktiviert ist:

Damit ist die Registrierung und Aktivierung per E-Mail abgeschlossen Oft wird die Aktivierungs-E-Mail automatisch in den Papierkorb verschoben, und wenn Sie in der E-Mail auf den Aktivierungslink klicken, werden auch einige Warninformationen angezeigt. Man kann sagen, dass die Registrierung per E-Mail nicht so gut ist wie die Registrierung per SMS, aber... es spart Geld! ^_^

......
from apps.utils.email_send import send_register_email


......

class RegisterView(View):
  """邮箱注册"""
  def post(self, request):
  ......
  user_profile.save()

#发送邮件代码start
  send_register_email(email,&#39;register&#39;)
#发送邮件代码end

  return HttpResponse(&#39;{"status":"注册成功请去邮箱激活!"}&#39;)
Nach dem Login kopieren

Verwandte Empfehlungen:

Detaillierte Erläuterung des Authentifizierungsmoduls von Django (Benutzerauthentifizierung)

class LoginView(View):
  """用户登录"""
  def post(self,request):
    user_name=request.POST.get("username","")
    pass_word=request.POST.get("pwd","")
    user=authenticate(username=user_name,password=pass_word)
    if user is not None:

#验证账户是否已经激活start
      if user.is_active:
        login(request,user)
        return HttpResponse(&#39;{"status":"success"}&#39;)
      else:
        return HttpResponse(&#39;{"status":"fail","msg":"账户未激活"}&#39;)

#验证账户是否已经激活end

    else:
      return HttpResponse(&#39;{"status":"fail","msg":"用户名或密码错误"}&#39;)
Nach dem Login kopieren


Das obige ist der detaillierte Inhalt vonSo schließen Sie die E-Mail-Benutzerregistrierung und Kontoaktivierung über Ajax in Django ab. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!