data parsing between flutter and Flask REST API

Question

I am trying to POST request from my flutter application to the Flask REST API, testing API with POST MAN has no problem, but on flutter I am getting error in flutter like this:

I/flutter ( 6378): FormatException: Unexpected character (at character 1) I/flutter ( 6378): I/flutter ( 6378): ^

and in Flask APP like this:

[2020-01-23 11:42:32,517] ERROR in app: Exception on /cards [POST] Traceback (most recent call last): File "/home/shaukat/.local/lib/python3.7/site-packages/flask/app.py", line 2311, in wsgi_app response = self.full_dispatch_request() File "/home/shaukat/.local/lib/python3.7/site-packages/flask/app.py", line 1834, in full_dispatch_request rv = self.handle_user_exception(e) File "/home/shaukat/.local/lib/python3.7/site-packages/flask/app.py", line 1737, in handle_user_exception reraise(exc_type, exc_value, tb) File "/home/shaukat/.local/lib/python3.7/site-packages/flask/_compat.py", line 36, in reraise raise value File "/home/shaukat/.local/lib/python3.7/site-packages/flask/app.py", line 1832, in full_dispatch_request rv = self.dispatch_request() File "/home/shaukat/.local/lib/python3.7/site-packages/flask/app.py", line 1818, in dispatch_request return self.view_functionsrule.endpoint File "/home/shaukat/Projects/udemy flask rest API and python/rest-api-sections-master/section3/app.py", line 19, in create_card 'id': request_data["id"], TypeError: 'NoneType' object is not subscriptable 127.0.0.1 - - [23/Jan/2020 11:42:32] "POST /cards HTTP/1.1" 500 - My code in flutter:

Future<void> addNewCard(NewCard product) async {
const url = 'http://10.0.2.2:5000/cards';
try {
  final response = await http.post(
    url,
    body: json.encode({
      'id': product.id,
      'cardNo': product.cardNo,
      'cardType': product.cardType,
      'amount': product.amount,
    }),
  );
  final newProduct = NewCard(
    id: json.decode(response.body)['id'],
    cardNo: product.cardNo,
    cardType: product.cardType,
    amount: product.amount,
  );
  print(newProduct);
  _newCard.add(product);
  // _items.insert(0, newProduct); // at the start of the list
  notifyListeners();
} catch (error) {
  print(error);
  throw error;
}}

code in python Flask:

@app.route('/cards', methods=['POST'])
def create_card():
    request_data = request.get_json()
    new_cards = {
        'id': request_data["id"],
        'cardNo': request_data["cardNo"],
        'cardType': request_data["cardType"],
        'amount': request_data["amount"],
   }
   cards.append(new_cards)
   return jsonify(cards)

Solution

I eventually found the solution in a comment of this post Flutter POST request body not sent

I had to add headers: {"Content-Type": "application/json"} in my post request. thanks for your help

Comments

[Pedro Rodrigues]

In the flask script, where is cards coming from?

[Shaukat hussain]

http.post( url, body: json.encode({ 'id': product.id, 'cardNo': product.cardNo, 'cardType': product.cardType, 'amount': product.amount, }),

[Shaukat hussain]

i have tried changing the Integer to String on both ends, but still the same. thanks

[Shaukat hussain]

but HTTP error is like this: " HTTP/1.0 500 INTERNAL SERVER ERROR

[Ethan K]

Did you try to debug it and see what are you receiving in the server prior to handling? Because from what I see it seems like the issue is inside the server.

[Shaukat hussain]

I eventually found the solution in a comment of this stackoverflow.com/questions/53792081/… I had to add headers: {"Content-Type": "application/json"} in my post request. thanks for your help

[Ethan K]

Makes sense why the Server couldn't parse it, because it did not understand the content type. Glad you solved it!