本章我们介绍Flask Web开发中的表单处理

application/json类型请求

• 前台请求代码：

            $.ajax({
                url: '/add'
                , type: 'POST'
                , data: JSON.stringify(data.field)
                , contentType: 'application/json'
                , success: function (response) {
                    console.log(response);
                    if (response.code == 0) {
                        layer.msg('新增成功！');
                    } else {
                        layer.alert('新增失败！')
                    }
                }
            })

• 后台捕获请求，request.data存储了我们的请求数据
  

• 后台出处理代码，其中参数d为dict类型数据request.data

def add_monitor(d):
    logger.debug('add monitor is %s' % d)
    d = json.loads(d)
    conn = monitor_db.get_connection_with_url(url)    
    # Content-Type: application/json
    conn.execute(T_Monitor.insert(), [{
        'credit_type': d['credit_type']
        , 'query_type': d['query_type']
        , 'credit_status': d['credit_status']
        , 'elapsed_time': int(random.random() * 100)
    }])

application/x-www-form-urlencoded类型请求

• 我们稍微修改下前台发送代码，不指定contentType参数：即指定请求内容格式。注意：虽然我们的请求数据是JSON字串，但Ajax中没有指定contentType参数，那么数据请求格式仍旧为application/x-www-form-urlencoded

         $.ajax({
                url: '/add'
                , type: 'POST'
                , data: JSON.stringify(data.field)
                , success: function (response) {
                    console.log(response);
                    if (response.code == 0) {
                        layer.msg('新增成功！');
                    } else {
                        layer.alert('新增失败！')
                    }
                }
            })

通过后台代码调式，我们可以看到request.form存储了前台的请求数据如下：

注意上图红框部分：

• request.form是一个ImmutableMultiDict类型的对象

• request.form的键值key存储了请求数据的JSON字串

• request.form的长度为1

因此，通过上面的代码分析，我们定义Flask表单处理后台代码实现如下，其中参数d是一个ImmutableMultiDict类型对象：

# add monitor
def add_monitor(d):
    logger.debug('add monitor is %s' % d)
    conn = monitor_db.get_connection_with_url(url)

    for key in d.keys():
        logger.debug("form data is %s" % json.loads(key))
        d_dict = json.loads(key)
        conn.execute(T_Monitor.insert(), [{
            'credit_type': d_dict['credit_type']
            , 'query_type': d_dict['query_type']
            , 'credit_status': d_dict['credit_status']
            , 'elapsed_time': int(random.random() * 100)
        }])

实现效果

源码参考：https://github.com/ypmc/flask-sqlalchemy-web