Flask实现登录界面功能

最新推荐文章于 2025-06-16 18:52:58 发布

原创最新推荐文章于 2025-06-16 18:52:58 发布 · 2.9k 阅读

8 ·

CC 4.0 BY-SA版权

文章标签：

#python

Flask 专栏收录该内容

5 篇文章

订阅专栏

文章目录

`后期需导入上述知识点的链接!!!`
`后期需导入上述知识点的链接!!!`
`添加后端渲染链接`!!!
`添加后端渲染链接`!!!

一. 数据库结构

1. 表结构分析 (重点)

图1 表结构分析

2.构建表结构

使用数据迁移来生成表结构
需要让模型文件和主程序建立关联

导入测试数据进入数据库, 使用source命令
图2 数据迁移并关联
tips:

# 如果导入内容只使用一次, 可以在使用前再进行导入, 可以减少导入错误的发生
  from info.modules.home import home_blu

`后期需导入上述知识点的链接!!!`

二.集成日志

作用: 记录web应用运行状态
配置日志
日志细节:

手动创建日志文件夹:为了同事pull后运行不出现bug
需要忽略日志文件夹中日志文件(logs/.log*)(设置好参数后,日志文件会循环覆盖;日志文件夹保留)
git不会上传空文件夹, 可以添加.keepgit文件来进行文件占位
建议使用flask封装的日志语法:editor live temples(包含了日志的位置)
日志中使用的上下文导入,后期给予链接!!!
tips:Flask默认日志也是使用的logging模块,两者都没有自动保存到文件中.

三.路由基本实现

1.跟路由实现

新闻网站需要SEO, 路由实现时优先考虑 后端渲染:

`添加后端渲染链接`!!!

