一、生成验证码
二、富文本编辑器
三、文章摘要的保存
四、防止xss攻击
---------------------------------------
一、生成验证码
# 方式四：图片存内存，图片里加文字，噪点躁线，验证码存在session里
def get_validCode_img(request):
def get_random_color():
return (random.randint(0,255),
random.randint(0,255),
random.randint(0,255))
from PIL import Image,ImageDraw,ImageFont
from io import BytesIO
# RGB表示彩色图片，color表示背景色，只是创建文件对象还没生成图片
img=image.new("RGB",(270,40), color=get_random_color())
# 在img上画文字 text方法：text(坐标,文本,文本颜色,字体样式)
draw=ImageDraw.Draw(img)
# 字体对象，方法(字体路径，字体大小)
kumo_font = ImageFont.truetype("static/font/kumo.ttf",size=20)
# 生成随机验证码(字母+数字)
valid_code_str=""
for i in range(5):
random_num = str(random.randint(0,9))
random_low_alpha=chr(random.randomint(95,122))
random_upper_alpha=chr(random.randint(65,90))
random_char=random.choice([random_num,random_low_alpha,random_upper_alpha])
draw.text((i*30+20,5), char, get_random_color(), font=kumo_font)
request.session["valid_code_str"]=valid_code_str
# 生成噪点躁线,width为图片宽，height为图片高
width = 250
height = 40
for i in range(100):
x1=random.randint(0,width)
x2=random.randint(0,width)
y1=random.randint(0,height)
y2=random.randint(0,height)
draw.line((x1,y1,x2,y2), fill=get_random_color())
for i in range(400):
draw.point([random.randint(0, width), random.randint(0, height)], fill=random.get_random_color())
x=random.randint(0,width)
y=random.randint(0,height)
draw.arc((x,y,x+4,y+4), 0, 90, fill=get_random_color())
# 生成图片保存在内存
f=BytesIO()
img.save(f, "png")
# 读取图片
data=f.getvalue()
# 返回二进制图片
return HttpResponse(data)
二、富文本编辑器
编辑器：kindEditor(不支持图片复制拖动上传)，tinyMCE(支撑图片复制拖动上传)
官网： kindeditor.net/demo.php
文档：kindeditor.net/doc.php
使用方法===
前端：
<script charset="utf-8" src="/editor/kindeditor.js"></script>
<script charset="utf-8" src="/editor/lang/zh-CN.js"></script>
<script>
Editor.ready(function(K){
window.editor = K.create('#textarea_id',{
"800px", //编辑器宽度
height:"600px", //编辑器高度
resizeType:0, //编辑器可拉伸
uploadJson:"/upload/" //上传图片服务器请求路径
extraFileUploadParams:{
csrfmiddlewaretoken:$("[name='csrfmiddlewaretoken']").val()
},
filePostName:"upload_img", //上传文件在服务器dict里的key名称
});
})
<script>
后台：
def upload(request):
img = request.FILES.get("upload_img") # 获取上传的文件对象
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={
# 没有出错就是0
"error":0,
# 浏览器能直接访问到该图片的路径
"url":"/media/add_article_img/%s"%img.name,
}
return JsonResponse(response)
三、文章摘要的保存
文章的摘要(Article里的desc字段)怎么存？
不能用文章内容进行截断，因为这样会把标签也截到desc里了
怎样只截取文本部分呢？？
安装：pip install BeautifulSoup
Demo:
from bs4 import BeautifulSoup
s = "<h1>hello</h1><span>123</span>"
soup = BeautifulSoup(s, "html.parser")
print(soup.text) # hello123
四、防止xss攻击
用户的博客内容-如果输入标签<script></script>是不安全的。
之前的做法是渲染的时候: {{ content | safe }}这样做不安全,不会对标签转义
应该是用户输入标签内容就提示用户输入非法，让其重新输入内容
from bs4 import BeautifulSoup
s = "<h1>hello</h1><span>123</span><script>alert(123)</script>" # 过滤前的内容
soup = BeautifulSoup(s, "html.parser")
tag_list = soup.find_all() # [<h1>hello</h1>, <span>123</span>, <script>alert(123)</script>]
for tag in tag_list:
if tag.name == "script":
# 删除非法标签
tag.decompose()
# 过滤后的内容
content=str(soup) # <h1>hello</h1><span>123</span>