一、生成验证码
二、富文本编辑器
三、文章摘要的保存
四、防止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',{ width:"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 BeautifulSoupDemo:
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>