一、登录功能

views.py

0难度,都是基本操作,要熟悉auth模块的使用

  1. # 登录功能
  2. def login(request):
  3. # 1 获取前端传来的数据
  4. if request.method=='POST':
  5. back_dic = {'code':0,'msg':''}
  6. username = request.POST.get('username')
  7. password = request.POST.get('password')
  8. code = request.POST.get('code')
  9. # 2 验证验证码是否正确
  10. if code == request.session.get('code'):
  11. obj = auth.authenticate(request,username=username,password=password)
  12. # 3 验证用户是否正确
  13. if obj:
  14. auth.login(request,obj)
  15. back_dic['code'] = 1000
  16. # 登录成功后跳转到home页面
  17. back_dic['url'] = '/home/'
  18. # 错误信息msg在前端要渲染到错误标签位置
  19. else:
  20. back_dic['msg'] = '账号或密码错误'
  21. else:
  22. back_dic['msg'] = '验证码错误'
  23. return JsonResponse(back_dic)
  24. # 4 针对不同的情况返回不同的json数据(注意:通常ajax请求都需要一个字典去执行不同情况的结果)
  25. return render(request,'login.html')

二、首页搭建

home.html

  1. 对页面布局的使用
  2. 熟练掌握前端组件的拷贝和应用
  3. ajax请求基本操作
  4. 静态文件暴露(展示头像)
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. <link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
  7. <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
  8. <script src="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
  9. </head>
  10. <body>
  11. <nav class="navbar navbar-inverse">
  12. <div class="container-fluid">
  13. <!-- Brand and toggle get grouped for better mobile display -->
  14. <div class="navbar-header">
  15. <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
  16. <span class="sr-only">BBS</span>
  17. <span class="icon-bar"></span>
  18. <span class="icon-bar"></span>
  19. <span class="icon-bar"></span>
  20. </button>
  21. <a class="navbar-brand" href="#">BBS</a>
  22. </div>
  23. <!-- Collect the nav links, forms, and other content for toggling -->
  24. <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
  25. <ul class="nav navbar-nav">
  26. <li class="active"><a href="#">文章 <span class="sr-only">(current)</span></a></li>
  27. <li><a href="#">用户</a></li>
  28. <li class="dropdown">
  29. <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
  30. <ul class="dropdown-menu">
  31. <li><a href="#">Action</a></li>
  32. <li><a href="#">Another action</a></li>
  33. <li><a href="#">Something else here</a></li>
  34. <li role="separator" class="divider"></li>
  35. <li><a href="#">Separated link</a></li>
  36. <li role="separator" class="divider"></li>
  37. <li><a href="#">One more separated link</a></li>
  38. </ul>
  39. </li>
  40. </ul>
  41. <form class="navbar-form navbar-left">
  42. <div class="form-group">
  43. <input type="text" class="form-control" placeholder="Search">
  44. </div>
  45. <button type="submit" class="btn btn-default">Submit</button>
  46. </form>
  47. {# 判断用户是否登录#}
  48. <ul class="nav navbar-nav navbar-right">
  49. {% if request.user.is_authenticated %}
  50. <li><a href="#">{{ request.user.username }}</a></li>
  51. <li class="dropdown">
  52. <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">更多 <span class="caret"></span></a>
  53. <ul class="dropdown-menu">
  54. <li><a href="#" data-toggle="modal" data-target=".bs-example-modal-lg">修改密码</a></li>
  55. <li><a href="/logout/">退出登录</a></li>
  56. <li><a href="#">修改头像</a></li>
  57. <li><a href="#">后台管理</a></li>
  58. </ul>
  59. </li>
  60. {% else %}
  61. <li><a href="/login/">登录</a></li>
  62. <li><a href="/register/">注册</a></li>
  63. {% endif %}
  64. </ul>
  65. <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
  66. <div class="modal-dialog modal-lg" role="document">
  67. <div class="modal-content">
  68. <h1 class="text-center">修改密码</h1>
  69. <div class="row">
  70. <div class="col-md-8 col-md-offset-2">
  71. <div class="form-group">
  72. <label for="">用户名:</label>
  73. <input type="text" class="form-control" disabled value="{{ request.user }}">
  74. </div>
  75. <div class="form-group">
  76. <p>原密码:<input type="password" class="form-control" id="old_password"></p>
  77. </div>
  78. <p>新密码:<input type="password" class="form-control" id="new_password"></p>
  79. <p>确认密码<input type="password" class="form-control" id="password_again"></p>
  80. </div>
  81. </div>
  82. <div class="modal-footer">
  83. <span style="color: red" id="error"></span>
  84. <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
  85. <button type="button" class="btn btn-primary" id="mybtn">提交</button>
  86. </div>
  87. </div>
  88. </div>
  89. </div>
  90. </div><!-- /.navbar-collapse -->
  91. </div><!-- /.container-fluid -->
  92. </nav>
  93. <div class="container-fluid">
  94. <div class="row">
  95. <div class="col-md-2">
  96. <div class="panel panel-default">
  97. <div class="panel-heading">性感荷官</div>
  98. <div class="panel-body">
  99. 在线发牌
  100. </div>
  101. </div>
  102. <div class="panel panel-default">
  103. <div class="panel-heading">
  104. <h3 class="panel-title">知名女优</h3>
  105. </div>
  106. <div class="panel-body">
  107. 等你来战
  108. </div>
  109. </div>
  110. </div>
  111. <div class="col-md-8">
  112. {% for article in article_list %}
  113. <ul class="media-list">
  114. <li class="media">
  115. <h3 class="media-heading"><a>{{ article.title }}</a></h3>
  116. <div class="media-left">
  117. <a href="#">
  118. <img class="media-object" src="/media/{{ article.blog.userinfo.avatar }}" height="80px">
  119. </a>
  120. </div>
  121. <div class="media-body">
  122. {{ article.desc }}
  123. </div>
  124. <br>
  125. <div style="color: #a9a9a9">
  126. <span><a href="/{{ article.blog.userinfo.username }}">{{ article.blog.userinfo.username }}&nbsp&nbsp</a></span>
  127. <span>发布于&nbsp</span>
  128. <span>{{ article.create_time|date:'Y年m月d日' }}&nbsp&nbsp</span>
  129. <span><span class="glyphicon glyphicon-comment"></span>&nbsp评论({{ article.comment_num }})</span>
  130. <span><span class="glyphicon glyphicon-thumbs-up"></span>&nbsp点赞({{ article.up_num }})</span>
  131. </div>
  132. </li>
  133. </ul>
  134. <hr>
  135. {% endfor %}
  136. </div>
  137. <div class="col-md-2">
  138. <div class="panel panel-default">
  139. <div class="panel-heading">性感荷官</div>
  140. <div class="panel-body">
  141. 在线发牌
  142. </div>
  143. </div>
  144. <div class="panel panel-default">
  145. <div class="panel-heading">
  146. <h3 class="panel-title">知名女优</h3>
  147. </div>
  148. <div class="panel-body">
  149. 等你来战
  150. </div>
  151. </div>
  152. </div>
  153. </div>
  154. </div>
  155. <script>
  156. $('#mybtn').click(function () {
  157. $.ajax({
  158. url:'/set_password',
  159. type:'post',
  160. data:{
  161. 'old_password':$('#old_password').val(),
  162. 'new_password':$('#new_password').val(),
  163. 'password_again':$('#password_again').val(),
  164. 'csrfmiddlewaretoken': '{{ csrf_token }}'
  165. },
  166. success:function (args) {
  167. if(args.code == 1000){
  168. window.location.href = args.url
  169. }else {
  170. $('#error').text(args.msg)
  171. }
  172. }
  173. })
  174. })
  175. </script>
  176. </body>
  177. </html>

settings.py

  1. # 用户上传的文件应该存储到专门的文件夹,类比static
  2. # 但是此处只是配置了路径,还没有在url开放接口
  3. MEDIA_ROOT = os.path.join(BASE_DIR,'media')

url.py

  1. from django.views.static import serve
  2. from app01 import settings
  3. # 在前端开放接口后才能直接访问对应资源的文件
  4. url(r'^mdedia/(?P<path>.*)',serve,{'document_root':settings.MEDIA_ROOT})

三、admin后台管理

  1. '''
  2. django有一个可视化后台管理界面,对数据进行增删改查
  3. 先要在admin.py注册你要操作的表
  4. '''
  5. from django.contrib import admin
  6. from app01 import models
  7. # Register your models here.
  8. admin.site.register(models.UserInfo)
  9. admin.site.register(models.Tag)
  10. admin.site.register(models.Blog)
  11. admin.site.register(models.Article)
  12. admin.site.register(models.Article2Tag)
  13. admin.site.register(models.Category)
  14. admin.site.register(models.Comment)
  15. admin.site.register(models.UpAndDowm)
  16. '''
  17. 然后用有管理员权限的用户登录admin,每个表有对应的增删改查功能
  18. 这里要特别注意表关系,不能瞎绑定
  19. 注意在models.py中设计表的时候有一些参数可以帮助我们更清晰的观察表
  20. '''
  21. # verbose_name 可以在管理界面代替title展示给用户
  22. title = models.CharField(max_length=32,verbose_name='文章标题')
  23. # null=True 是告诉数据库可以为空,blank=True 是告诉管理后端可以为空
  24. phone = models.BigIntegerField(null=True,blank=True)
  25. # 修改表名
  26. class Meta:
  27. #verbose_name = '用户表' # 这种方式默认后面加s
  28. verbose_name_plural = '用户表'
  29. # 代替数据对象展示在前端
  30. def __str__(self):
  31. return self.username

四、图片防盗链

可以避免别的网站直接通过本网站的url访问本网站资源

简单的防盗:

如果是本网站发送的请求就正常访问,不是就拒绝访问

在请求头中有一个参数专门用来存放请求来源

Referer:http://127.0.0.1:8000/xxx/

如何避免:

直接修改请求头

直接爬取对方网址内的资源

五、个人站点展示

  1. 展示的时候需要熟练掌握跨表查询应用(聚合函数,分组查询)
  2. 对于不同筛选条件的url(有名分组)
  3. 日期类型特定筛选(TruncMouth)

views.py

  1. def site(request,username,**kwargs):
  2. user_obj = models.UserInfo.objects.filter(username=username).first()
  3. if not user_obj:
  4. return render(request,'error.html')
  5. blog = user_obj.blog
  6. article_list = models.Article.objects.filter(blog=blog)
  7. print(kwargs)
  8. if kwargs:
  9. condition = kwargs.get('condition')
  10. param = kwargs.get('param')
  11. print(condition,param)
  12. if condition == 'category':
  13. article_list = article_list.filter(category_id = param)
  14. elif condition == 'tag':
  15. article_list = article_list.filter(tag__id = param)
  16. else:
  17. year,month = param.split('-')
  18. article_list = article_list.filter(create_time__year =year,create_time__month=month)
  19. # 1 查询当前用户所有的分类及分类下的文章数
  20. category_list = models.Category.objects.filter(blog=blog).annotate(count_num = Count('article__pk')).values_list('name','count_num','pk')
  21. # 2 查询当前用户下所有的标签下的文章数
  22. tag_list = models.Tag.objects.filter(blog=blog).annotate(count_num = Count('article__pk')).values_list('name','count_num','pk')
  23. # 3 以创建日期为分类
  24. date_list = models.Article.objects.filter(blog=blog).annotate(mouth = TruncMonth('create_time')).values('mouth').annotate(count_num=Count('pk')).values_list('mouth','count_num')
  25. return render(request,'site.html',locals())

site.html

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. <link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
  7. <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
  8. <script src="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
  9. </head>
  10. <body>
  11. <nav class="navbar navbar-inverse">
  12. <div class="container-fluid">
  13. <!-- Brand and toggle get grouped for better mobile display -->
  14. <div class="navbar-header">
  15. <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
  16. <span class="sr-only">BBS</span>
  17. <span class="icon-bar"></span>
  18. <span class="icon-bar"></span>
  19. <span class="icon-bar"></span>
  20. </button>
  21. <a class="navbar-brand" href="#">{{ blog.site_name }}</a>
  22. </div>
  23. <!-- Collect the nav links, forms, and other content for toggling -->
  24. <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
  25. <ul class="nav navbar-nav">
  26. <li class="active"><a href="#">文章 <span class="sr-only">(current)</span></a></li>
  27. <li><a href="#">用户</a></li>
  28. <li class="dropdown">
  29. <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
  30. <ul class="dropdown-menu">
  31. <li><a href="#">Action</a></li>
  32. <li><a href="#">Another action</a></li>
  33. <li><a href="#">Something else here</a></li>
  34. <li role="separator" class="divider"></li>
  35. <li><a href="#">Separated link</a></li>
  36. <li role="separator" class="divider"></li>
  37. <li><a href="#">One more separated link</a></li>
  38. </ul>
  39. </li>
  40. </ul>
  41. <form class="navbar-form navbar-left">
  42. <div class="form-group">
  43. <input type="text" class="form-control" placeholder="Search">
  44. </div>
  45. <button type="submit" class="btn btn-default">Submit</button>
  46. </form>
  47. {# 判断用户是否登录#}
  48. <ul class="nav navbar-nav navbar-right">
  49. {% if request.user.is_authenticated %}
  50. <li><a href="#">{{ request.user.username }}</a></li>
  51. <li class="dropdown">
  52. <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">更多 <span class="caret"></span></a>
  53. <ul class="dropdown-menu">
  54. <li><a href="#" data-toggle="modal" data-target=".bs-example-modal-lg">修改密码</a></li>
  55. <li><a href="/logout/">退出登录</a></li>
  56. <li><a href="#">修改头像</a></li>
  57. <li><a href="#">后台管理</a></li>
  58. </ul>
  59. </li>
  60. {% else %}
  61. <li><a href="/login/">登录</a></li>
  62. <li><a href="/register/">注册</a></li>
  63. {% endif %}
  64. </ul>
  65. <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
  66. <div class="modal-dialog modal-lg" role="document">
  67. <div class="modal-content">
  68. <h1 class="text-center">修改密码</h1>
  69. <div class="row">
  70. <div class="col-md-8 col-md-offset-2">
  71. <div class="form-group">
  72. <label for="">用户名:</label>
  73. <input type="text" class="form-control" disabled value="{{ request.user }}">
  74. </div>
  75. <div class="form-group">
  76. <p>原密码:<input type="password" class="form-control" id="old_password"></p>
  77. </div>
  78. <p>新密码:<input type="password" class="form-control" id="new_password"></p>
  79. <p>确认密码<input type="password" class="form-control" id="password_again"></p>
  80. </div>
  81. </div>
  82. <div class="modal-footer">
  83. <span style="color: red" id="error"></span>
  84. <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
  85. <button type="button" class="btn btn-primary" id="mybtn">提交</button>
  86. </div>
  87. </div>
  88. </div>
  89. </div>
  90. </div><!-- /.navbar-collapse -->
  91. </div><!-- /.container-fluid -->
  92. </nav>
  93. <div class="container-fluid">
  94. <div class="row">
  95. <div class="col-md-2">
  96. <div class="panel panel-default">
  97. <div class="panel-heading">文章标签</div>
  98. <div class="panel-body">
  99. {% for tag in tag_list %}
  100. <p><a href="/{{ username }}/tag/{{ tag.2 }}">{{ tag.0 }} ({{ tag.1 }})</a></p>
  101. {% endfor %}
  102. </div>
  103. </div>
  104. <div class="panel panel-default">
  105. <div class="panel-heading">
  106. <h3 class="panel-title " >文章分类</h3>
  107. </div>
  108. <div class="panel-body">
  109. {% for category in category_list %}
  110. <p><a href="/{{ username }}/category/{{ category.2 }}">{{ category.0 }} ({{ category.1 }})</a></p>
  111. {% endfor %}
  112. </div>
  113. </div>
  114. <div class="panel panel-default">
  115. <div class="panel-heading">
  116. <h3 class="panel-title " >日期</h3>
  117. </div>
  118. <div class="panel-body">
  119. {% for date in date_list %}
  120. <p><a href="/{{ username }}/archive/{{ date.0|date:'Y-m' }}">{{ date.0 }} ({{ date.1 }})</a></p>
  121. {% endfor %}
  122. </div>
  123. </div>
  124. </div>
  125. <div class="col-md-8">
  126. {% for article in article_list %}
  127. <ul class="media-list">
  128. <li class="media">
  129. <h3 class="media-heading"><a>{{ article.title }}</a></h3>
  130. <div class="media-left">
  131. <a href="#">
  132. <img class="media-object" src="/media/{{ article.blog.userinfo.avatar }}" height="80px">
  133. </a>
  134. </div>
  135. <div class="media-body">
  136. {{ article.desc }}
  137. </div>
  138. <br>
  139. <div style="color: #a9a9a9">
  140. <span>posted&nbsp;&nbsp;</span>
  141. <span>@&nbsp;</span>
  142. <span>{{ article.create_time|date:'Y年m月d日' }}&nbsp;&nbsp;</span>
  143. <span><span class="glyphicon glyphicon-comment"></span>&nbsp评论({{ article.comment_num }})</span>
  144. <span><span class="glyphicon glyphicon-thumbs-up"></span>&nbsp点赞({{ article.up_num }})</span>
  145. <span><a href="#">编辑</a></span>
  146. </div>
  147. </li>
  148. </ul>
  149. <hr>
  150. {% endfor %}
  151. </div>
  152. </div>
  153. </div>
  154. </body>
  155. </html>

urls.py

  1. url(r'^(?P<username>\w+)/$',views.site),
  2. url(r'^(?P<username>\w+)/(?P<condition>category|tag|archive)/(?P<param>.*)/',views.site)

day73 bbs项目☞基本功能实现的更多相关文章

  1. BBS项目分布搭建三(个人站点时间归档补充,实现侧边栏跳转、无线级分类、实现文章详情页展示功能)

    BBS项目分布搭建三(个人站点时间归档补充,) 1. 个人站点时间归档 """ settings.py设置最好更改以下: LANGUAGE_CODE = 'zh-hans ...

  2. BBS项目分布搭建四(点赞点踩及评论功能准备)

    BBS项目分布搭建四(点赞点踩及评论功能) 1. 点赞点踩样式准备 # 在base.html文件中 head标签内 添加css模块: {% block css %} {% endblock %} # ...

  3. BBS项目分布搭建五(评论相关功能实现)

    BBS项目分布搭建五(评论相关) 1. 根评论逻辑实现 # 在models.py文件中 修改: # 7. 评论表 parent = models.ForeignKey(to='self', null= ...

  4. BBS项目补充知识(后台文章展示功能)

    BBS项目补充知识 1. 开放 media 文件路径 # 以用户注册页面为例 用户头像文件我们默认时保存在 根路径下的static下的img文件夹 但也可以单独放置在指定路径下 # 根路径下创建 me ...

  5. BBS项目详解(forms快速创建登陆页面,登陆验证、通过阅读器进行头像上传的预览、内存管理器)

    BBS项目涉及的知识点 django中知识点 钩子函数(局部钩子和全局钩子) 1.局部钩子就是用来做合法性校验,比如用户名有没有被使用等 2.全局的就是用来做对比校验,比如两次输入的密码是否一致 3. ...

  6. auth复习和BBS项目的登录(1)

    auth复习 auth组件 验证:authenticate(request,username='andy',password='123) 登录:login(request,user) 注销:login ...

  7. python 自动化之路 day 20 Django进阶/BBS项目【一】

    一.django进阶 1.django orm 增删改查 1.1.创建表: 1 2 3 >>> from blog.models import Blog >>> b ...

  8. BBS项目-01

    目录 BBS项目 BBS开发流程: BBS表格创建: BBS项目 BBS开发流程: BBS项目: 开发流程: 需求分析 草拟一些项目的大致技术点和流程 架构设计 架构师(框架 语言 数据库 缓存数据库 ...

  9. 小福bbs—项目系统设计与数据库设计

    这个作业属于哪个课程 班级链接 这个作业要求在哪里 作业要求的链接 团队名称 小福bbs 这个作业的目标 实现对校园论坛软件的制作,使其能够发布帖子,查看信息等 作业的正文 小福bbs--项目需求分析 ...

随机推荐

  1. mysql 双机互备份

    //1.创建用户CREATE USER 'dump'@'%' IDENTIFIED BY 'dump'; //2.开放权限GRANT ALL ON *.* TO 'dump'@'%'; //3.刷新权 ...

  2. 02、MyBatis XML配置

    MyBatis-全局配置文件 在MyBatis中全局配置文件有着重要的地位,里面有9类行为信息;如果我们要想将MyBatis运用的熟练,配置全局配置文件是必不可少的步骤,所以我们一定要啃下这一块硬骨头 ...

  3. [转] VMware中的Ubuntu无法通过桥接方式上网

    遇到的问题:主机可以上网(使用了代理),VMware设置为桥接方式连网.在主机中可以ping通虚拟机,在虚拟机中也可以ping通主机,可是在虚拟机中始终连接不了因特网. 感谢刘洋同学的博文,“在桥接模 ...

  4. Win10下Tensorflow的安装

    Win10下Tensorflow的安装 1. Tensorflow简介 TensorFlow是谷歌基于DistBelief进行研发的第二代人工智能学习系统,其命名来源于本身的运行原理.Tensor(张 ...

  5. @hdu - 6607@ Easy Math Problem

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 求: \[\sum_{i=1}^{n}\sum_{j=1}^{n ...

  6. Bumped!【迪杰斯特拉消边、堆优化】

    Bumped! 题目链接(点击) Peter returned from the recently held ACM ICPC World Finals only to find that his r ...

  7. git&github&Jenkins完成可持续集成

    1.安装git :想要安装Git首先要下载Git的安装包程序. Git安装包下载地址:https://git-scm.com/downloads/ 2.双击下载git安装包进入安装界面, 点击下一步, ...

  8. PowerBuilder中调用NPOI进行Excel导出格式设置示例

    // 功能 :新建excel带边框的单元格,格式为数字并显示为美元货币 // 参数 :ai_row,行号:ai_col,列号 // 返回值 :true/false // 作者 :潮崖之飔 // 日期 ...

  9. IDEA之maven配置详解

    这两天被maven配置搞得焦头烂额,前后忙活了三天才彻底搞定. 下面我总结一下配置的步骤. 步骤 1. 首先去maven官网去下载maven,http://maven.apache.org/ 这里教大 ...

  10. Accelerate Framework in Swift

    介绍: 最近看到这篇文章有对Accelerate框架有一个介绍,自己也按照作者给的思路整理了一遍,也算是对这一框架的一个重新的回顾和学习,在以前研究AR先关只是的时候有接触到这个框架,赞具体里面的东西 ...