Angularjs + Flask-wtf:错误请求400

时间:2015-06-15 17:57:46

标签: ajax angularjs flask flask-wtforms bad-request

我在wtf-forms中遇到了一个非常奇怪的问题,我使用angularjs $ http-module发送请求。初始化WTForm后,我收到错误请求:400 错误。出于测试目的,我禁用了csrf保护。我真不知道在哪里寻找问题。以下是最小的失败:

发送请求的Angularjs服务:

var data = new FormData();
data.append('surname', _gifter.surname);
data.append('lastname', _gifter.lastname);
data.append('email', _gifter.email);
data.append('email_confirm', _gifter.email_confirm);
data.append('prize', gift.prize);

$http.post('ajax/claim/' + DataProvider.gift.id + '/', data)

烧瓶路线:

@app.route('/ajax/claim/<int:gift_id>/', methods = ['POST'])
def claim_gift(gift_id):
    print("request:" + request.data)
    claim_form = ClaimGiftForm(csrf_enabled=False)
    return 'success'

WTForm:

class ClaimGiftForm(Form):
    surname = TextField(
        validators=[validators.Required()])
    lastname = TextField(
        validators=[validators.Required()])
    email = EmailField(
        validators = [
            validators.email(),
            validators.Required()])
    email_confirm = EmailField(
        validators = [
            validators.Required(),
            validators.EqualTo()])
    prize = IntegerField()

当我打印请求时(参见'Flask route')数据似乎没问题 - 一切都正确传输。但是在初始化表单时,我得到了上述错误。

Edit1:我刚刚发现,由于某种原因,request.form MultiDict为空,所有request.data都包含预期的数据。但是我不知道为什么会这样。

EDIT2: pprint(request.data)给出:

-----------------------------109386632915471364402090498247\r\nContent-Disposition: form-data; name="surname"\r\n\r\ntheName\r\n
-----------------------------109386632915471364402090498247\r\nContent-Disposition: form-data; name="lastname"\r\n\r\ntheLastname\r\n
-----------------------------109386632915471364402090498247\r\nContent-Disposition: form-data; name="email"\r\n\r\nsomeone@somewhere.net\r\n
-----------------------------109386632915471364402090498247\r\nContent-Disposition: form-data; name="email_confirm"\r\n\r\nsomeone@somewhere.net\r\n
-----------------------------109386632915471364402090498247\r\nContent-Disposition: form-data; name="prize"\r\n\r\n12\r\n
-----------------------------109386632915471364402090498247--\r\n'

2 个答案:

答案 0 :(得分:1)

您的JavaScript有email_confirmed,但表单的字段为email_confirm

答案 1 :(得分:1)

这是ajax请求的标头。我需要添加一个header-config对象:

{
    withCredentials: true,
    headers: {'Content-Type': undefined},
    transformRequest: angular.identity
}

整个请求现在看起来像这样:

$http.post('ajax/claim/' + DataProvider.gifts[index].id + '/', data, {
    withCredentials: true,
    headers: {'Content-Type': undefined},
    transformRequest: angular.identity
).success(...);

我认为这个问题已经结束了。