【项目实训】falsk后端连接数据库以及与前端vue进行通信

falsk连接数据库

我们整个项目采用vue+flask+mysql的框架,之前已经搭建好了mysql数据库,现在要做的是使用flask连接到数据库并测试

安装flask

  • 首先安装flask

pip install flask

进行数据库连接

数据库连接需要使用到pymysql库以及flask库

连接数据库的函数如下:

class Database:# 设置数据库连接host='localhost'user='root'password = "123456"def __init__(self,db):connect=pymysql.connect(host=self.host,user=self.user,password=self.password,db=db)self.cursor = connect.cursor()# 执行sql语句def execute(self,command):try:# 执行command中的sql语句self.cursor.execute(command)except Exception as e:return eelse:return self.cursor.fetchall()

其中包含了连接数据库以及执行sql语句,省去了每次执行sql语句重连数据库的麻烦

编写函数以测试是否连接成功数据库

可以使用以下代码,其中注意Database()中替换为自己的数据库名,sql查询语句根据自己情况编写

sql = Database("xmsx")
result = sql.execute(f"SELECT company FROM companyandjob WHERE job_name='{job}' ")
print(result)

vue与flask通信

前端vue部分

解决跨域问题:

  • 首先编写vue.config.js

设置target为自己的后端flask的接口:

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({transpileDependencies: true,lintOnSave:false,
})
// 跨域配置
module.exports = {devServer: {                //记住,别写错了devServer//设置本地默认端口  选填port: 8080,proxy: {                 //设置代理,必须填'/api': {              //设置拦截器  拦截器格式   斜杠+拦截器名字,名字可以自己定target: 'http://127.0.0.1:8085',     //代理的目标地址changeOrigin: true,              //是否设置同源,输入是的pathRewrite: {                   //路径重写'^/api': ''                     //选择忽略拦截器里面的内容}}}}
}
  • 其次编辑index.js(注意,这里是我们项目特有的,我们全局设置了axios,因此不用在每个vue中导入axios

设置baseUrl为后端flaskIP地址

  • 编写前端函数 

这里使用export const 是因为我们将所有的调用后端的函数写在了一个文件中,这样封装性较强,前端需要获取后端数据时调用这个函数即可

  • 在.vue文件中调用访问后端的函数

在methods中使用,并且由于改方法是异步操作,所以使用async声明,并且在异步调用函数的位置声明await,从而获得后端返回的数据。相应的展示在前端

后端flask部分

后端需要与vue通信,同时要与数据库连接,并且接受前端的参数,代码如下:

# 前端显示相应公司后端岗位的优秀面经
@app.route('/api/getExperienceWithOfset',methods=['POST'])
def showExperience():if request.method == "POST":company = request.json['company']# 如果之后添加”前端“岗位,则应前端再传递一个”岗位“信息,从而到数据库中查询相应的数据job = request.json['job']offset = request.json['offset']if request.method == "GET":company = request.args.get['company']job = request.json['job']offset = request.json['offset']# 创建Database类的对象sql,test为需要访问的数据库名字 具体可见Database类的构造函数sql = Database("xmsx")try:#执行sql语句 f+字符串的形式,可以在字符串里面以{}的形式加入变量名 结果保存在result数组中result = sql.execute(f"SELECT title,content FROM companyandexperience WHERE company='{company}' AND job='{job}' LIMIT 1 OFFSET {offset}")except Exception as e:return {'status':"error", 'message': "code error"}else:if not len(result) == 0:#返回查询结果,根据需要进行处理return {'status':'success','title':result[0][0],'content':result[0][1],}else:return {'status':'success','title':"无",'content':"空",}

这里我们处理成,接受前端的company,job,offset字段,然后在数据库中查询相应的记录并返回。offset的设置是为了可以在前端实现分页展示。

并且,为了防止频繁的发生error错误,我们设置,如果数据库中查询不到数据,则返回”空“,在前端添加逻辑判断,如果返回的数据内容为”空“则表示没有数据了,则不能再进行翻页操作,并且提示”暂时没有该信息“。

项目中编写的后端函数如下:

  • 根据公司和岗位查询公司要求信息
# 根据公司岗位,这里的岗位是模糊查询,即算法、数据等类别,查询出公司要求,公司职责或描述
@app.route('/api/getCompanyJobInformationWithOfset',methods=['POST'])
def showCompanyJobInformationWithOfset():
  • 根据公司和岗位查询公司优质面经
# 前端显示相应公司后端岗位的优秀面经
@app.route('/api/getExperienceWithOfset',methods=['POST'])
def showExperience():
  • 根据jieba分词统计得到的各公司的高频考点,从数据库中查询一些技术问题作为模拟面试问答
  •  

总结

综上,我们实现了vue+flask+mysql的整体框架。根据不同的前端展示需求,编写不同的后端代码及sql查询即可。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/36581.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

通过注释语句,简化实体类的定义(省略get/set/toString的方法)

引用Java的lombok库,减少模板代码,如getters、setters、构造函数、toString、equals和hashCode方法等 import lombok.AllArgsConstructor; import lombok.Data; import lombok.NoArgsConstructor;Data NoArgsConstructor AllArgsConstructorData&#xf…

使用【docker】简单部署打包构建好的镜像并运行python项目

使用【docker】简单部署运行python项目 方案一:使用打包好的镜像直接运行 一.项目配置 项目压缩包:project.tar.gz 项目目录存放在服务器路径:/var/opt/app (1)解压项目文件到该目录下:/var/opt/app 命令&#xff1…

Linux-引导过程与服务控制

目录 一、Linux操作系统引导过程 1、引导过程总览 2、引导过程详解 2.1、开机自检(BIOS) 2.2、 MBR引导 2.3、GRUB菜单 2.4、加载内核(kernel) 2.5、init进程初始化 3、系统初始化进程 3.1、Systemd单元类型 3.2、运行级别所对应的 Systemd 目…

SherlockChain:基于高级AI实现的智能合约安全分析框架

关于SherlockChain SherlockChain是一款功能强大的智能合约安全分析框架,该工具整合了Slither工具(一款针对智能合约的安全工具)的功能,并引入了高级人工智能模型,旨在辅助广大研究人员针对Solidity、Vyper和Plutus智…

前端 Array.sort() 源码学习

源码地址 V8源码Array 710行开始为sort()相关 Array.sort()方法是那种排序呢&#xff1f; 去看源码主要是源于这个问题 // In-place QuickSort algorithm. // For short (length < 22) arrays, insertion sort is used for efficiency.源码中的第一句话就回答了我的问题…

Potato(土豆)一款轻量级的开源文本标注工具(二)

示例项目&#xff08;模版&#xff09; Potato 旨在提高数据标注的可复制性&#xff0c;并降低研究人员设置新标注任务的成本。因此&#xff0c;Potato 提供了一系列预定义的示例项目&#xff0c;并欢迎公众向项目中心贡献。如果您使用 Potato 进行了自己的标注工作&#xff0…

海思平台使用ITTP_Stream调试sensor

目录 相关资料1.ISP相关资料2.MIPI RX相关资料3.sensor资料4.MIPI标准 准备工作1.准备sensor驱动2.准备sample vio3.准备上位机和下位机程序 运行1.只运行HiPQTool1.1.板端运行1.2.PC端运行HiPQTool 2.使用ITTP_Stream2.1.板端运行2.2.打开上位机软件 相关资料 1.ISP相关资料 …

uniapp开发手机APP、H5网页、微信小程序、长列表插件

ml-list 插件地址&#xff1a;https://ext.dcloud.net.cn/plugin?id18928 ml-list介绍 1、ml-list 列表组件&#xff0c;包含基本列表样式、可扩展插槽机制、长列表性能优化、多端兼容。 2、ml-list 低代码列表&#xff0c;帮助使用者快速构建列表&#xff0c;简单配置&…

秋招突击——6/26~6/27——复习{二维背包问题——宠物小精灵之收服}——新作{串联所有单词的字串}

文章目录 引言复习二维背包问题——宠物小精灵之收服个人实现重大问题 滚动数组优化实现 新作串联所有单词的字串个人实现参考实现 总结 引言 今天应该是舟车劳顿的一天&#xff0c;头一次在机场刷题&#xff0c;不学习新的东西了&#xff0c;就复习一些之前学习的算法了。 复…

百度Apollo的PublicRoadPlanner一些移植Ros2-foxy的思路(持续更新)

如今的PublicRoadPlanner就是之前耳熟能详的EM planner 计划 —— ROS2与CARLA联合仿真 结构化场景: 规划算法:EM-planner 控制算法:MPC和PID 非结构化场景: 规划算法采用Hybrid A* (1)小车模型搭建(计划参考Github上Hybrid上的黑车,比较炫酷) (2)车辆里程计: 位…

深入比较:Batch文件与Shell脚本的异同

在操作系统中&#xff0c;自动化脚本是一种常见的工具&#xff0c;用于执行一系列自动化命令或程序。Windows和类Unix系统都提供了各自的脚本解决方案&#xff1a;Batch文件&#xff08;在Windows中&#xff09;和Shell脚本&#xff08;在类Unix系统中&#xff09;。本文将详细…

有哪些方法可以恢复ios15不小心删除的照片?

ios15怎么恢复删除的照片&#xff1f;在手机相册里意外删除了重要的照片&#xff1f;别担心&#xff01;本文将为你介绍如何在iOS 15系统中恢复已删除的照片。无需专业知识&#xff0c;只需要按照以下步骤操作&#xff0c;你就能轻松找回宝贵的回忆。 一、从iCloud云端恢复删除…

SRC公益上分的小技巧一

前言 之前发布的文章&#xff0c;例如SRC中的一些信息收集姿势- Track 知识社区 - 掌控安全在线教育 - Powered by 掌控者 里面就有提到若依系统&#xff0c;默认账号密码非常简单 是 admin / admin123 但是&#xff0c;往往我们去挖掘的时候很容易出现 这说明了若依系统的门…

Viewer.js 图片预览插件使用

参考&#xff1a;Viewer.js 图片预览插件使用 demo链接&#xff1a;viewerjs_demo

【Linux:文件描述符】

文件描述符&#xff1a; 文件描述符的分配原则&#xff1a;最小未分配原则 每一个进程中有一个task_struct结构体&#xff08;PCB)&#xff0c;而task_struct中含有struct file_sturct*file的指针&#xff0c;该指针指向了一个struct files_struct的结构体该结构体中含有一个f…

PHP框架详解- symfony框架

Symfony框架是一个开源的PHP框架&#xff0c;由SensioLabs公司开发并维护&#xff0c;最早发布于2005年。它旨在为Web应用程序的开发提供一个高效且结构化的环境。Symfony框架的设计理念是减少Web应用程序的创建和维护时间&#xff0c;并避免重复性任务。 Symfony框架采用MVC&…

PG最大连接数

在 PostgreSQL 数据库中&#xff0c;您可以使用 SQL 查询来获取最大连接数、当前连接数以及每个数据库的连接数。以下是一些常用的查询&#xff1a; 查看最大连接数&#xff1a; PostgreSQL 的最大连接数由配置参数 max_connections 决定。您可以在 postgresql.conf 文件中设置…

使用IMAP服务获取163邮箱的未读邮件

使用IMAP服务获取163邮箱的未读邮件 整体的逻辑思路如下&#xff1a; 开启163邮箱的IMAP服务&#xff0c;拿到授权码用于登录IMAP服务登录IMAP服务&#xff0c;获取邮箱的未读邮件列表遍历未读邮件列表&#xff0c;获取邮件内容 # 导入必要的库 import os import imaplib im…

三大工作流引擎技术Activiti、Flowable、Camunda选型指南

文章目录 前言1 流程引擎发展历程2 流程引擎主要概念BPM (Business Process Management)BPMN (Business Process Model and Notation)CMMN (Case Management Model and Notation)DMN (Decision Model and Notation)事件&#xff08;Event&#xff09;顺序流&#xff08;Sequenc…

从静电到浪涌,全面防护:雷卯多电压等级电源保护设计方案汇总

在当今数字化、电气化日益加速的时代&#xff0c;电子设备和电力系统面临着前所未有的挑战&#xff0c;其中静电放电(ESD)、浪涌以及雷击等瞬态事件成为了威胁设备稳定性和寿命的关键因素。从精密的消费电子产品到工业级控制系统&#xff0c;从智能家居到新能源汽车&#xff0c…