Python的flask接收前台的ajax的post数据和get数据
ajax向后台发送数据:
①post方式
ajax:
@app.route("/find_worldByName",methods=['POST'])
type:'post',
data:{'cname':cname,'continent':continent},
这是post方式传值
那么在后台接收就是:(使用request的form方法)
continent = request.form.get("continent")
cname = request.form.get("cname")
②get方式(url参数)
使用request的values方法
data:{'cname':cname,'continent':continent},
name=request.values.get("cname")
总结:
这两种的区别就是数据在ajax data里的发送方式不同(get和post),所以在后台接收的时候也会不同。
使用request.form.get 方式获取的是一个json字符串(在这个方法会自动转化json对象,可以直接用key访问)
使用request.values.get 方式获取的是通过url传递的get参数
下面的代码是整个流程实现:
ajax:
1 //查询js
2 function find_res(){
3 var cname;
4 var continent;
5 // $.ajax
6 // ({
7 // method:"post",
8 // url:"http://localhost:8080/PycharmProjects/Cov/templates/world.html?_ijt=q6ulfhihrfp8rqkl8id73svio3",
9 // success:function(data)
10 // {
11 // //form表单数据的转化,转化成[ { name: , value: },{ name: , value: } ]
12 // all=$('#find_value').serializeArray()
13 // // console.log(all['cname'])
14 // console.log(all[0])
15 // cname=all[0]['value']
16 // alert(cname)
17 // }
18 // })
19 cname=document.getElementById("cname").value
20 continent=document.getElementById("continent").value
21 console.log(cname+continent)
22 // alert("表单数据: "+"国家:"+cname+ "大洲:"+ continent)
23 $.ajax
24 ({
25 // sync:true,
26 url:"/find_worldByName",
27 // type:'post',
28 data:{'cname':cname,'continent':continent},
29 success:function (data)
30 {
31 // alert("!!!")
32 table_data=data.data;
33 for(var i=0;i<table_data.length;i++)
34 {
35 // console.log(table_data[i]);
36 }
37 var appendHTML = "";
38 if($(".map-table tbody tr").length>0){
39 $(".map-table tbody tr").remove();
40 }
41 // alert("list长度:"+table_data.length)
42 for(var i=0; i<table_data.length; i++)
43 {
44 //分割日期字符串
45 strdt=table_data[i][1].split(" ");
46 strdt=strdt[0]+strdt[1]+strdt[2]+strdt[3]
47 appendHTML = "<tr align='center' style='color:aquamarine;'><td>"+
48 strdt+"</td><td>"+
49 table_data[i][2]+"</td><td>"+
50 table_data[i][5]+"</td><td>"+
51 table_data[i][8]+"</td><td>"+
52 table_data[i][9]+"</td><td>"+
53 table_data[i][4]+"</td><td>"+
54 (i+1)+"</td></tr>";
55 $(".map-table tbody").append(appendHTML);
56 }
57 }
58 })
59 }
前台html:
1 <table align="center" style="margin:3px" cellspacing="7px">
2 <form id="find_value">
3 <label><font color="#ff7f50">输入国家:</font></label>
4 <input id="cname" type="text" name="cname" placeholder="" value="">
5
6 <label><font color="#ff7f50">输入大洲:</font></label>
7 <input id="continent" type="text" name="continent" placeholder="" value="">
8
9 <input type="button" value="查询" onclick="find_res()">
10 <input type="reset" value="重置">
11 </form>
12 <thead>
13 <tr style="color: #FFB6C1">
14 <th>时间</th>
15 <th>国家</th>
16 <th>累计确诊</th>
17 <th>累计治愈</th>
18 <th>累计死亡</th>
19 <th>现存确诊</th>
20 <th>排名</th>
21 </tr>
22 </thead>
23 <tbody id="bd_data">
24 </tbody>
25 </table>
Python flask路由:
1 @app.route("/find_worldByName")
2 def find_worldByName():
3 #获取用户传来的数据
4 # jsondata = json.loads(request.form.get('jsondata'))
5 res=[]
6 #get方式
7 cname = request.values.get("cname")
8 continent = request.values.get("continent")
9 #post方式
10 # continent = request.form.get("continent")
11 # cname = request.form.get("cname")
12
13 # print(cname+continent)
14 res=utils.find_worldByName(cname,continent)
15 # res = utils.find_worldByName("美国", "")
16 # print(res)
17 return jsonify({"data": res})
后台获取数据库数据:
1 def find_worldByName(c_name,continent):
2 print(c_name)
3 print(continent)
4 sql = " SELECT * FROM world WHERE 1=1 "
5 if(c_name!=None):
6 sql=sql+"AND ( c_name LIKE '%"+c_name+"%' )"
7 if(continent!=None):
8 sql=sql+" AND ( continent LIKE '%"+continent+"%') "
9 sql=sql+" AND dt=(SELECT dt FROM world order by dt desc limit 1) order by confirm desc "
10
11 # "AND continent LIKE '%%%%%s%%%%'" \
12 # " order by dt desc " %(c_name,continent)
13 # sql_temp = " SELECT * FROM world WHERE c_name LIKE '%"+c_name+"%' "
14 res = query(sql)
15 list= []
16 for i in res:
17 # print(i)
18 list.append(i)
19 return list;
20
21
22 def query(sql,*args):
23 """
24 通用封装查询
25 :param sql:
26 :param args:
27 :return:返回查询结果 ((),())
28 """
29 conn , cursor= get_conn()
30 print(sql)
31 cursor.execute(sql)
32 res = cursor.fetchall()
33 close_conn(conn , cursor)
34 return res
Python的flask接收前台的ajax的post数据和get数据的更多相关文章
- flask接收前台的ajax的post数据
html <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8& ...
- flask接收前台的form数据
转自 http://www.cnblogs.com/wanghaonull/p/6340096.html 我主要是想了解 request.form.get('username') 这一部分
- Python搭建Web服务器,与Ajax交互,接收处理Get和Post请求的简易结构
用python搭建web服务器,与ajax交互,接收处理Get和Post请求:简单实用,没有用框架,适用于简单需求,更多功能可进行扩展. python有自带模块BaseHTTPServer.CGIHT ...
- 使用Python的Flask框架,结合Highchart,动态渲染图表(Ajax 请求数据接口)
参考链接:https://www.highcharts.com.cn/docs/ajax 参考链接中的示例代码是使用php写的,这里改用python写. 需要注意的地方: 1.接口返回的数据格式,这个 ...
- Flask框架:运用Ajax轮询动态绘图
Ajax是异步JavaScript和XML可用于前后端交互,在之前<Flask 框架:运用Ajax实现数据交互>简单实现了前后端交互,本章将通过Ajax轮询获取后端的数据,前台使用echa ...
- flask与javascript及ajax
flask与javascript及ajax 1. flask+js 1.1. 最简单的 最简单的元素信息改变. {% block content %} <h1>我的第一张网 ...
- python之Flask实现登录功能
网站少不了要和数据库打交道,归根到底都是一些增删改查操作,这里做一个简单的用户登录功能来学习一下Flask如何操作MySQL. 用到的一些知识点:Flask-SQLAlchemy.Flask-Logi ...
- spring MVC 如何接收前台传入的JSON对象数组并处理
spring MVC 如何接收前台传入的JSON对象数组 主要方法: (主要用到的包是 net.sf.json 即:json-lib-2.3-jdk15.jar 完整相关jar包: commons- ...
- spring MVC 如何接收前台传入的JSON对象数组
spring MVC 如何接收前台传入的JSON对象数组 主要方法: (主要用到的包是 net.sf.json 即:json-lib-2.3-jdk15.jar 完整相关jar包: commons- ...
随机推荐
- VSCode & Node.js & debugger & inspector
VSCode & Node.js & debugger & inspector F5 ws 元信息 (UUID) ws://127.0.0.1:46912/efa91bda-1 ...
- [转]在ROS下使用zeroconf配置多机通信
原文地址:http://www.corvin.cn/635.html,转载主要方便随时查阅,如有版权要求,请及时联系. 0x00 为何需要配置ROS多机通信 众所周知ROS是分布式系统,因此可以将机器 ...
- 1047 Student List for Course ——PAT甲级真题
1047 Student List for Course Zhejiang University has 40,000 students and provides 2,500 courses. Now ...
- Hystrix熔断器的使用步骤
1.添加熔断器依赖 2.在配置文件中开启熔断器 feign.hystrix.enabled=true 3.写接口的实现类VodFileDegradeFeignClient,在实现类中写如果出错了输出的 ...
- 小心你的个人信息——GitHub 热点速览 v.21.09
作者:HelloGitHub-小鱼干 浏览过必有痕迹,有什么可以抹去社交痕迹的方法呢?social-analyzer 是一个可在 350+ 网站分析特定用户资料的工具,你可以用它来"人肉&q ...
- Java RPC 框架 Solon 1.3.9 发布,更便利的支持
Solon 是一个微型的Java RPC开发框架.项目从2018年启动以来,参考过大量前人作品:历时两年,4000多次的commit:内核保持0.1m的身材,超高的跑分,良好的使用体验.支持:RPC. ...
- ajax请求添加自定义header参数
beforeSend: function (XMLHttpRequest) { XMLHttpRequest.setRequestHeader("X-Auth0-Token", g ...
- java 入门环境搭建
Java帝国的诞生 1972年C诞生 1982年C++诞生 1995年JAVA诞生,为了实现真正的跨平台,在操作系统之上又加了抽象层,叫做JAVA的虚拟机,统称JVM 三高问题: 高可用 高性能 高并 ...
- MindSpore:基于本地差分隐私的 Bandit 算法
摘要:本文将先简单介绍Bandit 问题和本地差分隐私的相关背景,然后介绍基于本地差分隐私的 Bandit 算法,最后通过一个简单的电影推荐场景来验证 LDP LinUCB 算法. Bandit问题是 ...
- drf给上传图片重命名
1.先在你项目中添加一个文件夹如:system 在文件夹下添加__init__.py 和storage.py文件,并在storage.py中添加如下代码: #复制代码 -- coding: UTF-8 ...