当前位置 博文首页 > Python的flask接收前台的ajax的post数据和get数据的方法

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

    作者:杨传伟 时间:2021-04-29 17:54

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

    下面的代码是整个流程实现: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 >
                        <label><font color="#ff7f50">输入国家:</font></label>
                        <input  type="text" name="cname" placeholder="" value="">
    
                        <label><font color="#ff7f50">输入大洲:</font></label>
                        <input  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 >
                    </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
    js
    下一篇:没有了