Python的flask接收前台的ajax的post数据和get数据的方法


Posted in Python onApril 12, 2021

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方法

使用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参数

Python的flask接收前台的ajax的post数据和get数据的方法

Python的flask接收前台的ajax的post数据和get数据的方法

下面的代码是整个流程实现:ajax:

//查询js
function find_res(){
    var cname;
    var continent;
    // $.ajax
    // ({
    //     method:"post",
    //     url:"http://localhost:8080/PycharmProjects/Cov/templates/world.html?_ijt=q6ulfhihrfp8rqkl8id73svio3",
    //     success:function(data)
    //     {
    //         //form表单数据的转化,转化成[ { name: , value:   },{ name: , value:   } ]
    //         all=$('#find_value').serializeArray()
    //         // console.log(all['cname'])
    //         console.log(all[0])
    //         cname=all[0]['value']
    //         alert(cname)
    //     }
    // })
    cname=document.getElementById("cname").value
    continent=document.getElementById("continent").value
    console.log(cname+continent)
    // alert("表单数据:   "+"国家:"+cname+ "大洲:"+ continent)
    $.ajax
    ({
            // sync:true,
            url:"/find_worldByName",
            // type:'post',
            data:{'cname':cname,'continent':continent},
            success:function (data)
            {
                // alert("!!!")
                table_data=data.data;
                for(var i=0;i<table_data.length;i++)
                {
                // console.log(table_data[i]);
                }
            var appendHTML = "";
        if($(".map-table tbody tr").length>0){
            $(".map-table tbody tr").remove();
        }
        // alert("list长度:"+table_data.length)
        for(var i=0; i<table_data.length; i++)
            {
            //分割日期字符串
            strdt=table_data[i][1].split(" ");
            strdt=strdt[0]+strdt[1]+strdt[2]+strdt[3]
            appendHTML = "<tr align='center' style='color:aquamarine;'><td>"+
            strdt+"</td><td>"+
            table_data[i][2]+"</td><td>"+
            table_data[i][5]+"</td><td>"+
            table_data[i][8]+"</td><td>"+
            table_data[i][9]+"</td><td>"+
            table_data[i][4]+"</td><td>"+
            (i+1)+"</td></tr>";
                $(".map-table tbody").append(appendHTML);
            }
        }
    })
}

前台html:

<table align="center" style="margin:3px"  cellspacing="7px">
                <form id="find_value">
                    <label><font color="#ff7f50">输入国家:</font></label>
                    <input id="cname" type="text" name="cname" placeholder="" value="">

                    <label><font color="#ff7f50">输入大洲:</font></label>
                    <input id="continent" type="text" name="continent" placeholder="" value="">

                    <input type="button" value="查询" onclick="find_res()">
                    <input type="reset" value="重置">
                </form>
                <thead>
                 <tr style="color: #FFB6C1">
                <th>时间</th>
                <th>国家</th>
                <th>累计确诊</th>
                <th>累计治愈</th>
                <th>累计死亡</th>
                <th>现存确诊</th>
                <th>排名</th>
              </tr>
                </thead>
                <tbody id="bd_data">
                </tbody>
            </table>

Python flask路由:

@app.route("/find_worldByName")
def find_worldByName():
    #获取用户传来的数据
    # jsondata = json.loads(request.form.get('jsondata'))
    res=[]
    #get方式
    cname = request.values.get("cname")
    continent = request.values.get("continent")
    #post方式
    # continent = request.form.get("continent")
    # cname = request.form.get("cname")

    # print(cname+continent)
    res=utils.find_worldByName(cname,continent)
    # res = utils.find_worldByName("美国", "")
    # print(res)
    return jsonify({"data": res})

后台获取数据库数据:

def find_worldByName(c_name,continent):
    print(c_name)
    print(continent)
    sql = " SELECT * FROM world WHERE  1=1 "
    if(c_name!=None):
        sql=sql+"AND ( c_name LIKE '%"+c_name+"%' )"
    if(continent!=None):
        sql=sql+" AND ( continent LIKE '%"+continent+"%') "
    sql=sql+" AND dt=(SELECT dt FROM world order by dt desc limit 1) order by confirm desc "

          # "AND continent LIKE '%%%%%s%%%%'" \
          # " order by dt desc " %(c_name,continent)
    # sql_temp = " SELECT * FROM world WHERE c_name LIKE '%"+c_name+"%' "
    res = query(sql)
    list= []
    for i in res:
        # print(i)
        list.append(i)
    return list;
