8. 博客系统| 富文本编辑框和基于bs4模块防御xss攻击
views.py
@login_required
def cn_backend(request):
article_list = models.Article.objects.filter(user=request.user)
return render(request, "backend/backend.html", locals())
@login_required
def add_article(request):
if request.method == "POST":
title = request.POST.get("title")
content = request.POST.get("content")
models.Article.objects.create(title=title, content=content,user=request.user)
return redirect("/cn_backend/")
return render(request, "backend/add_article.html")
import os
from cnblog import settings
def upload(request): print(request.FILES) img = request.FILES.get("upload_img")
print(img.name) path = os.path.join(settings.MEDIA_ROOT, "add_article_img", img.name)
with open(path, "wb") as f:
for line in img:
f.write(line)
response = {
"error":0,
"url":"/media/add_article_img/%s" % img.name
}
import json return HttpResponse(json.dumps(response))
add_article.html
{% extends 'backend/base.html' %}
{% block content %}
<form action="" method="post">
{% csrf_token %}
<div class="add_article">
<div class="alert-success text-center">添加文章</div>
<div class="add_article_region">
<div class="title form-group">
<label for="">标题</label>
<div>
<input type="text" name="title">
</div>
</div>
<div class="content form-group">
<label for="">内容(Kindeditor编辑器，不支持拖放/粘贴上传图片) </label>
<div>
<textarea name="content" id="article_content" cols="" rows=""></textarea>
</div>
</div>
<input type="submit" class="btn btn-default">
</div>
</div>
</form>
<script src="/static/js/jquery-3.2.1.min.js"></script>
<script charset="utf-8" src="/static/blog/kindeditor/kindeditor-all.js"></script>
<script>
KindEditor.ready(function (K) {
window.editor = K.create('#article_content', {
width: "",
height: "",
resizeType: 0,
uploadJson: "/upload/",
extraFileUploadParams: {
csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val()
},
filePostName: "upload_img"
});
});
</script>
{% endblock %}
backend.html
{% extends 'backend/base.html' %}
{% block content %}
<div class="article_list small">
<table class="table table-hover table-striped">
<thead>
<th>标题</th>
<th>评论数</th>
<th>点赞数</th>
<th>操作</th>
<th>操作</th>
</thead>
<tbody>
{% for article in article_list %}
<tr>
<td>{{ article.title }}</td>
<td>{{ article.comment_count }}</td>
<td>{{ article.up_count }}</td>
<td><a href="">编辑</a></td>
<td><a href="">删除</a></td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endblock %}
backend\base.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>博客后台管理 - 博客园</title> <link rel="stylesheet" href="/static/blog/bootstrap/css/bootstrap.css">
<script src="/static/js/jquery-3.2.1.min.js"></script>
<script src="/static/blog/bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/static/blog/css/backend.css">
</head>
<body> <div class="header">
<p class="title">
后台管理
<a class="info" href="/logout/">注销</a>
<span class="info"><span class="glyphicon glyphicon-user"></span> {{ request.user.username }}</span>
</p>
</div> <div class="container">
<div class="col-md-3">
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h4 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"
aria-expanded="true" aria-controls="collapseOne">
操作
</a>
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body">
<p><a href="/cn_backend/add_article/">添加文章</a></p>
</div>
</div>
</div> </div>
</div>
<div class="col-md-9"> <div> <!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab"
data-toggle="tab">文章</a></li>
<li role="presentation"><a href="#profile" aria-controls="profile" role="tab"
data-toggle="tab">日记</a></li>
<li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">眼镜</a>
</li>
<li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">相册</a>
</li>
</ul> <!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="home"> {% block content %} {% endblock %} </div>
<div role="tabpanel" class="tab-pane" id="profile"> <img src="/static/blog/img/meinv2.jpg" alt="">
<img src="/static/blog/img/meinv3.jpg" alt="">
<img class="pull-right" src="/static/blog/img/meinv.jpg" alt="">
</div>
<div role="tabpanel" class="tab-pane" id="messages"> <img width="" height="" src="/static/blog/img/hashiqi2.jpg" alt=""> <img width="" height="" src="/static/blog/img/dogg4.jpg" alt="">
<img width="" height="" src="/static/blog/img/linhaifeng.jpg" alt=""><br>
<img width="" height="" src="/static/blog/img/dogg3.jpeg" alt="">
<img width="" height="" src="/static/blog/img/dogge2.jpg" alt=""> <img width="" height="" src="/static/blog/img/dogg5.jpg" alt=""> </div>
<div role="tabpanel" class="tab-pane" id="settings"> </div>
</div> </div> </div>
</div> </body>
</html>
bs4截断文本段和基于bs4模块防御xss攻击
from bs4 import BeautifulSoup
@login_required
def add_article(request):
if request.method == "POST":
title = request.POST.get("title")
content = request.POST.get("content")
soup = BeautifulSoup(content, "html.parser")
#过滤
for tag in soup.find_all():
print(tag.name)
if tag.name == "script":
tag.decompose()
#获取文本进行截取，赋值给desc字段
desc = soup.text[0:150]
models.Article.objects.create(title=title,desc=desc,content=str(soup),user=request.user)
return redirect("/cn_backend/")
return render(request, "backend/add_article.html")
8. 博客系统| 富文本编辑框和基于bs4模块防御xss攻击的更多相关文章
- 富文本编辑框和防止xss攻击
一.后台管理页面构建 1.创建后台管理url urlpatterns = [ ... # 后台管理url re_path("cn_backend/$", views.cn_back ...
- python 全栈开发，Day83(博客系统子评论,后台管理,富文本编辑器kindeditor,bs4模块)
一.子评论 必须点击回复,才是子评论!否则是根评论点击回复之后,定位到输入框,同时加入@评论者的用户名 定位输入框 focus focus:获取对象焦点触发事件 先做样式.点击回复之后,定位到输入框, ...
- web开发-Django博客系统
项目界面图片预览 项目代码github地址 项目完整流程 项目流程: 1 搞清楚需求(产品经理) (1) 基于用户认证组件和Ajax实现登录验证(图片验证码) (2) 基于forms组件和Ajax实现 ...
- 从零开始，搭建博客系统MVC5+EF6搭建框架（5），博客详情页、留言、轮播图管理、右侧统计博文
一.博客系统进度回顾 上一遍博客介绍到,系统已经实现到了发布以及前台布局展示,接下来就是实现一些,详情页,留言.轮播图管理.右侧博文统计信息实现. 二.博客系统详情页实现 2.1先来看看详情页展示的效 ...
- 从零开始，搭建博客系统MVC5+EF6搭建框架（4）下，前后台布局实现、发布博客以及展示。
一.博客系统进度回顾 目前已经完成了,前台展示,以及后台发布的功能,最近都在做这个,其实我在国庆的时候就可以弄完的,但是每天自己弄,突然最后国庆2天,连电脑都不想碰,所以就一直拖着,上一篇写了前端实现 ...
- 【干货】利用MVC5+EF6搭建博客系统（四）（下）前后台布局实现、发布博客以及展示
二.博客系统后台布局实现 2.1.这里所用的是MVC的布局页来实现的,后台主要分为三部分:导航.菜单.主要内容 代码实现: 这里把后台单独放在一个区域里面,所以我这里建立一个admin的区域 在布局页 ...
- 基于开源博客系统（mblog）搭建网站
基于开源博客系统(mblog)搭建网站 上一章讲了基于jpress部署的博客系统,这一章了解一下 mblog这个开源的基于springboot的博客系统,相比与jpress 的热度fork数量要少一些 ...
- 【完全开源】Django多人博客系统——支持MarkDown和tinyMce
目录 说明 功能 如何使用 说明 这是一个用Django开发的多人博客系统,功能简单,但完全满足公司内部或个人的博客使用需求.支持普通富文本编辑器(tinyMCE)和MarkDown编辑器 由于嫌弃D ...
- 从零开始，搭建博客系统MVC5+EF6搭建框架（4）上,前后台页面布局页面实现，介绍使用的UI框架以及JS组件
一.博客系统进度回顾以及页面设计 1.1页面设计说明 紧接前面基础基本完成了框架搭建,现在开始设计页面,前台页面设计我是模仿我博客园的风格来设计的,后台是常规的左右布局风格. 1.2前台页面风格 主页 ...
随机推荐
- Telnet Protocol Specification
Network Working Group J. Postel Request for Comments: 854 J. Reynolds ISI Obsoletes: NIC 18639 May 1 ...
- MyBatis第一个案例的优化,通过映射文件与接口进行绑定
1.创建表emp CREATE DATABASE mybatis; USE mybatis; CREATE TABLE emp( id INT(11) PRIMARY KEY AUTO_INCREME ...
- PreparedStatement 基于mysql数据库做分页查询和统计查询
分页查询: 统计查询:
- 20155220 2016-2017-2 《Java程序设计》第七周学习总结
20155220 2016-2017-2 <Java程序设计>第七周学习总结 教材学习内容总结 Lambda 如果使用JDK8的话,可以使用Lambda特性去除重复的信息. 在只有Lamb ...
- OpenCV入门（1）- 简介
1.图像的表示 在计算机看来,图像只是一些亮度各异的点,一副M*N的图片可以用M*N的矩阵来表示,矩阵的值表示这个位置上像素的亮度. 一般灰度图用二维矩阵来表示,彩色(多通道)图用三维矩阵表示,大部分 ...
- [C++]数组与指针[二维数组与指针]
- Flask最强攻略 - 跟DragonFire学Flask - 第四篇 Flask 中的模板语言 Jinja2 及 render_template 的深度用法
是时候开始写个前端了,Flask中默认的模板语言是Jinja2 现在我们来一步一步的学习一下 Jinja2 捎带手把 render_template 中留下的疑问解决一下 首先我们要在后端定义几个字符 ...
- JXL导出Excel(只支持xls版本)——（一）
注意: 导出的后缀是xls可以直接打开,如果导出的后缀是xlsx打开报错,需要手动将名字改为xls才可以打开.也就是JXL不可以导出xlsx的excel. Jar包
- SpringBoot集成Dubbo
(1).新建一个普通Maven项目,用于存放一些公共服务接口及公共的Bean等. 项目: 公共Bean: package cn.coreqi.entities; import java.io.Seri ...
- C语言表驱动法编程实践
数据压倒一切.如果选择了正确的数据结构并把一切组织的井井有条,正确的算法就不言自明.编程的核心是数据结构,而不是算法. ——Rob Pike 说明 本文基于这样的认识:数据是易变的,逻辑是稳定的. ...