Why is flask jsonify returning unidentified?

Question

I am using fetch on the frontend to send data to my flask backend in order to make a movie seat booking. The whole process works fine until the client awaits the response, which is "undefined" . So , basically the database saves the data , the only problem is the response which is sent to the client. I used jsonify which usually works fine. Can anybody tell me what I am missing? Thanks in advance.

Here is the JS code :

function sendReservationToServer() {

    const selectedSeats = sessionStorage.getItem('selectedSeats')
    const reservation = { userId, selectedSeats, showTimeId, movieHallId }
    fetch('/bookSeats', {
        method: 'post',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(reservation)
    }).then(response => {
        response.json()
    }).then(data => {
        theatreHall.innerHTML = `${data} <br> <a href='/home'>Back to main menu</a>`
        console.log(`${data}`)
    }).catch(err => infoMsg.textContent = err)
    sessionStorage.clear()
}

And this is the flask controller which handles the request:

@app.route("/bookSeats", methods=["POST"])
def book_seats():
    selected_seats = request.json
    user_id = selected_seats.get('userId')
    seats = json.loads(selected_seats.get('selectedSeats'))
    movie_hall_id = selected_seats.get('movieHallId')
    seat_ids = []
    showtime_id = selected_seats.get('showTimeId')
    for seat in seats:
        seat_ids.append(db.session.query(Seat).filter(
            Seat.seat_number == seat).filter(Seat.movie_hall_id == movie_hall_id).all()[0].stid)
    for seat in seat_ids:
        reserved_seat = ReservedSeat(
            seat_id=seat, show_time=showtime_id, user=user_id)
        db.session.add(reserved_seat)
        db.session.commit()
    reservation = Reservation(
        user=user_id, show_time=showtime_id, number_of_tickets=len(seat_ids))
    db.session.add(reservation)
    db.session.commit()
    message = f'{seats} booked successfully'
    return jsonify(message)

Answer 1

data is undefined because the first then does not return anything. Either make it return response.json() or move everything in the second then to the first and replace data with response.json().