Ytukyg

I am trying out flask, I have a form served from the following route:

@app.route("/register",methods=['GET','POST'])

def register():

    form = RegistrationForm()

    if form.validate_on_submit():

        employee = Employee(name=form.name,emp_id=form.emp_id,email=form.email,password=form.password)

        return redirect(url_for('home'))

    return render_template('register.html',form=form)

I wanted to have client side validation just to check whether the entered email exists in the database. I tried submitting the email field to a different route which is given below to see how things work.

@app.route('/email',methods=['POST'])

def email():

    print(request.form['email'])

    return "success"

The following is my javascript code for ajax request which gets called when a blur event happens in the input field.

function emailSubmit(event) {



    console.log($('#email').serialize());

    $.ajax({

        type: "POST",

        url: url,

        data: $('#email').serialize(), // serializes the form's elements.

        success: function(data) {

            console.log(data) // display the returned data in the console.

        }

    });



    $.ajaxSetup({

        beforeSend: function(xhr, settings) {

            if (!/^(GET|HEAD|OPTIONS|TRACE)$/i.test(settings.type) && !this.crossDomain) {

                xhr.setRequestHeader("X-CSRFToken", csrfToken)

            }

        }

    })



}

The javascript file is in the static folder and the url and csrf_token is supplied using global variables.

The issue is that on first post request to the route "email" I am getting a

Bad Request "The CSRF token is missing."

But everything works perfectly fine from the next post request onwards. The same csrf token is sent in the next request too. Why is this happening?
I have enabled csrf protection globally.