FLASK+VUE--前后端分离(一)-Flask基础讲解之路由、视图函数---注册登...

小程序840 更新时间：2025-06-08 15:24:11

2023年8月1日发(作者：)

FLASK+VUE--前后端分离（⼀）-Flask基础讲解之路由、视图函数----注册登录代码实现⼀、Flask简易介绍1、Flask是⽬前⼗分流⾏的web框架，它是⼀个轻量级的可定制微框架，使⽤Python语⾔编写，较其他同类型框架更为灵活、轻便、安全且容易上⼿。2、微框架中的“微”是指Flask旨在保持代码简洁且易于扩展。3、框架的简易理解及区别：⽬前Python的web框架有很多。除了Flask，还有django等等django是⽬前Python的框架中使⽤度最⾼的，但是Django如同java⼤多数被⽤于⼤型⽹站的开发。Flask但对于⼤多数的⼩型⽹站的开发Flask就可以满⾜，和其他的轻量级框架相⽐较，Flask框架有很好的扩展性，这是其他Web框架不可替代的。⼆、Flask前后端分离教程之简单剖析1、框架结构的分析学习Flask个⼈总结就分两种理解去学习，1是路由、2就是视图函数。为什么说分两种，那么⼤家就要了解⼀下，什么是路由，什么是视图函数。1、路由：叫做注册路由官⽅⽂档解释：在Flask应⽤中，路由是指⽤户请求的URL与视图函数之间的映射。Flask框架根据HTTP请求的URL在路由表中匹配预定义的URL规则，找到对应的视图函数，并将视图函数的执⾏结果返回WSGI服务器个⼈解释：客户端（例如Web浏览器）把请求发送给Web服务器，Web服务器再把请求发送给Flask程序实例。程序实例需要知道对每个URL请求运⾏哪些代码，所以保存了⼀个URL到python函数的映射关系。处理URL和函数之间关系的程序称为路由。什么是WSGI服务器：官⽅定义:wsgi是Web服务器⽹关接⼝（Python Web Server Gateway Interface，缩写为WSGI）是为Python语⾔定义的Web服务器和Web应⽤程序或框架之间的⼀种简单⽽通⽤的接⼝。总结：wsgi就是⼀种规范，它定义了使⽤web应⽤程序与Python编写的web服务器程序之间的接⼝格式.⽆论多么复杂的Web应⽤程序，⼊⼝都是⼀个WSGI处理函数。2、什么是视图函数个⼈理解：视图函数主要负责逻辑处理的结果展现给⽤户，这⾥分两个框架来解释。django：必须有⼀个形参必须返回⼀个HttpResponse对象，也可以是JsonResponse对象，看业务需求from import HttpResponse

def my_view(request): if == 'GET': return HttpResponse('OK')flask：必须有个函数注册为程序跟地址的处理程序必须返回⼀个response对象，所以我们会⽤到make_response的函数，使返回的数据构建成⼀个response的对象from flask import Flask, make_response

# Flask类只有⼀个必须指定的参数，即程序主模块或者包的名字，__name__是系统变量，该变量指的是本py⽂件的⽂件名app = Flask(__name__)# 装饰器，把装饰的函数注册为路由@('/')def run(): #

这就是视图 return make_response("OK")三、Flask实现简单接⼝刚才说过分路由、视图函数，那么放到代码中怎么解释呢？如下路由分为：127.0.0.1:8080 + / + get/post等请求⽅式视图函数分为：request、data、response实例：（1）⽆参数请求from flask import Flask, make_response# Flask类只有⼀个必须指定的参数，即程序主模块或者包的名字，__name__是系统变量，该变量指的是本py⽂件的⽂件名app = Flask(__name__)@('/', methods=['GET', 'POST']) #

这是路由,定义是GET请求还是POST请求⽅式，那么我们什么时候⽤到GET，什么时候⽤POST？规范是获取数据⽤GET，有参数请求或者修改数据⽤POST。看项⽬需要。def run(): #

这是视图函数 res = { 'code': 0, 'msg': "OK", 'data': { 'test': '测试页⾯' } } return make_response(res)if __name__ == '__main__': (host='0.0.0.0', port=8080, debug=False, threaded=True)postman调⽤flask了解更多路由写法，请点击：（2）带参数请求带参数分两种格式：1、formData格式from flask import Flask, make_response, requestfrom flask_cors import CORS #

引⽤CORS，后期需要VUE⽀持跨域访问会⽤到# Flask类只有⼀个必须指定的参数，即程序主模块或者包的名字，__name__是系统变量，该变量指的是本py⽂件的⽂件名app = Flask(__name__)# resources全局配置允许跨域的API接⼝，我们这边为了学习，配置所有，详细学习请百度搜索⽂档CORS(app, resources=r'/*')@('/', methods=['GET', 'POST'])def run(): username = ('username', type=str) # formData格式区分 password = ('password', type=int) # formData格式区分 if username == 'admin' and password == 123: res = { 'code': 0, 'msg': "OK", 'data': { 'test': '测试页⾯' } } else: res = { 'code': 999, } return make_response(res)if __name__ == '__main__': (host='0.0.0.0', port=8080, debug=False, threaded=True)postman调⽤2、json格式from flask import Flask, make_response, requestfrom flask_cors import CORS #