使用蓝图对象定义路由
创建 templates 文件夹
模板渲染首页render_template(index.html")

2. `favicon` 设置

   # 网站的小图标对应一个固定的URL, 该图标的请求是由浏览器发起的, 而且只*请求一次*
  # web应用只要实现对应的路由, 并且返回图标图片即可
  @home_blu.route('/favicon.ico')
  def favicon():
  # app提供了一个方法send_static_file, 会读取文件的内容,包装为响应对象, 并且根据内容自动设置content-type
  return current_app.send_static_file("./news/favicon.ico")  # 该方法的相对路径是基于static文件夹

tips:此处是后端渲染,如果前端渲染(处理该问题),可参见:
https://blog.youkuaiyun.com/u012217533/article/details/46368251

四.注册登录

理清思路

1.开发流程

产品经理会牵头开产品研讨会, 展示产品功能, 产品需求(产品说明文档, 产品交互文档)
开发人员进行需求分析(项目经理, 前后端开发)
构建表结构
设计接口文档 (和前端协商接口, 一般由后端来完成)
根据接口文档, 前后端进行同步开发 (后端实现视图函数, 前端实现页面)
开发完接口, 使用POSTMAN进行测试
如果是后端渲染, 可能还需要进行前后端联调

2.获取图片验证码(重点)

交互过程
接口文档
接口功能:
```
获取`制定项目`的分类信息
```

demo:

# 不支持' ',只支持 "  "
$.ajax({
url:'请求地址',
type: '请求方式: 默认是'GET'，常用的还有'POST' ',
dataType: '设置返回的数据格式，常用的是'json'格式，也可以设置为'html' ',
data: '设置发送给服务器的数据',
success: '设置请求成功后的回调函数',
error: '设置请求失败后的回调函数',
async: '设置是否异步，默认值是'true'，表示异步'
})

图5 接口文档

生成图片验证码需要安装第三方包
pip install pillow
实现过程

获取和校验参数
生成图片验证码
保存验证码文字和图片key

返回图片自定义响应对象

 @passport_blu.route('/get_img_code')
 def get_img_code():
       # 获取参数
       img_code_id = request.args.get("img_code_id")
     # 校验参数
       if not img_code_id:
       return abort(403)  # 403拒绝访问 404资源没找到 500服务器错误

       # 生成图片验证码(图片&文字)
       img_name, img_text, img_bytes = captcha.generate_captcha()

       # 将图片key和验证码文字一起保存到数据库  redis 速度快/设置过期时间/满足键值关系
       try:
       rs.set("img_code_id_" + img_code_id, img_text, ex=IMAGE_CODE_REDIS_EXPIRES)
       except BaseException as e:
           current_app.logger.error(e)  # 错误记录到日志中
           return abort(500)

       # 返回图片  自定义响应对象
       response = make_response(img_bytes)  # type: Response
       # 设置响应头content-type
       response.content_type = "image/jpeg"
       return response

tips:此处存在数据库的改动,故try,进而log.

3.获取短信验证码(重点)

交互过程和接口文档
实现过程

1.获取和校验参数
2.根据图片key取验证码文字
3.校验验证码文字
4.发送短信
5.保存短信验证码
6.返回json形式的发送结果
demo:

   # 获取短信验证码
@passport_blu.route('/get_sms_code', methods=['POST'])
def get_sms_code():
    # 获取参数
    img_code_id = request.json.get("img_code_id")
    mobile = request.json.get("mobile")
    img_code = request.json.get("img_code")
    # 校验参数
    if not all([img_code_id, img_code, mobile]):
	return jsonify(errno=RET.PARAMERR, errmsg=error_map[RET.PARAMERR])  # 返回自定义的错误码
    
    if not re.match(r"^1[345678]\d{9}$", mobile):
	return jsonify(errno=RET.PARAMERR, errmsg=error_map[RET.PARAMERR])

    # 根据图片key取出验证码文字
    try:
	real_img_code = rs.get("img_code_id_" + img_code_id)
    except BaseException as e:
	current_app.logger.error(e)
	return jsonify(errno=RET.DBERR, errmsg=error_map[RET.DBERR])

    # 校验图片验证码
    if img_code.upper() != real_img_code:  # 验证码错误
	return jsonify(errno=RET.PARAMERR, errmsg=error_map[RET.PARAMERR])

    # 发送短信之前, 判断用户是否存在
    try:
	user = User.query.filter_by(mobile=mobile).first()
    except BaseException as e:
	current_app.logger.error(e)
	return jsonify(errno=RET.DBERR, errmsg=error_map[RET.DBERR])
    
    if user:
	return jsonify(errno=RET.DATAEXIST, errmsg=error_map[RET.DATAEXIST])

    # 生成`4位`随机短信验证码
    random_num = "%04d" % random.randint(0, 9999)  # 0112

    # 发送短信
    # response_code = CCP().send_template_sms(mobile, [random_num, SMS_CODE_REDIS_EXPIRES / 60], 1)
    # if response_code != 0:
    #     return jsonify(errno=RET.THIRDERR, errmsg=error_map[RET.THIRDERR])

    # 保存短信验证码  redis 设置过期时间 key:手机号   value:验证码数字
    try:
	rs.set("sms_code_id_" + mobile, random_num, ex=SMS_CODE_REDIS_EXPIRES)
    except BaseException as e:
	current_app.logger.error(e)
	return jsonify(errno=RET.DBERR, errmsg=error_map[RET.DBERR])

    # 输出验证码
    current_app.logger.info("短信验证码: %s" % random_num)

    # json形式返回发送结果
    return jsonify(errno=RET.OK, errmsg=error_map[RET.OK])

tips:

包含下面部分的代码
短信测试部分不用时可以关闭
如果结合前端代码测试后,出现bug,可先进行基本排查:

url
请求方式
Query String Parameters

4.第三方短信集成

配置容联云

集成第三方短信平台
demo:

  # 生成随机短信验证码
  random_num = "%04d" % random.randint(0, 9999)  # 0112

  # 发送短信
  # response_code = CCP().send_template_sms(mobile, [random_num, SMS_CODE_REDIS_EXPIRES / 60], 1)
  # if response_code != 0:
  #     return jsonify(errno=RET.THIRDERR, errmsg=error_map[RET.THIRDERR])

  # 保存短信验证码  redis 设置过期时间 key:手机号   value:验证码数字
  try:
  rs.set("sms_code_id_" + mobile, random_num, ex=SMS_CODE_REDIS_EXPIRES)
  except BaseException as e:
  current_app.logger.error(e)
  return jsonify(errno=RET.DBERR, errmsg=error_map[RET.DBERR])

  # 输出验证码
  current_app.logger.info("短信验证码: %s" % random_num)