1、随机验证码

  1. url(r'^get_code/', views.get_code, name='get_code'),
  3. # 获取随机3个0-255数
  4. def get_random():
  5.     """
  6.     :return: 返回0-255三个随机数,元组
  7.     """
  8.     return random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)
  10. # 获取验证码
  11. def get_code(request):
  12.     # 1.产生一张随机颜色的图片
  13.     img_obj = Image.new('RGB', (350, 35), get_random())
  14.     # 2.产生一只在图片上的画笔
  15.     img_draw = ImageDraw.Draw(img_obj)
  16.     # 3.产生字体样式
  17.     img_font = ImageFont.truetype(r'static\font\font.ttf', 35)
  18.     io_obj = BytesIO()
  20.     # 产生5个随机验证码
  21.     code = ''
  22.     for i in range(5):
  23.         upper_str = chr(random.randint(65, 90))  # 大写字母
  24.         lower_str = chr(random.randint(97, 122))  # 小写字母
  25.         random_int = str(random.randint(0, 9))  # 数字
  26.         # 随机取一个
  27.         temp_str = random.choice([upper_str, lower_str, random_int])
  28.         # 写在图片上,位置，内容，颜色，字体
  29.         img_draw.text((45 + i * 60, -2), temp_str, get_random(), font=img_font)
  30.         # 储存
  31.         code += temp_str
  32.     print(code)
  33.     img_obj.save(io_obj, 'png')
  34.     request.session['code'] = code
  35.     return HttpResponse(io_obj.getvalue())

前端代码：

  1. <img src="/get_code/" alt="图片验证码" id="id_img">

js代码：

原理：src改变，立马刷新。点击一次图片，给url添加一个？号

  1. $('#id_img').click(function () {
  2.         var oldSrc = $(this).attr('src');
  3.         $(this).attr('src', oldSrc += '?')
  4.     });

2、注册功能