引⽤CORS，后期需要VUE⽀持跨域访问会⽤到# Flask类只有⼀个必须指定的参数，即程序主模块或者包的名字，__name__是系统变量，该变量指的是本py⽂件的⽂件名app = Flask(__name__)# resources全局配置允许跨域的API接⼝，我们这边为了学习，配置所有，详细学习请百度搜索⽂档CORS(app, resources=r'/*')@('/', methods=['GET', 'POST'])def run(): getJson = _json() username = str(('username')) # json数据格式 password = int(('password')) # json数据格式 if username == 'admin' and password == 123: res = { 'code': 0, 'msg': "OK", 'data': { 'test': '测试页⾯' } } else: res = { 'code': 999, } return make_response(res)if __name__ == '__main__': (host='0.0.0.0', port=8080, debug=False, threaded=True)postman调⽤四、Flask获取前端header数据运⽤flask内的⽅法去获取headers的值很简单的⼀个⽅法，这⾥就⽤获取headers内的Host来做教程('Host')如果是要获取cookies那么就⽤下列⽅法('cookies')实例from flask import Flask, make_response, requestfrom flask_cors import CORSapp = Flask(__name__)CORS(app, resources=r'/*')@('/', methods=['GET', 'POST'])def run(): host = ('Host') #

获取headers内的host print(host) return make_response('ok')if __name__ == '__main__': (host='0.0.0.0', port=8080, debug=False, threaded=True)postman调⽤更多获取数据请参考下⽅合集scheme = #

获取请求⽅案（协议）method = #

获取本次请求的请求⽅式args = #

获取使⽤GET请求⽅式提交的数据form = #

获取POST请求⽅式提交的数据values = #

获取GET和POST请求⽅式提交的数据cookies = s #

获取COOKIES中的信息headers = s #

获取请求消息头的信息path = #

获取请求的URL地址files = #

获取⽤户上传的⽂件ua = s['User-Agent'] #

获取headers中的User-Agenturl = #

获取URL请求地址额外练习：创建三个⽬录结构1、config⽂件：创建config_内存放sqlite语句（mysql也可以，在这⾥⽤sqlite是因为⽐较轻巧，便捷），代码复制地址：2、db⽂件：是sqlite数据库存放位置3、login⽂件：是上⽅讲解的代码可以根据讲解的flask编写⼀个注册登录接⼝。⽤postman调⽤去尝试玩⼀玩。五、注册登录源码（个⼈代码）⽬录登录（user_⽂件）#!/usr/bin/python3# -*- coding: utf-8 -*-# @Date : 2021/8/16# @Name : ZhouZongXin"""/web_user 登陆"""from flask import make_response, requestfrom _json import *import osPATH = e(__file__)class Login(object): @staticmethod def get_login(): #

获取⽤户数据，可以存在数据库 path = PATH + '/' res = { "code": 0, "msg": "OK", "data": {} } userName = ("user") passWord = ("pwd") if len(userName) >= 16 or len(passWord) >= 16: res['code'] = -2 res['msg'] = '⽤户名/密码长度不能超多16位' return make_response(res) for users in read_json(path): for user, pwd in (): if userName == user and passWord == pwd: res['data']['user'] = userName res['data']['pwd'] = passWord return make_response(res) res['code'] = -1 res['msg'] = "请填写正确的账号密码" return make_response(res)注册（user_⽂件）#!/usr/bin/python3# -*- coding: utf-8 -*-# @Date : 2021/8/16# @Name : ZhouZongXin"""/register 注册"""from flask import make_response, requestfrom _json import *import reimport osPATH = e(__file__)class Register(object): @staticmethod def get_register(): #

注册后存储数据，可以存⼊数据库 path = PATH + '/' res = { "code": 0, "msg": "OK", "data": {} } userName = ("user") passWord = ("pwd") if not userName or not passWord: res['code'] = -1 res['msg'] = '账号密码不能为空' return make_response(res) elif len(userName) >= 16 or len(passWord) >= 16: res['code'] = -2 res['msg'] = '⽤户名/密码长度不能超多16位' return make_response(res) elif not l(r'^[a-zA-Z0-9]+$', userName): res['code'] = -3 res['msg'] = '⽤户名存在⾮法字符' return make_response(res) else: for users in read_json(path): for user in (): if userName in user: res['code'] = -4 res['msg'] = '账号已存在，请重新输⼊' return make_response(res) write_json(path, userName, passWord) user_all = [] for user in read_json(path): user_(user) res["data"] = user_all return make_response(res)init配置信息（__ init__.py⽂件）#!/usr/bin/python3# -*- coding: utf-8 -*-# @Date : 2021/8/16# @Name : ZhouZongXin""""""from flask import Flask#

创建app应⽤,__name__是python预定义变量，被设置为使⽤本模块.app = Flask(__name__)#

导⼊模块from _user import control_user启动⼊⼝（control_⽂件）#!/usr/bin/python3# -*- coding: utf-8 -*-# @Date : 2021/8/18# @Name : ZhouZongXin""""""from web import appfrom _user import user_loginfrom _user import user_register@('/login', methods=["POST"])def login(): """⽤户名密码登陆""" login_data = user_().get_login() return login_data@('/register', methods=["POST"])def register(): """⽤户名密码注册""" register_data = user_er().get_register() return register_data