def query(sql,*args):
    """
    通用封装查询
    :param sql:
    :param args:
    :return:返回查询结果 ((),())
    """
    conn , cursor= get_conn()
    print(sql)
    cursor.execute(sql)
    res = cursor.fetchall()
    close_conn(conn , cursor)
    return res

到此这篇关于Python的flask接收前台的ajax的post数据和get数据的方法的文章就介绍到这了,更多相关Python flask接收前台ajax post和get数据内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Python 相关文章推荐
python实现代码行数统计示例分享
Feb 10 Python
简单学习Python time模块
Apr 29 Python
对pandas读取中文unicode的csv和添加行标题的方法详解
Dec 12 Python
python 实现倒排索引的方法
Dec 25 Python
详解js文件通过python访问数据库方法
Mar 03 Python
深入了解Django中间件及其方法
Jul 26 Python
wxPython窗体拆分布局基础组件
Nov 19 Python
Python+redis通过限流保护高并发系统
Apr 15 Python
基于python实现可视化生成二维码工具
Jul 08 Python
python 如何实现遗传算法
Sep 22 Python
python实现图片转字符画的完整代码
Feb 21 Python
Python中的嵌套循环详情
Mar 23 Python
Python使用sql语句对mysql数据库多条件模糊查询的思路详解
python实现简单反弹球游戏
python中Tkinter 窗口之输入框和文本框的实现
Apr 12 #Python
python opencv常用图形绘制方法(线段、矩形、圆形、椭圆、文本)
python 利用 PIL 将数组值转成图片的实现
python实现网络五子棋
python实现简易名片管理系统
Apr 11 #Python
You might like
DEDE采集大师官方留后门的删除办法
2011/01/08 PHP
php数组函数序列之array_unique() - 去除数组中重复的元素值
2011/10/29 PHP
PHP内核探索之解释器的执行过程
2015/12/22 PHP
php 防止表单重复提交两种实现方法
2016/11/03 PHP
Yii2实现ActiveForm ajax提交
2017/05/26 PHP
PHP如何使用cURL实现Get和Post请求
2020/07/11 PHP
JS模拟多线程
2007/02/07 Javascript
javascript 命名空间以提高代码重用性
2008/11/13 Javascript
JavaScript 私有成员分析
2009/01/13 Javascript
超级酷和最实用的jQuery实例收集(20个)
2010/04/21 Javascript
js二维数组定义和初始化的三种方法总结
2014/03/03 Javascript
JavaScript编写点击查看大图的页面半透明遮罩层效果实例
2016/05/09 Javascript
轻松掌握jQuery中wrap()与unwrap()函数的用法
2016/05/24 Javascript
JS简单生成两个数字之间随机数的方法
2016/08/03 Javascript
AngularJs Injecting Services Into Controllers详解
2016/09/02 Javascript
Vue.js常用指令之循环使用v-for指令教程
2017/06/27 Javascript
bootstrap响应式导航条模板使用详解(含下拉菜单,弹出框)
2017/11/17 Javascript
JS实现移动端点击按钮复制文本内容
2019/07/28 Javascript
在SSM框架下用laypage和ajax实现分页和数据交互的方法
2019/09/27 Javascript
解决VUE-Router 同一页面第二次进入不刷新的问题
2020/07/22 Javascript
vue-quill-editor 自定义工具栏和自定义图片上传路径操作
2020/08/03 Javascript
python中sleep函数用法实例分析
2015/04/29 Python
简单介绍Python中的几种数据类型
2016/01/02 Python
python中urllib.unquote乱码的原因与解决方法
2017/04/24 Python
python里使用正则表达式的组嵌套实例详解
2017/10/24 Python
Python实现定制自动化业务流量报表周报功能【XlsxWriter模块】
2019/03/11 Python
python 函数嵌套及多函数共同运行知识点讲解
2020/03/03 Python
Python tempfile模块生成临时文件和临时目录
2020/09/30 Python
Carolina工作鞋官网:Carolina Footwear
2019/03/14 全球购物
Fnac西班牙官网:法国文化和电子产品零售商
2021/03/14 全球购物
传统软件工程与面向对象的软件工程有什么区别
2012/05/31 面试题
个人简历自我鉴定
2013/10/11 职场文书
主题酒店策划书
2014/01/28 职场文书
中药学专业求职信
2014/05/31 职场文书
校外活动方案
2014/08/28 职场文书
浅谈Python数学建模之整数规划
2021/06/23 Python