前端代码：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>注册</title>
  6.     <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
  7.     <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
  8.     <script src="https://cdn.bootcss.com/sweetalert/2.0.0/sweetalert.min.js"></script>
  9.     <link rel="https://cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.css">
  10.     {% load static %}
  11.     <link rel="stylesheet" href="{% static '/bootstrap-3.3.7-dist/css/bootstrap.min.css'%}">
  12.     <script src="{% static 'bootstrap-3.3.7-dist/js/bootstrap.min.js' %}"></script>
  13. </head>
  14. <body>
  15. <div class="container">
  16.     <div class="row">
  17.         <h2 class="text-center">注册页面</h2>
  18.         <div class="col-md-8 col-md-offset-2">
  19.             <form id="myform">
  20.                 {% csrf_token %}
  22.                 {% for form in form_obj %}
  23.                     <div class="form-group">
  24.                         <label for="{{ form.id_for_label }}">{{ form.label }}</label>
  25.                         {{ form }}
  26.                         <span style="color: red" class="pull-right"></span>
  27.                     </div>
  28.                 {% endfor %}
  30.                 <div class="form-group">
  31.                     <label for="id_avatar">头像
  32.                         <img src="/static/images/default.jpg" alt="" width="100" style="margin-left: 10px" id="id_img">
  33.                     </label>
  34.                     <input type="file" name="myfile" id="id_avatar">
  35.                 </div>
  36.                 <a href="/login/"><input type="button" value="登录" class="btn btn-success pull-left"></a>
  37.                 &nbsp;&nbsp;<input type="button" value="注册" class="btn btn-danger" id="id_submit">
  39.             </form>
  41.         </div>
  42.     </div>
  43. </div>
  45. <script>
  46.     $('#id_avatar').change(function () {
  47.         // 1 先获取用户上传的头像文件
  48.         var avatarFile = $(this)[0].files[0];
  49.         // 2 利用文件阅读器对象
  50.         var myFileReader = new FileReader();
  51.         // 3 将文件交由阅读器对象读取
  52.         myFileReader.readAsDataURL(avatarFile);
  53.         // 4 修改img标签的src属性  等待文件阅读器对象读取文件之后再操作img标签
  54.         myFileReader.onload = function(){
  55.             $('#id_img').attr('src',myFileReader.result)
  56.         }
  58.     });
  60.     // 点击按钮触发ajax提交动作
  61.     $('#id_submit').on('click',function () {
  62.         // 1 先生成一个内置对象 FormData
  63.         var myFormData = new FormData();
  64.         // 2 添加普通键值对
  65.         {#console.log($('#myform').serializeArray())#}
  66.         $.each($('#myform').serializeArray(),function (index,obj) {
  67.             myFormData.append(obj.name,obj.value)
  68.         });
  69.         // 3 添加文件数据
  70.         myFormData.append('avatar',$('#id_avatar')[0].files[0]);
  71.         // 4 发送数据
  72.         $.ajax({
  73.             url:'',
  74.             type:'post',
  75.             data:myFormData,
  76.             // 两个关键性参数
  77.             contentType:false,
  78.             processData:false,
  80.             success:function (data) {
  81.                 if (data.code===1000){
  82.                     // 注册成功之后 应该跳转到后端返回过来的url
  83.                     location.href = data.url
  84.                 }else{
  85.                     $.each(data.msg,function(index,obj){
  86.                         // 1 先手动拼接字段名所对应的input框的id值
  87.                         var targetId = '#id_' + index;  // #id_username
  88.                         // 2 利用id选择器查找标签  并且将div标签添加报错类
  89.                         $(targetId).next().text(obj[0]).parent().addClass('has-error')
  90.                     })
  91.                 }
  92.             }
  93.         })
  94.     });
  95.     $('input').focus(function () {
  96.         // 移除span标签内部的文本  还需要移除div标签的class中has-error属性
  97.         $(this).next().text('').parent().removeClass('has-error')
  98.     })
  99. </script>
  101. </body>
  102. </html>

后端urls.py:

  1. # 注册
  2.     url(r'^register/', views.register, name='register'),

views.py:

  1. # 注册
  2. def register(request):
  3.     form_obj = MyRegForm()
  4.     if request.method == 'POST':
  5.         back_dic = {'code': 1000, 'msg': ""}
  6.         # 校验用户名、密码
  7.         form_obj = MyRegForm(request.POST)
  8.         if form_obj.is_valid():
  9.             # 用变量接收正确的结果 clean_data = {'username'   'password'  're_password' 'email'}
  10.             clean_data = form_obj.cleaned_data
  11.             # 将确认密码键值对删除，表中没有re_password
  12.             clean_data.pop('re_password')
  14.             # 把签名、用户CSS名字存进Blog表中
  15.             sign = clean_data.get('sign')
  16.             username = clean_data.get('username')
  17.             site_theme = username + '.css'
  18.             models.Blog.objects.create(site_name=username, site_title=sign, site_theme=site_theme)
  20.             # 添加字段
  21.             clean_data['blog'] = models.Blog.objects.filter(site_name=username).first()
  22.             clean_data.pop('sign')
  24.             # 额外做的事情：给每个新的注册用户添加3个默认的分类和3个默认的标签
  25.             create_list = []
  26.             blog = models.Blog.objects.filter(site_name=username).first()
  27.             for i in ['一', '二', '三']:
  28.                 category_name = username+'的分类'+i
  29.                 create_list.append(models.Category(name=category_name, blog=blog))
  30.             models.Category.objects.bulk_create(create_list)
  32.             # 添加3个默认标签
  33.             create_list = []
  34.             for i in ['一', '二', '三']:
  35.                 tag_name = username + '的标签' + i
  36.                 create_list.append(models.Tag(name=tag_name, blog=blog))
  37.             models.Tag.objects.bulk_create(create_list)
  38.             # 获取用户头像文件
  39.             avatar_obj = request.FILES.get('avatar')
  40.             # 判断用户头像文件是否为空,用户没有上传
  41.             if avatar_obj:
  42.                 # 用户上传了，添加到clean_data中
  43.                 clean_data['avatar'] = avatar_obj  # clean_data = {'username'  'password'  'email' 'avatar'}
  44.             models.UserInfo.objects.create_user(**clean_data)  # 打散传入  ？？=？？的形式
  45.             back_dic['msg'] = '注册成功'
  46.             back_dic['url'] = '/login/'
  47.         else:
  48.             back_dic['code'] = 2000
  49.             back_dic['msg'] = form_obj.errors
  50.         return JsonResponse(back_dic)
  51.     return render(request, 'register.html', locals())

myforms.py:

  1. from django import forms
  2. from app01 import models
  4. class MyRegForm(forms.Form):
  5.     username = forms.CharField(min_length=3,max_length=8,label='用户名',
  6.                                error_messages={
  7.                                    "min_length":'用户名最短3位',
  8.                                    "max_length":'用户名最长8位',
  9.                                    "required":'用户名不能为空',
  10.                                },widget=forms.widgets.TextInput(attrs={'class':'form-control'})
  11.                                )
  13.     password = forms.CharField(min_length=3, max_length=8, label='密码',
  14.                                error_messages={
  15.                                    "min_length": '密码最短3位',
  16.                                    "max_length": '密码最长8位',
  17.                                    "required": '密码不能为空',
  18.                                }, widget=forms.widgets.PasswordInput(attrs={'class': 'form-control'})
  19.                                )
  21.     re_password = forms.CharField(min_length=3, max_length=8, label='确认密码',
  22.                                error_messages={
  23.                                    "min_length": '确认密码最短3位',
  24.                                    "max_length": '确认密码最长8位',
  25.                                    "required": '确认密码不能为空',
  26.                                }, widget=forms.widgets.PasswordInput(attrs={'class': 'form-control'})
  27.                                )
  29.     email = forms.EmailField(label='邮箱',
  30.                              error_messages={
  31.                                  "required": '邮箱不能为空',
  32.                                  "invalid":"邮箱格式不正确"
  33.                              },
  34.                              widget=forms.widgets.EmailInput(attrs={'class': 'form-control'})
  35.                              )
  36.     sign = forms.CharField(min_length=5, max_length=15, label='学习宣言',
  37.                            error_messages={
  38.                                "min_length": '学习宣言最短5位',
  39.                                "max_length": '学习宣言最长15位',
  40.                                "required": '学习宣言不能为空',}
  41.                            , widget=forms.widgets.TextInput(attrs={'class': 'form-control'})
  42.                            )
  44.     # 钩子函数
  45.     # 局部钩子校验用户名是否已存在
  46.     def clean_username(self):
  47.         username = self.cleaned_data.get('username')
  48.         is_alive = models.UserInfo.objects.filter(username=username)
  49.         if is_alive:
  50.             self.add_error('username','用户名已存在')
  51.         return username
  53.     # 全局钩子校验密码与确认密码是否一致
  54.     def clean(self):
  55.         password = self.cleaned_data.get('password')
  56.         re_password = self.cleaned_data.get('re_password')
  57.         if not password == re_password:
  58.             self.add_error('re_password','两次密码不一致')
  59.         return self.cleaned_data

3、登录功能

前端代码：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
  7.     <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
  8.     <script src="https://cdn.bootcss.com/sweetalert/2.0.0/sweetalert.min.js"></script>
  9.     <link rel="https://cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.css">
  10.     {% load static %}
  11.     <link rel="stylesheet" href="{% static '/bootstrap-3.3.7-dist/css/bootstrap.min.css'%}">
  12.     <script src="{% static 'bootstrap-3.3.7-dist/js/bootstrap.min.js' %}"></script>
  13. </head>
  14. <body>
  16. <div class="container">
  17.     <h2 class="text-center">登录页面</h2>
  18.     <div class="row">
  19.         <div class="col-md-8 col-md-offset-2">
  20.             <div class="form-group">
  21.                 <label for="id_username">用户名</label>
  22.                 <input type="text" name="username" class="form-control" id="id_username">
  23.             </div>
  24.             <div class="form-group">
  25.                 <label for="id_password">密码</label>
  26.                 <input type="password" name="password" class="form-control" id="id_password">
  27.             </div>
  28.             <div class="form-group">
  29.                 <label for="id_code">验证码</label>
  30.                 <div class="row">
  31.                     <div class="col-md-6">
  32.                         <input type="text" name="code" class="form-control" id="id_code">
  33.                     </div>
  34.                     <div class="col-md-6">
  35.                         <img src="/get_code/" alt="图片验证码" id="id_img">
  36.                     </div>
  37.                 </div>
  38.             </div>
  39.             <input type="button" value="登录" class="btn btn-success" id="id_submit">
  40.             <a href="/register/"><input type="button" value="注册" class="btn btn-danger"></a>
  41.             <span style="color: red" id="error"></span>
  43.         </div>
  44.     </div>
  45. </div>
  46. <script>
  47.     $('#id_img').click(function () {
  48.         var oldSrc = $(this).attr('src');
  49.         $(this).attr('src', oldSrc += '?')
  50.     });
  52.     $('#id_submit').click(function () {
  53.         $.ajax({
  54.             url:'',
  55.             type:'post',
  56.             data:{
  57.                 'username': $('#id_username').val(),
  58.                 'password': $('#id_password').val(),
  59.                 'csrfmiddlewaretoken':'{{ csrf_token }}',
  60.                 'code':$('#id_code').val()
  61.             },
  62.             success:function (data) {
  63.                 if (data.code === 1000){
  64.                     // 登录成功，跳转页面
  65.                     location.href = data.url
  66.                 }else {
  67.                     // 点击此按钮，添加文本信息
  68.                     $('#error').text(data.msg)
  69.                 }
  70.             }
  71.         })
  72.     })
  74. </script>
  76. </body>
  77. </html>

后端代码：

urls.py:

  1. # 登录
  2.     url(r'^login/', views.login, name='login'),

views.py:

  1. # 登录
  2. def login(request):
  3.     back_dic = {'code': None, 'msg': None}
  4.     if request.method == 'POST':
  5.         username = request.POST.get('username')
  6.         password = request.POST.get('password')
  7.         code = request.POST.get('code')  # 从前端拿过来的验证码
  8.         # 先对比验证码
  9.         if request.session.get('code').lower() == code.lower():
  10.             # 校验用户名和密码
  11.             user_obj = auth.authenticate(username=username, password=password)
  12.             if user_obj:
  13.                 # 记录登录状态
  14.                 auth.login(request, user_obj)
  15.                 back_dic['code'] = 1000
  16.                 back_dic['msg'] = '登录成功'
  17.                 back_dic['url'] = '/home/'
  18.                 # back_dic['url'] = '/%s/' % username
  19.             else:
  20.                 back_dic['code'] = 2000
  21.                 back_dic['msg'] = '用户名或密码错误'
  22.         else:
  23.             back_dic['code'] = 3000
  24.             back_dic['msg'] = '验证码错误'
  25.         return JsonResponse(back_dic)
  26.     return render(request, 'login.html')

4、登录认证装饰器配置

settings.py:

  1. LOGIN_URL = '/login/'

5、修改密码模态框方法

前端代码：

  1. <li><a href="#" data-toggle="modal" data-target=".bs-example-modal-lg">修改密码</a></li>
  3. {#修改密码模态框#}
  4. <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
  5.     <div class="modal-dialog modal-lg" role="document">
  6.         <div class="modal-content">
  7.             <h2 class="text-center">修改密码</h2>
  8.             <div class="row">
  9.                 <div class="col-md-8 col-md-offset-2">
  10.                     <div class="form-group">
  11.                         <label for="">用户名</label>
  12.                         <input type="text" name="username" value={{ request.user.username }} class="form-control"
  13.                                disabled>
  14.                     </div>
  15.                     <div class="form-group">
  16.                         <label for="id_old_password">原密码</label>
  17.                         <input type="password" name="old_password" class="form-control" id="id_old_password">
  18.                     </div>
  19.                     <div class="form-group">
  20.                         <label for="id_new_password">新密码</label>
  21.                         <input type="password" name="new_password" class="form-control" id="id_new_password">
  22.                     </div>
  23.                     <div class="form-group">
  24.                         <label for="id_confirm_password">确认密码</label>
  25.                         <input type="password" name="confirm_password" class="form-control" id="id_confirm_password">
  26.                     </div>
  27.                     <button class="btn btn-primary" id="id_set">修改</button>
  28.                     <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
  29.                     <span style="color: red"></span>
  30.                 </div>
  32.             </div>
  33.             <br>
  34.         </div>
  35.     </div>
  36. </div>

js代码：

  1. <script>
  2. {#修改密码#}
  3.     $('#id_set').click(function () {
  4.         var $btn = $(this);
  5.         $.ajax({
  6.             url: '{% url 'set_password' %}',
  7.             type: 'post',
  8.             data: {
  9.                 old_password: $('#id_old_password').val(),
  10.                 new_password: $('#id_new_password').val(),
  11.                 confirm_password: $('#id_confirm_password').val(),
  12.                 csrfmiddlewaretoken: '{{ csrf_token }}'
  13.             },
  14.             success: function (data) {
  15.                 if (data.code === 1000) {
  16.                     location.href = data.url
  17.                 } else {
  18.                     $btn.next().next().text(data.msg)
  19.                 }
  20.             }
  21.         })
  22.     });
  23.  </script>

后端代码：

urls.py:

  1. # 修改密码
  2.     url(r'^set_password', views.set_password, name='set_password'),

views.py:

  1. # 修改密码
  2. @login_required
  3. def set_password(request):
  4.     if request.is_ajax():
  5.         back_dic = {'code': 1000, 'msg': ''}
  6.         old_password = request.POST.get('old_password')
  7.         new_password = request.POST.get('new_password')
  8.         confirm_password = request.POST.get('confirm_password')
  9.         if new_password == confirm_password:
  10.             is_right = request.user.check_password(old_password)
  11.             if is_right:
  12.                 request.user.set_password(new_password)
  13.                 request.user.save()
  14.                 back_dic['msg'] = '修改成功'
  15.                 back_dic['url'] = reverse('login')
  16.             else:
  17.                 back_dic['code'] = 2000
  18.                 back_dic['msg'] = '原密码错误'
  19.         else:
  20.             back_dic['code'] = 3000
  21.             back_dic['msg'] = '两次密码不一致'
  22.         return JsonResponse(back_dic)

6、修改头像

前端代码：

  1. <li><a href="/set_avatar/">修改头像</a></li>

stt_avatar.html:

  1. {% extends 'base.html' %}
  3. {% block content %}
  4.     <form action="" method="post" enctype="multipart/form-data">
  5.         <p><a href="/home/">返回</a></p>
  6.         <input type="file" name="myfile" id="id_avatar"><br>
  7.         {% csrf_token %}
  8.         <div class="form-group">
  9.             <label for="id_avatar">
  10.                 <img src="/static/images/default.jpg" alt="" width="100" id="id_img">&nbsp;<span>新头像</span>
  11.             </label>
  12.         </div>
  13.         <label for="id_avatar">
  14.             <img src="/media/{{ request.user.avatar }}/" width="200" alt="原头像">&nbsp;<span>原头像</span>
  15.         </label>
  16.         <p><input type="submit" class="btn btn-primary"></p>
  17.     </form>
  19.     <script>
  20.         $('#id_avatar').change(function () {
  21.             // 1 先获取用户上传的头像文件
  22.             var avatarFile = $(this)[0].files[0];
  23.             // 2 利用文件阅读器对象
  24.             var myFileReader = new FileReader();
  25.             // 3 将文件交由阅读器对象读取
  26.             myFileReader.readAsDataURL(avatarFile);
  27.             // 4 修改img标签的src属性  等待文件阅读器对象读取文件之后再操作img标签
  28.             myFileReader.onload = function () {
  29.                 $('#id_img').attr('src', myFileReader.result)
  30.             }
  32.         });
  33.     </script>
  34. {% endblock %}

后端代码：

urls.py:

  1. # 修改用户头像
  2.     url(r'^set_avatar/', views.set_avatar, name='set_avatar'),

views.py:

  1. # 修改头像
  2. @ login_required
  3. def set_avatar(request):
  4.     if request.method == 'POST':
  5.         avatar_obj = request.FILES.get('myfile')
  6.         # models.UserInfo.objects.filter(pk=request.user.pk).update(avatar=avatar_obj)   # 不会帮你自动添加前缀
  7.         # 用自己的save方法，自动帮你添加前缀
  8.         request.user.avatar = avatar_obj
  9.         request.user.save()
  10.     return render(request, 'set_avatar.html')

7、修改签名模态框方法

前端代码：

  1. <li><a href="#" data-toggle="modal" data-target=".set_sign">编辑签名</a></li>
  3. {#编辑签名模态框#}
  4. <div class="modal fade bs-example-modal-lg set_sign" id="set_sign" tabindex="-1" role="dialog"
  5.      aria-labelledby="myLargeModalLabel">
  6.     <div class="modal-dialog modal-lg" role="document">
  7.         <div class="modal-content">
  8.             <h2 class="text-center">编辑签名</h2>
  9.             <div class="row">
  10.                 <div class="col-md-8 col-md-offset-2">
  11.                     <div class="form-group">
  12.                         <label for="">用户名</label>
  13.                         <input type="text" name="username" value={{ request.user.username }} class="form-control"
  14.                                disabled>
  15.                     </div>
  16.                     <div class="form-group">
  17.                         <label for="id_old_sign">原签名</label><br>
  18.                         <textarea name="old_sign" id="id_old_sign" cols="81" rows="5"
  19.                                   disabled>{{ request.user.blog.site_title }}</textarea>
  20.                     </div>
  21.                     <div class="form-group">
  22.                         <label for="id_new_sign">新签名</label>
  23.                         <span style="color: red" id="error_sign"></span>
  24.                         <textarea name="new_sign" id="id_new_sign" cols="81" rows="5"></textarea>
  25.                     </div>
  27.                     <button class="btn btn-primary" id="set_sign">修改</button>
  28.                     <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
  30.                 </div>
  32.             </div>
  33.             <br>
  34.         </div>
  35.     </div>
  36. </div>

js代码：

  1. {#修改签名#}
  2.     $("#set_sign").click(function () {
  3.         $.ajax({
  4.             url: '{% url 'set_sign' %}',
  5.             type: 'post',
  6.             data: {
  7.                 new_sign: $('#id_new_sign').val(),
  8.                 csrfmiddlewaretoken: '{{ csrf_token }}'
  9.             },
  10.             success: function (data) {
  11.                 if (data.code === 1000) {
  12.                     location.href = data.url;
  13.                     $('#error_sign').text(data.msg)
  14.                 } else {
  15.                     $('#error_sign').text(data.msg)
  16.                 }
  17.             }
  18.         })
  20.     });

后端代码：

urls.py:

  1. # 编辑签名
  2.     url(r'^set_sign', views.set_sign, name='set_sign'),

views.py:

  1. # 编辑签名
  2. @login_required
  3. def set_sign(request):
  4.     if request.is_ajax():
  5.         back_dic = {'code': 1000, 'msg': ''}
  6.         site_name = request.user.username
  7.         site_title = request.POST.get('new_sign')
  8.         if len(site_title) < 5:
  9.             back_dic['code'] = 2000
  10.             back_dic['msg'] = '(你的学习宣言必须大于5位)'
  11.         elif len(site_title) > 15:
  12.             back_dic['code'] = 3000
  13.             back_dic['msg'] = '(你的学习宣言必须小于于15位)'
  14.         else:
  15.             back_dic['code'] = 1000
  16.             back_dic['url'] = reverse('home')
  17.             back_dic['msg'] = '修改成功'
  18.             models.Blog.objects.filter(site_name=site_name).update(site_title=site_title)
  19.         return JsonResponse(back_dic)

8、注销功能模态框

前端代码：

  1. <li><a href="#" data-toggle="modal" data-target=".bs-example-modal-sm">注销</a></li>
  3. {#    退出确认模态框#}
  4. <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog">
  5.     <div class="modal-dialog modal-sm" role="document">
  6.         <div class="modal-content">
  7.             <div class="modal-header">
  8.                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
  9.                         aria-hidden="true">&times;</span></button>
  10.                 <h4 class="modal-title">你忍心离开我吗</h4>
  11.             </div>
  12.             <div class="modal-body">
  13.                 <p>确定退出？</p>
  14.             </div>
  15.             <div class="modal-footer">
  16.                 <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
  17.                 <button type="button" class="btn btn-primary" id="exit">确定</button>
  18.             </div>
  19.         </div><!-- /.modal-content -->
  20.     </div>
  21. </div>

js代码：

  1. {#注销#}
  2.     $('#exit').click(function () {
  3.         location.href = "/logout/"
  4.     });

后端代码：

urls.py:

  1. # 注销
  2.     url(r'^logout', views.logout, name='logout'),

views.py:

  1. # 注销
  2. @login_required
  3. def logout(request):
  4.     auth.logout(request)  # 原理删除了对应的session值
  5.     return redirect(reverse('home'))

9、用户上传静态文件配置

setting.py文件配置：

配置好之后，文件夹自动创建

  1. # media配置
  2. MEDIA_ROOT = os.path.join(BASE_DIR, 'media')   # 用户上传的文件全部保存该文件下

10、图片防盗链

请求头里面有一个referer请求头，用来标识你上一次是从哪一个网址过来的

判断上一次这个网址是否有权限

自己的项目：把图片所在的文件夹暴露，那么只能访问图片。

别人的图片怎么解决防盗链？：

  1. 1.用爬虫将所有的图片资源下载到本地    这是爬虫的价值所在
  2. 2.修改请求头参数  百度搜吧

referer属性：

11、暴露任意文件的配置

urls.py:

注意：千万不要暴露重要文件资源，否则拍屁股走人

MEDIA_ROOT,一定不要暴露关键文件

  1. from django.views.static import serve
  2. # 暴露任意后端资源配置
  3.     url(r'^media/(?P<path>.*)', serve, {"document_root": settings.MEDIA_ROOT}),

图片文件地址：

  1. <img class="media-object" src="/media/{{ article_obj.blog.userinfo.avatar }}"
  2.                                      style="width: 60px" alt="这是你的头像" width="60px;">

12、分页器的使用

分页器：新建py文件，把代码复制过来

代码：

  1. class Pagination(object):
  2.     def __init__(self,current_page,all_count,per_page_num=2,pager_count=11):
  3.         """
  4.         封装分页相关数据
  5.         :param current_page: 当前页
  6.         :param all_count:    数据库中的数据总条数
  7.         :param per_page_num: 每页显示的数据条数
  8.         :param pager_count:  最多显示的页码个数
  10.         用法:
  11.         queryset = model.objects.all()
  12.         page_obj = Pagination(current_page,all_count)
  13.         page_data = queryset[page_obj.start:page_obj.end]
  14.         获取数据用page_data而不再使用原始的queryset
  15.         获取前端分页样式用page_obj.page_html
  16.         """
  17.         try:
  18.             current_page = int(current_page)
  19.         except Exception as e:
  20.             current_page = 1
  22.         if current_page <1:
  23.             current_page = 1
  25.         self.current_page = current_page
  27.         self.all_count = all_count
  28.         self.per_page_num = per_page_num
  30.         # 总页码
  31.         all_pager, tmp = divmod(all_count, per_page_num)
  32.         if tmp:
  33.             all_pager += 1
  34.         self.all_pager = all_pager
  36.         self.pager_count = pager_count
  37.         self.pager_count_half = int((pager_count - 1) / 2)
  39.     @property
  40.     def start(self):
  41.         return (self.current_page - 1) * self.per_page_num
  43.     @property
  44.     def end(self):
  45.         return self.current_page * self.per_page_num
  47.     def page_html(self):
  48.         # 如果总页码 < 11个：
  49.         if self.all_pager <= self.pager_count:
  50.             pager_start = 1
  51.             pager_end = self.all_pager + 1
  52.         # 总页码  > 11
  53.         else:
  54.             # 当前页如果<=页面上最多显示11/2个页码
  55.             if self.current_page <= self.pager_count_half:
  56.                 pager_start = 1
  57.                 pager_end = self.pager_count + 1
  59.             # 当前页大于5
  60.             else:
  61.                 # 页码翻到最后
  62.                 if (self.current_page + self.pager_count_half) > self.all_pager:
  63.                     pager_end = self.all_pager + 1
  64.                     pager_start = self.all_pager - self.pager_count + 1
  65.                 else:
  66.                     pager_start = self.current_page - self.pager_count_half
  67.                     pager_end = self.current_page + self.pager_count_half + 1
  69.         page_html_list = []
  70.         # 添加前面的nav和ul标签
  71.         page_html_list.append('''
  72.                     <nav aria-label='Page navigation>'
  73.                     <ul class='pagination'>
  74.                 ''')
  75.         first_page = '<li><a href="?page=%s">首页</a></li>' % (1)
  76.         page_html_list.append(first_page)
  78.         if self.current_page <= 1:
  79.             prev_page = '<li class="disabled"><a href="#">上一页</a></li>'
  80.         else:
  81.             prev_page = '<li><a href="?page=%s">上一页</a></li>' % (self.current_page - 1,)
  83.         page_html_list.append(prev_page)
  85.         for i in range(pager_start, pager_end):
  86.             if i == self.current_page:
  87.                 temp = '<li class="active"><a href="?page=%s">%s</a></li>' % (i, i,)
  88.             else:
  89.                 temp = '<li><a href="?page=%s">%s</a></li>' % (i, i,)
  90.             page_html_list.append(temp)
  92.         if self.current_page >= self.all_pager:
  93.             next_page = '<li class="disabled"><a href="#">下一页</a></li>'
  94.         else:
  95.             next_page = '<li><a href="?page=%s">下一页</a></li>' % (self.current_page + 1,)
  96.         page_html_list.append(next_page)
  98.         last_page = '<li><a href="?page=%s">尾页</a></li>' % (self.all_pager,)
  99.         page_html_list.append(last_page)
  100.         # 尾部添加标签
  101.         page_html_list.append('''
  102.                                            </nav>
  103.                                            </ul>
  104.                                        ''')
  105.         return ''.join(page_html_list)

使用方法：

后端代码：

  1. from app01.utils.mypagenation import Pagination  # 分页器导
  3. # 首页
  4. def home(request):
  5.     # 将网站的所有文章展示到前端
  6.     article_list = models.Article.objects.all()
  7.     # 分页处理
  8.     page_obj = Pagination(current_page=request.GET.get('page',1),all_count=article_list.count())
  9.     article_list = article_list[page_obj.start:page_obj.end]
  10.     return render(request, 'home.html', locals())

前端代码：

  1. {#分页器 #}
  2. <div class="text-center">{{ page_obj.page_html|safe }}</div>

13、每个用户拥有自己的css

1.在注册的时候把用户的css文件的名字固定写好，写进数据库

2.在用户编辑CSS的时候，再通过文件操作，创建用户固定的CSS文件

3.再应用导入自己的CSS文件

  1. {#引用自己的css#}
  2. <link rel="stylesheet" href="/media/css/{{ user_obj.blog.site_theme }}">

前端代码：

  1. <a href="{% url 'blog_css' %}">个人站点CSS设置</a>

urls.py:

  1. # 个人站点CSS设置
  2.     url(r'^blog_css/', views.blog_css, name='blog_css'),

views.py:

  1. # 个人站点CSS设置
  2. @login_required
  3. def blog_css(request):
  4.     username = request.user.username
  5.     site_theme = models.Blog.objects.filter(site_name=username).first().site_theme
  6.     css_dir = f'media/css/{site_theme}'
  7.     if request.method == 'POST':
  8.         new_css = request.POST.get('new_css')
  9.         with open(css_dir, 'w', encoding='utf-8')as f:
  10.             for line in new_css:
  11.                 res = line.replace('\n', '')
  12.                 f.write(res)
  13.             f.close()
  14.         return redirect('/blog_css/')
  15.     if request.method == 'GET':
  16.         # 先判断用户css文件是否存在，不存在就创建。存在就读取
  17.         isfile = os.path.exists(css_dir)
  18.         # 不存在创建空的css文件
  19.         if not isfile:
  20.             with open(css_dir, 'w')as f:
  21.                 f.close()
  22.         # 存在就读取
  23.         with open(css_dir, 'r')as f:
  24.             old_css = f.read()
  25.         return render(request, 'backend/blog_css.html', locals())

backend/blog_css.html:

  1. {% extends 'backend/backend_base.html' %}
  2. {% block article %}
  3.     <form action="" method="post">
  4.         {% csrf_token %}
  5.         <h2>页面定制 CSS 代码</h2>
  6.         <textarea name="new_css" id="" cols="100" rows="30">{{ old_css }}</textarea>
  7.         <p>推荐客户端： <a href="">Open Live Writer</a></p>
  8.         <p>MetaWeblog访问地址: <a href="http://127.0.0.1:8000/home">http://127.0.0.1:8000/home</a>/</p>
  9.         <input type="submit" class="btn btn-primary">
  10.     </form>
  11. {% endblock %}

14、分组，按年月等。官方推荐

-官方提供

from django.db.models.functions import TruncMonth

Article.objects

.annotate(month=TruncMonth('timestamp')) # Truncate to month and add to select list

.values('month') # Group By month

.annotate(c=Count('id')) # Select the count of the grouping

.values('month', 'c') # (might be redundant, haven't tested) select month and count

  1. # 3.按照文章的年月分组
  2.     date_list = models.Article.objects.filter(blog=blog).\
  3.         annotate(month=TruncMonth('create_time')).values(
  4.         'month').annotate(c=Count('pk')).values('c', 'month')
  1. {% for date in date_list %}
  2.             <p>
  3.                 <a href="/{{ username }}/archive/{{ date.month|date:'Y-m' }}/">
  4.                     {{ date.month|date:'Y年m月' }}({{ date.c }})</a>
  5.             </p>
  6. {% endfor %}

15、侧边栏筛选（自定义过滤器方法）

新建文件夹和py文件：

mytag.py代码：

  1. from django.template import Library
  2. from app01 import models
  3. from django.db.models import Count
  4. from django.db.models.functions import TruncMonth
  5. register = Library()
  7. # 侧边栏渲染，自定义过滤器方法
  8. @register.inclusion_tag('left_menu.html', name='my_left')
  9. def index(username):
  10.     # 提供left_menu所需要的所有数据
  11.     user_obj = models.UserInfo.objects.filter(username=username).first()
  12.     blog = user_obj.blog
  13.     # 1.查询当前用户的分类及每个分类下的文章数
  14.     category_list = models.Category.objects.all().filter(blog=blog).annotate(article_sum=Count('article__pk')).values(
  15.         'article_sum', 'name', 'pk')
  17.     # 2.查询当前用户的标签，及每个标签下的文章数
  18.     tag_list = models.Tag.objects.all().filter(blog=blog).annotate(tag_sum=Count('article__pk')).values('tag_sum',
  19.                                                                                                         'name', 'pk')
  21.     # 3.按照文章的年月分组
  22.     date_list = models.Article.objects.filter(blog=blog).\
  23.         annotate(month=TruncMonth('create_time')).values(
  24.         'month').annotate(c=Count('pk')).values('c', 'month')
  25.     return locals()

left_menu.html:

  1. <div class="panel panel-primary">
  2.     <div class="panel-heading">
  3.         <h3 class="panel-title">文章分类</h3>
  4.     </div>
  5.     <div class="panel-body">
  6.         {% for category in category_list %}
  7.             <p><a href="/{{ username }}/category/{{ category.pk }}">{{ category.name }}({{ category.article_sum }})</a>
  8.             </p>
  9.         {% endfor %}
  10.     </div>
  12. </div>
  13. <div class="panel panel-danger">
  14.     <div class="panel-heading">
  15.         <h3 class="panel-title">文章标签</h3>
  16.     </div>
  17.     <div class="panel-body">
  18.         {% for tag in tag_list %}
  19.             <p><a href="/{{ username }}/tag/{{ tag.pk }}">{{ tag.name }}({{ tag.tag_sum }})</a></p>
  20.         {% endfor %}
  21.     </div>
  22. </div>
  23. <div class="panel panel-warning">
  24.     <div class="panel-heading">
  25.         <h3 class="panel-title">日期归档</h3>
  26.     </div>
  27.     <div class="panel-body">
  28.         {% for date in date_list %}
  29.             <p>
  30.                 <a href="/{{ username }}/archive/{{ date.month|date:'Y-m' }}/">
  31.                     {{ date.month|date:'Y年m月' }}({{ date.c }})</a>
  32.             </p>
  33.         {% endfor %}
  35.     </div>
  36. </div>

16、点赞点踩

前端样式：可以直接去别人网站拷贝html代码,改改自己用

  1. {#    点赞点踩前端样式#}
  2.         <div class="clearfix">
  3.             <div id="div_digg">
  4.                 <div class="diggit jeff">
  5.                     <span class="diggnum" id="digg_count">{{ article_obj.up_num }}</span>
  6.                 </div>
  7.                 <div class="buryit jeff">
  8.                     <span class="burynum" id="bury_count">{{ article_obj.down_num }}</span>
  9.                 </div>
  10.                 <div class="clear"></div>
  11.                 <div class="diggword" id="digg_tips" style="color: red">
  12.                 </div>
  13.             </div>
  14.         </div>

js代码：

  1. <script>
  2.         {#点赞点踩JS代码#}
  3.         $('.jeff').click(function () {
  4.             var $divEle = $(this);
  5.             $.ajax({
  6.                 url: '{% url 'updown' %}',
  7.                 type: 'post',
  8.                 data: {
  9.                     'article_id':{{ article_obj.pk }},
  10.                     'is_up': $(this).hasClass('diggit'),
  11.                     'csrfmiddlewaretoken': '{{ csrf_token }}'
  12.                 },
  13.                 success: function (data) {
  14.                     if (data.code === 1000) {
  15.                         $('#digg_tips').text(data.msg);
  16.                         $divEle.children().text(Number($divEle.children().text()) + 1)
  17.                     } else {
  18.                         $('#digg_tips').html(data.msg)
  19.                     }
  21.                 }
  22.             })
  24.         });
  25. </script>

后端：

urls.py:

  1. # 点赞点踩
  2.     url(r'^up_or_down/', views.up_or_down, name='updown'),

views.py:

  1. # 点赞点踩
  2. import json
  3. from django.contrib import auth
  4. from django.db.models import F
  5. def up_or_down(request):
  6.     bank_dic = {'code': 1000, 'msg': ''}
  7.     if request.is_ajax():
  8.         article_id = request.POST.get('article_id')
  9.         # 注意：前端返回来的bool值是str形式。拿到是点赞还是点踩   赞True 踩false
  10.         is_up = request.POST.get('is_up')
  11.         is_up = json.loads(is_up)  # 转成python形式的bool值
  12.         '''
  13.         1.必须是登录的用户才能点赞点踩，判断用户是否登录
  14.         2.判断当前文章是否是用户自己写的，自己不能给自己点赞点踩
  15.         3.当前用户是否已经给文章点过赞或踩了
  16.         4.操作数据库---操作两张表，优化表字段
  17.         '''
  18.         # 1.判断用户是否已登录
  19.         if request.user.is_authenticated():
  20.             # 2.拿到当前文章,从文章里拿到当前用户，和登录的用户比较。如果用户一样，则证明是自己写的文章，不能点赞踩
  21.             article_obj = models.Article.objects.filter(pk=article_id).first()
  22.             if not article_obj.blog.userinfo.pk == request.user.pk:
  23.                 # 3.判断当前用户是否已经给当前文章点过赞或踩了。到点赞点踩表中查询是否有当前用户的记录，如果有，则证明当前用户已经点过了
  24.                 is_click = models.UpAndDown.objects.filter(user=request.user.pk, article=article_id)
  25.                 if not is_click:
  26.                     # 用户没电点过，操作表数据.第一张表
  27.                     # 点赞给点赞字段+1
  28.                     if is_up:
  29.                         models.Article.objects.filter(pk=article_id).update(up_num=F('up_num') + 1)
  30.                         bank_dic['msg'] = '点赞成功'
  31.                     # 点踩给点踩字段+1
  32.                     else:
  33.                         models.Article.objects.filter(pk=article_id).update(down_num=F('down_num') + 1)
  34.                         bank_dic['msg'] = '点踩成功'
  35.                     # 操作表数据，第二张表
  36.                     models.UpAndDown.objects.create(user=request.user, article=article_obj, is_up=is_up)
  37.                 else:
  38.                     bank_dic['code'] = 2000
  39.                     bank_dic['msg'] = '你已经点过了'
  40.             else:
  41.                 bank_dic['code'] = 3000
  42.                 bank_dic['msg'] = '不能给自己点'
  43.         else:
  44.             bank_dic['code'] = 4000
  45.             bank_dic['msg'] = '请先<a href="/login/">登录</a>'
  46.         return JsonResponse(bank_dic)

17、模板字符串

文章评论零时渲染：

  1. //定义全局变量
  2.         var parentId = null;
  3.         // 文章评论js代码
  4.         $('#id_comment').click(function () {
  5.             var conTent = $('#id_content').val();
  6.             // 如果是根评论不处理，如果是子评论需要处理，将@jeff 切割
  7.             // @jeff 萨尔
  8.             if (parentId) {
  9.                 //切割方式  获取第一个\n对应的索引
  10.                 var indexN = conTent.indexOf('\n') + 1  //顾头不顾尾
  11.                 // 按照获取的索引切割
  12.                 conTent = conTent.slice(indexN)  //将indexN之前的全部切除，中保留之后的
  13.             }
  14.             $.ajax({
  15.                 url: '{% url "comment" %}',
  16.                 type: 'post',
  17.                 data: {
  18.                     "article_id":{{ article_obj.pk }},
  19.                     "content": conTent,
  20.                     "csrfmiddlewaretoken": '{{ csrf_token }}',
  21.                     "parent_id": parentId
  22.                 },
  23.                 success: function (data) {
  24.                     if (data.code === 1000) {
  26.                         // 临时渲染评论内容
  27.                         var UserName = '{{ request.user.username }}';
  28.                         var conTent = $('#id_content').val();
  29.                         // 将内容临时渲染到ul标签内
  30.                         var temp = `
  31.                         <li class="list-group-item">
  32.                             <span><span class="glyphicon glyphicon-comment"></span><a href="/${UserName}/">${UserName}</a></span>
  33.                             <div>
  34.                                 ${conTent}
  35.                             </div>
  36.                             </li>
  37.                         `;
  38.                         $('.list-group').append(temp);
  40.                         // 将获取用户输入评论的内容框清空
  41.                         $('#id_content').val('');
  42.                         // 将全局的parentId清空，否则parentId后续一直有值，就一直是子评论
  43.                         parentId = null
  44.                     }
  45.                 }
  46.             })
  47.         });

18、KindEditor编辑器使用

看官方文档

前端内容：

  1. {% extends 'backend/backend_base.html' %}
  2. {% block article %}
  3.     <h2>添加文章</h2>
  4.     <form action="" method="post">
  5.         {% csrf_token %}
  6.         <p>标题</p>
  7.         <p>
  8.             <input type="text" name="title" class="form-control">
  9.         </p>
  10.         <p>内容(使用kindeditor编辑器)</p>
  11.         <p>
  12.             <textarea name="content" id="id_content" cols="60" rows="20"></textarea>
  13.         </p>
  14.         <div>
  15.             <p>文章标签</p>
  16.             <p>
  17.                 {% for tag in tag_list %}
  18.                     {{ tag.name }} <input type="checkbox" name="tag" value="{{ tag.pk }}">
  19.                 {% endfor %}
  20.             </p>
  21.         </div>
  22.         <div>
  23.             <p>文章分类</p>
  24.             <p>
  25.                 {% for category in category_list %}
  26.                     {{ category.name }} <input type="radio" name="category" value="{{ category.pk }}">
  27.                 {% endfor %}
  29.             </p>
  30.         </div>
  31.         <input type="submit" class="btn btn-primary" value="添加">
  32.     </form>
  34. <script charset="utf-8" src="/static/kindeditor/kindeditor-all-min.js"></script>
  35. <script>
  36.         KindEditor.ready(function(K) {
  37.                 window.editor = K.create('#id_content',{
  38.                     width:'100%',
  39.                     height:'500px',
  40.                     resizeType:0,
  41.                     uploadJson : '/upload_image/',  //控制用户写文章上传文件的后端地址
  42.                     extraFileUploadParams : {
  43.                         'csrfmiddlewaretoken':'{{ csrf_token }}',
  44.                 }
  45.                 });
  47.         });
  48. </script>
  49. {% endblock %}

后端代码：

urls.py:

  1. # 添加文章
  2. url(r'^add_article/', views.add_article, name='add_article'),

views.py:

  1. # 添加随笔
  2. from bs4 import BeautifulSoup
  3. @login_required
  4. def add_article(request):
  5.     if request.method == 'POST':
  6.         # 获取从前端页面传来的文章数据
  7.         title = request.POST.get('title')
  8.         content = request.POST.get('content')
  9.         tag_list = request.POST.get('tag')
  10.         category_id = request.POST.get('category')
  11.         # 先生成一个该模块beautifulsoup4的对象
  12.         soup = BeautifulSoup(content, 'html.parser')
  13.         for tag in soup.find_all():
  14.             # 筛选除script标签直接删除，避免XSS攻击
  15.             if tag.name == 'script':
  16.                 tag.decompose()  # 删除该标签
  18.         # desc = content[0:150]   # 截取文章简介,错误示范。会从html代码截取
  19.         desc = soup.text[0:150]  # 通过模块处理，直接从内容截取
  20.         # 写入数据
  21.         article_obj = models.Article.objects.create(title=title, desc=desc, content=str(soup), category_id=category_id, blog=request.user.blog)
  22.         # 手动操作文章与标签的第三张表
  23.         # 用批量插入数据 bulk_create
  24.         b_list = []
  25.         for tag_id in tag_list:
  26.             b_list.append(models.Article2Tag(article=article_obj, tag_id=tag_id))
  27.         models.Article2Tag.objects.bulk_create(b_list)
  28.         return redirect(reverse('backend'))
  29.     # 获取文章分类、文章标签列表，让用户选择添加文章的分类与标签
  30.     category_list = models.Category.objects.filter(blog=request.user.blog)
  31.     tag_list = models.Tag.objects.filter(blog=request.user.blog)
  32.     return render(request, 'backend/add_article.html', locals())

19、Django时区及国际化设置

  1. LANGUAGE_CODE = 'zh-hans'   # 更改国际化翻译，中文
  3. TIME_ZONE = 'Asia/Shanghai'  # 更改东八区时间
  5. USE_TZ = False  #  表示数据库的同步时间，使用上面的东八区时间

20、models.py代码

  1. from django.db import models
  2. from django.contrib.auth.models import AbstractUser
  3. # Create your models here.
  5. # 用户表
  6. class UserInfo(AbstractUser):
  7.     phone = models.BigIntegerField(null=True, blank=True)  # blank=True 告诉后台管理该字段可以为空
  8.     # 存用户头像的地址
  9.     avatar = models.FileField(upload_to='avatar/', default='avatar/default.jpg')
  10.     create_time = models.DateField(auto_now_add=True)  # 创建时间自动
  12.     # 一个用户只能有一个站点，一个站点给一个用户用。一对一
  13.     blog = models.OneToOneField(to='Blog', null=True)
  15.     # admin后台管理页面展示的表名
  16.     class Meta:
  17.         verbose_name_plural = '用户表'
  19.     # 给前端便于展示
  20.     def __str__(self):
  21.         return self.username
  23. # 个人站点表
  24. class Blog(models.Model):
  25.     site_name = models.CharField(max_length=32)
  26.     site_title = models.CharField(max_length=64)
  27.     site_theme = models.CharField(max_length=64)  # 站点样式
  29.     class Meta:
  30.         verbose_name_plural = '个人站点表'
  32.     # 便于前端展示
  33.     def __str__(self):
  34.         return self.site_name
  36. # 分类表
  37. class Category(models.Model):
  38.     name = models.CharField(max_length=32)
  40.     # 一个站点有多个类，一个类中只有一个站点。一对多，外键在多的一张表中
  41.     blog = models.ForeignKey(to='Blog', null=True)
  43.     class Meta:
  44.         verbose_name_plural = '分类表'
  46.     def __str__(self):
  47.         return self.name
  49. # 标签表
  50. class Tag(models.Model):
  51.     name = models.CharField(max_length=32)      # 标签名
  52.     blog = models.ForeignKey(to='Blog', null=True)  # 一对多，外键在多的一张表中
  54.     class Meta:
  55.         verbose_name_plural = '标签表'
  57.     def __str__(self):
  58.         return self.name
  60. # 文章表
  61. class Article(models.Model):
  62.     title = models.CharField(max_length=64)     # 标题
  63.     desc = models.CharField(max_length=254)     # 摘要
  64.     content = models.TextField()                # 文章内容
  65.     create_time = models.DateTimeField('Edit the date', auto_now_add=True)  # 创建时间自动
  67.     # 这里考虑到复杂度，我们使用简单的版本。一篇文章只能分到一个类中。一对多的关系
  68.     # 一对多，分类字段
  69.     category = models.ForeignKey(to='Category', null=True)
  70.     # 多对多，标签字段
  71.     tags = models.ManyToManyField(to='Tag', through='Article2Tag', through_fields=('article', 'tag'))
  72.     # 一对多，个人站点字段。一个站点拥有多篇文章，一个文章只有一个站点
  73.     blog = models.ForeignKey(to='Blog', null=True)
  75.     # 数据库优化设计，把这三个字段加到文章表中，时时更新就行了。
  76.     # 不用再到下面这几张表中查询，减少了查询的次数
  77.     comment_num = models.BigIntegerField(null=True, default=0)  # 评论人数
  78.     up_num = models.BigIntegerField(null=True, default=0)       # 点赞人数
  79.     down_num = models.BigIntegerField(null=True, default=0)     # 点踩人数
  81.     class Meta:
  82.         verbose_name_plural = '文章表'
  84.     def __str__(self):
  85.         return self.title
  87. # 文章和标签的第三张关系表
  88. class Article2Tag(models.Model):
  89.     article = models.ForeignKey(to='Article')
  90.     tag = models.ForeignKey(to='Tag')
  92.     class Meta:
  93.         verbose_name_plural = '文章标签多对多关系表'
  95. # 点赞点踩表
  96. class UpAndDown(models.Model):
  97.     user = models.ForeignKey(to='UserInfo')     # 放用户名
  98.     article = models.ForeignKey(to='Article')   # 放文章
  99.     is_up = models.BooleanField()                # 标识赞或踩，0,1
  101.     class Meta:
  102.         verbose_name_plural = '点赞点踩表'
  104. # 评论表
  105. class Comment(models.Model):
  106.     user = models.ForeignKey(to='UserInfo')
  107.     article = models.ForeignKey(to='Article')  # 放文章
  108.     content = models.CharField(max_length=254)
  109.     comment_time = models.DateTimeField('Edit the date', auto_now_add=True)  # 评论时间
  110.     # 该字段存的是父评论的主键值
  111.     # 如果有值 说明当前评论是子评论  如果没有值 说明当前评论是根评论
  112.     parent = models.ForeignKey(to='self', null=True)
  114.     class Meta:
  115.         verbose_name_plural = '评论表'

21、urls.py代码

  1. """BBS URL Configuration
  3. The `urlpatterns` list routes URLs to views. For more information please see:
  4.     https://docs.djangoproject.com/en/1.11/topics/http/urls/
  5. Examples:
  6. Function views
  7.     1. Add an import:  from my_app import views
  8.     2. Add a URL to urlpatterns:  url(r'^$', views.home, name='home')
  9. Class-based views
  10.     1. Add an import:  from other_app.views import Home
  11.     2. Add a URL to urlpatterns:  url(r'^$', Home.as_view(), name='home')
  12. Including another URLconf
  13.     1. Import the include() function: from django.conf.urls import url, include
  14.     2. Add a URL to urlpatterns:  url(r'^blog/', include('blog.urls'))
  15. """
  16. from django.conf.urls import url
  17. from django.contrib import admin
  18. from app01 import views
  19. from django.views.static import serve
  20. from BBS import settings
  21. urlpatterns = [
  22.     url(r'^admin/', admin.site.urls),
  23.     # 注册
  24.     url(r'^register/', views.register, name='register'),
  25.     # 登录
  26.     url(r'^login/', views.login, name='login'),
  27.     # 获取图片验证码
  28.     url(r'^get_code/', views.get_code, name='get_code'),
  29.     # 首页
  30.     url(r'^home/', views.home, name='home'),
  31.     url(r'^$', views.home, name='home'),
  32.     # 修改密码
  33.     url(r'^set_password', views.set_password, name='set_password'),
  34.     # 编辑签名
  35.     url(r'^set_sign', views.set_sign, name='set_sign'),
  36.     # 修改用户头像
  37.     url(r'^set_avatar/', views.set_avatar, name='set_avatar'),
  38.     # 注销
  39.     url(r'^logout', views.logout, name='logout'),
  41.     # 暴露任意后端资源配置
  42.     url(r'^media/(?P<path>.*)', serve, {"document_root": settings.MEDIA_ROOT}),
  44.     # 点赞点踩
  45.     url(r'^up_or_down/', views.up_or_down, name='updown'),
  47.     # 文章评论
  48.     url(r'^comment/', views.comment, name='comment'),
  50.     # 后台管理
  51.     url(r'^backend/', views.backend, name='backend'),
  52.     # 添加文章
  53.     url(r'^add_article/', views.add_article, name='add_article'),
  54.     # 编辑分类
  55.     url(r'^edit_category/', views.edit_category, name='edit_category'),
  56.     # 编辑标签
  57.     url(r'^edit_tag/', views.edit_tag, name='edit_tag'),
  58.     # 添加分类
  59.     url(r'^create_category/', views.create_category, name='create_category'),
  60.     # 添加标签
  61.     url(r'^create_tag/', views.create_tag, name='create_tag'),
  62.     # 删除分类
  63.     url(r'^delete_category/(?P<del_id>\d+)/', views.delete_category, name='delete_category'),
  64.     # 删除标签
  65.     url(r'^delete_tag/(?P<del_id>\d+)/', views.delete_tag, name='delete_tag'),
  66.     # 编辑分类名
  67.     url(r'^edit_category_name/(?P<edit_id>\d+)/', views.edit_category_name, name='edit_category_name'),
  68.     # 编辑标签名
  69.     url(r'^edit_tag_name/(?P<edit_id>\d+)/', views.edit_tag_name, name='edit_tag_name'),
  70.     # 个人站点CSS设置
  71.     url(r'^blog_css/', views.blog_css, name='blog_css'),
  73.     # 编辑器上传图片
  74.     url(r'^upload_image/', views.upload_image, name='upload_image'),
  76.     # 个人站点
  77.     url(r'^(?P<username>\w+)/$', views.site, name='site'),
  79.     # 侧边栏筛选功能
  80.     # url(r'^(?P<username>\w+)/category/(\d+)', views.site),
  81.     # url(r'^(?P<username>\w+)/tag/(\d+)', views.site),
  82.     # url(r'^(?P<username>\w+)/archive/(.*)', views.site),
  83.     # 合并3条url
  84.     url(r'^(?P<username>\w+)/(?P<condition>category|tag|archive)/(?P<param>.*)/', views.site),
  86.     # 文章详情页
  87.     url(r'^(?P<username>\w+)/article/(?P<article_id>\d+)/', views.article_detail)
  88. ]

22、mytag代码

  1. from django.template import Library
  2. from app01 import models
  3. from django.db.models import Count
  4. from django.db.models.functions import TruncMonth
  5. register = Library()
  7. # 侧边栏渲染，自定义过滤器方法
  8. @register.inclusion_tag('left_menu.html', name='my_left')
  9. def index(username):
  10.     # 提供left_menu所需要的所有数据
  11.     user_obj = models.UserInfo.objects.filter(username=username).first()
  12.     blog = user_obj.blog
  13.     # 1.查询当前用户的分类及每个分类下的文章数
  14.     category_list = models.Category.objects.all().filter(blog=blog).annotate(article_sum=Count('article__pk')).values(
  15.         'article_sum', 'name', 'pk')
  17.     # 2.查询当前用户的标签，及每个标签下的文章数
  18.     tag_list = models.Tag.objects.all().filter(blog=blog).annotate(tag_sum=Count('article__pk')).values('tag_sum',
  19.                                                                                                         'name', 'pk')
  21.     # 3.按照文章的年月分组
  22.     date_list = models.Article.objects.filter(blog=blog).\
  23.         annotate(month=TruncMonth('create_time')).values(
  24.         'month').annotate(c=Count('pk')).values('c', 'month')
  25.     return locals()

DjangoBBS项目功能拆分的更多相关文章

  1. Maven 通过maven对项目进行拆分、聚合（重点）

    对现在已有maven ssh项目进行拆分,拆分思路:将dao层的代码已经配置文件全体提取出来到一个表现上独立的工程中.同样service.action拆分. ssh-parent: 父工程 ssh-d ...

  2. Maven项目的拆分与聚合

    ---------------------siwuxie095                                     Maven 项目的拆分与聚合         1.对已有的 Ma ...

  3. 【原】公司P2P平台的功能拆分

    银行回调:由原来写在PC门户项目中拆分开来,作为一个专门处理回调的项目,配置多个数据源,实时写入数据库. 定时回查:由原来写在PC后台管理项目中拆分开来,作为一个专门回查银行网关的项目. 请求银行:由 ...

  4. Vue项目功能插件

    项目功能插件 vue-router { path: '/', name: 'home', // 路由的重定向 redirect: '/home' } { // 一级路由, 在根组件中被渲染, 替换根组 ...

  5. GitHub项目功能理解

    目录 github账号看板使用方式 code issues Pull Requests Projects Insights Settings date: 2019-4-26 author:yangxi ...

  6. 学霸系统UI项目功能说明书 v1.0版本

    发布人员:软件工程实践小队. 发布内容:学霸系统UI项目说明书. 版本:学霸v1.0版本. 学霸系统UI项目说明书 v1.0版本分为以下部分: Part 1:用户须知: Part 2:功能实现: Pa ...

  7. Django 项目配置拆分独立

    目录 一.创建配置目录 二.创建基础配置文件 三.创建各个环境的配置 四.调整settings.py 五.程序使用 六.目录结构 Django 项目中,我们默认的配置是都在 settings.py 文 ...

  8. 企业nginx应用实例（功能拆分记录）

    一.默认访问协议强制跳转(http--->https) server { listen ; server_name dannylinux.top www.dannylinux.top; # re ...

  9. iOS- xib（nib） 的重用（在有些情况下有利于加快项目功能的实现）

    0.前言 在项目开发中,我们经常会碰到,某些视图View 内部基本空间都一样,只是数据不同,这时,我们可以用xib来将这个视图封装起来多次重用, (例如,大小固定 控件固定的TableViewCell ...

随机推荐

  1. 【题解】P1712 [NOI2016]区间(贪心+线段树)

    [题解]P1712 [NOI2016]区间(贪心+线段树) 一个observe是,对于一个合法的方案,将其线段长度按照从大到小排序后,他极差的来源是第一个和最后一个.或者说,读入的线段按照长度分类后, ...

  2. 洛谷$P$3327 约数个数和 $[SDOI2015]$ 莫比乌斯反演

    正解:莫比乌斯反演 解题报告: 传送门! 先考虑证明一个结论,$d_{i\cdot j}=\sum_{p|i}\sum_{q|j}[gcd(p,q)==1]$ 看起来就很对的样子,但还是证下趴$QwQ ...

  3. POJ2186 Popular Cows 题解 强连通分量

    题目链接:http://poj.org/problem?id=2186 题目大意: 每头牛都想成为牛群中的红人. 给定N头牛的牛群和M个有序对(A, B),(A, B)表示牛A认为牛B是红人: 该关系 ...

  4. Selenium python爬虫

    Selenium + Python3 爬虫 准备工作 Chrome驱动下载地址(可正常访问并下载),根据自己chrome的版本下载 Chrome版本 下载地址 78 https://chromedri ...

  5. KafkaProducer Sender 线程详解（含详细的执行流程图）

    目录 1.Sender 线程详解 2.RecordAccumulator 核心方法详解 温馨提示:本文基于 Kafka 2.2.1 版本. 上文 <源码分析 Kafka 消息发送流程> 已 ...

  6. VS Code配置C/C++环境

    VS Code配置C/C++环境 一.下载和安装VS Code 1.访问VS Code官网下载安装包 2.安装VS Code 3. 安装后, 打开VS Code是英文,按住Ctrl+shift+x进入 ...

  7. windows生成github密钥并推送文件踩坑

    强调官方文档最可靠,百度踩坑很浪费时间,建议去寻找一手数据源头 github官方文档提供了帮助 第一步 查看密钥 如果您还没有 SSH 密钥,则必须生成新 SSH 密钥. 如果您不确定是否已有 SSH ...

  8. vnpy源码阅读学习(2)：学习PyQt5

    PyQt5的学习 花费了一个下午把PyQt5大概的学习了下.找了一个教程 PyQt5教程 跟着挨着把上面的案例做了一遍,大概知道PyQt5是如何生成窗体,以及控件的.基本上做到如果有需求要实现,查查手 ...

  9. vue的param和query两种传参方式及URL的显示

    路由配置: // 首页 { path: '/home', name:'home', component:Home }, // 行情 { path: '/markets', name:'market', ...

  10. feign架构 原理解析

    什么是feign? 来自官网的解释:Feign makes writing java http clients easier 在使用feign之前,我们怎么发送请求? 拿okhttp举例: publi ...