Flask: BadRequestKeyError: 400 Bad Request: The browser (or proxy) sent a request that this server could not understand

Question

I have created an edit view for my birthday reminder application and having previously worked, whenever I link to this edit view I receive a key error. I've checked the object being returned by the get_Gift function and the key field is present. Also, the HTML form created with multiple fields contains the field indicated in the error.

The error being received is:

werkzeug.exceptions.BadRequestKeyError: 400 Bad Request: The browser (or proxy) sent a request that this server could not understand. KeyError: 'giftName'

I'm sure I'm missing something really obvious, but I currently cannot see it. The HTML should be rendered and populated with the values retrieved from the respective MongoDB document. Any assistance would be appreciated.

Python Script

def get_gift(gid):
    query = {"giftId":gid}
    gift = Gift.viewGift(query)   
    if gift is None:
        abort(404, "Gift id {0} doesn't exist.".format(gid))

    return gift


@ct.route('/<giftId>/editGifts', methods=('GET','POST'))
def editGifts(giftId):
    gft = get_gift(giftId)
    
    if request.method == 'POST':
        giftId = giftId
        giftName = request.form['giftName']
        giftDate = datetime.strptime(request.form['giftDate'],'%Y-%m-%d')
        giftDesc = request.form['giftDesc']
        giftType = request.form['giftType']
        giftCategory = request.form['giftCategory']
        giftSentiment = request.form['giftSentiment']
        giftRelInterest = list(str(request.form['giftRelInterest']).split(','))

        error = None

        gft = Gift(giftName,giftDate,giftDesc,giftType,giftCategory,giftSentiment,giftRelInterest,giftId)

        if giftName is None:
            error = 'Please provide a gift name'
        
        if giftDate is None:
            error = 'Please enter the date of gift purchase'

        if giftType is None:
            error = 'Please select a gift type'

        if giftCategory is None:
            error = 'Please choose a gift category'

        if error is not None:
            flash(error)
        else:

            query = {"giftId":giftId}
            giftData = {"$set": {
                "giftName": giftName,
                "giftDate": giftDate,
                "giftDesc": giftDesc,
                "giftType": giftType,
                "giftCategory": giftCategory,
                "giftSentiment": giftSentiment,
                "giftRelInterest": giftRelInterest
            }}

            Gift.updateGift_one(query,giftData)
            return redirect(url_for('contact.index'))

        gCategories = [{'name':'Books'},{'name':'Electronics/Computers'},{'name':'Home & Garden'},{'name':'Sports'},{'name':'Travel/Hospitality'},{'name':'Film/Theatre'},{'name':''},{'name':''}]
        gTypes = [{'name':'Activity/Experience'},{'name':'Alcohol/Beverage'},{'name':'Virtual'},{'name':''},{'name':''},{'name':''},{'name':''},{'name':''}]
        gSentiment = [{'name':'Positive'},{'name':'Neutral'},{'name':'Negative'},{'name':'Unknown'}]
        gRelInt = [{'name':'Sports'},{'name':'Reading'},{'name':'Travel'},{'name':'Cooking'},{'name':'Art'},{'name':'Gardening'},{'name':'Gym'},{'name':'Film/Theatre'},{'name':'Music'},{'name':'DIY'}]

        return render_template('gifts/editGifts.html', gft=gft, gCategories=gCategories, gTypes=gTypes, gSentiment=gSentiment, gRelInt=gRelInt)
    else:
        return render_template('gifts/viewGifts.html')

HTML Form

{% extends 'base.html' %}

{% block header %}
<div>
    <h1>{% block title %}Edit Gift{% endblock %}</h1>
</div>
{% endblock %}

{% block content %}
<div  class="ui form">
    <fieldset>
    <form method = "post">
    <p>
        <label for="giftName">Gift Name *</label>
        <input name="giftName" id="giftName"  value="{{ request.form['giftName'] or gft['giftName'] }}" required>
    </p>
    <p>
        <label for="giftDate">Purchase Date *</label>
        <input type="date" name="giftDate" id="giftDate" value="{{ request.form['giftDate'] or gft['giftDate'] }}" required>
    </p>
    <p>
        <label for="giftDesc">Description</label>
        <textarea name="giftDesc" id="giftDesc" rows="4" cols="50" value="{{ request.form['giftDesc']  or gft['giftDesc'] }}"></textarea>
    </p>
    <p>
        <label for="giftType">Type *</label>
        <select name="giftType" id="giftType" required>
            {% for gTy in gTypes %}
                <option selected="" value="{{ gTy.name }}">{{ gTy.name  or gft['giftType'] }}</option>
            {% endfor %}
        </select>
    </p>
    <p>
        <label for="giftCategory">Category *</label>
        <select name="giftCategory" id="giftCategory" required>
            {% for gC in gCategories %}
                <option selected="Unknown" value="{{ gC.name }}">{{ gC.name  or gft['giftCategory']}}</option>
            {% endfor %}
        </select>
    </p>
    <p>
        <label for="giftSentiment">Sentiment</label>
        <select name="giftSentiment" id="giftSentiment">
            {% for gSen in gSentiment %}
                <option selected="Unknown" value="{{ gSen.name }}">{{ gSen.name  or gft['giftSentiment'] }}</option>
            {% endfor %}
        </select>
    </p>
    <p>
        <label for="giftRelInterest">Related Interests</label>
        <select name="giftRelInterest" id="giftRelInterest" size=5 multiple>
            {% for gRI in gRelInt %}
                <option  value="{{ gRI.name }}">{{ gRI.name  or gft['giftRelInterest'] }}</option>
            {% endfor %}
        </select>
        
    </p> 
    <hr>
    <p><tr>
        <td><input type="submit" value="Save"></td>
        <td><input type="reset" value="Reset"></td>
        <td><input type="submit" value="Cancel" onclick="history.back()"></td>
        </tr>
    </p>
    <hr>
</fieldset>
</form>
</div>
{% endblock %}

Answer 1

When you get a form value with request.form['key'], if the key doesn't exist in the request.form, Flask will raise a werkzeug.exceptions.BadRequestKeyError exception, just like what you got:

werkzeug.exceptions.BadRequestKeyError: 400 Bad Request: The browser (or proxy) sent a request that this server could not understand. KeyError: 'giftName'

It just tells you that the key giftName doesn't exist in request.form. Like what you do with dict, you can replace all the request.form[key] to request.form.get('key'), then you will get None as default value if the key doesn't exist.

Answer 2

Nothing suspicious to me... That error comes with the whole trace that should point out where it is originated exactly. Also if it's actually GET request - viewGifts.html seems strange as it has no arguments passed.