表设计
注册功能
"""
1.注册功能需要forms组件
不同功能,可单独一个py文件2.利用forms组件渲染前端标签1.利用ajax提交2.forms组件获取用户数据的数据。$('#form').serializeArray()获取forms标签所有用户普通键值对的数据3. 手动渲染头像label里面内容,点击都会跳转到for指定的标签上4.实时展示用户头像 1.文件阅读器2.change时间3.onload等待加载完毕5.用户信息不合法,渲染提示信息1.forms组件渲染的标签id值有一个固定的特点id_字段名ps:获取id值:form.auto_id2.根据后端返回的字段以及字段对应的报错信息自己手动凭借对应字段的id值3. 提示功能的完善1.jQuery的链式操作2. input获取焦点事件"""
验证码
"""
图片相关模块
pip3 install pillow
"""from PIL import Image,ImageDraw,ImageFont"""
Image:生成图片
ImageDraw:能够图片上乱涂乱画
ImageFont:控制字体样式
"""
from io import BytesIO, StringIO"""
ByttesIO: 临时帮你储存数据,返回数据是二进制
StringIO: 临时帮你储存数据,返回数据是字符串
"""
url(r'^get_code/', views.get_code, name='get_code'),# 获取随机3个0-255数
def get_random():""":return: 返回0-255三个随机数,元组"""return random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)# 获取验证码
def get_code(request):# 1.产生一张随机颜色的图片img_obj = Image.new('RGB', (350, 35), get_random())# 2.产生一只在图片上的画笔img_draw = ImageDraw.Draw(img_obj)# 3.产生字体样式img_font = ImageFont.truetype(r'static\font\font.ttf', 35)# 产生5个随机验证码code = ''for i in range(5):upper_str = chr(random.randint(65, 90)) # 大写字母lower_str = chr(random.randint(97, 122)) # 小写字母random_int = str(random.randint(0, 9)) # 数字# 随机取一个temp_str = random.choice([upper_str, lower_str, random_int])# 写在图片上,位置,内容,颜色,字体#一个一个写,能控制间距img_draw.text((45 + i * 60, -2), temp_str, get_random(), font=img_font)# 储存code += temp_strprint(code)#验证码需要校验,所以找地方存起来,并且其他视图函数也能拿到request.session['code'] = codeio_obj = BytesIO() #生成一个内存管理器对象 可以看成文件句柄img_obj.save(io_obj, 'png') 把图片放进去return HttpResponse(io_obj.getvalue()) # 从内存管理器中读取二进制的图片数据返回给前端
前端代码:
<img src="/get_code/" alt="图片验证码" id="id_img">
js代码:
原理:src改变,立马刷新。点击一次图片,给url添加一个?号
$('#id_img').click(function () {var oldSrc = $(this).attr('src');$(this).attr('src', oldSrc += '?')});
参考:https://www.cnblogs.com/guyouyin123/p/12293758.html#2%E3%80%81%E6%B3%A8%E5%86%8C%E5%8A%9F%E8%83%BD