Search code examples
flutterflutter-http

having trouble sending json data via http.get() request in flutter

I am working on a flutter project, and I am trying to call a django based web-api, to retrieve posts that are relevant to a user in some way. Now my web-api works fine when I test it in outside of flutter app. I am able to sign-in, sign-up, thus I have no problems with my connection. there is an endpoint

.com/api/allBlogs/

this endpoint expects json data, {"uid": any_integer}

Now my question is

how can I call http.get() request in flutter and send uid along with the request.

This is my code where I am trying to hit that endpoint to retrieve blogs.

  Future<void> loadPosts(String uid) async {
    final queryParameters = {
      'uid': uid,
    };
    final headers = {HttpHeaders.contentTypeHeader: 'application/json'};
    final url = Uri.https(
        'beautyexperience.herokuapp.com', 'api/allBlogs/', queryParameters);
    try {
      List<Post> _tempPosts = [];
      final response = await http
          .get(
        url,
        headers: headers,
      )
          .then(
        (value) {
             .
             .
             .
    } catch (error) {
      print('**************************************************************');
      print('error: $error');
      throw (error);
    }
    //return [..._posts];
  }

This is the error message I am getting error

W/DynamiteModule(10228): Local module descriptor class for providerinstaller not found.
I/DynamiteModule(10228): Considering local module providerinstaller:0 and remote module providerinstaller:0
W/ProviderInstaller(10228): Failed to load providerinstaller module: No acceptable module found. Local version is 0 and remote version is 0.
I/flutter (10228): inside pickup_layout > build > streamBuilder > builder: line 25
I/flutter (10228): **************************************************************
I/flutter (10228): error: FormatException: Unexpected character (at character 1)
I/flutter (10228): <!DOCTYPE html>
I/flutter (10228): ^
E/flutter (10228): [ERROR:flutter/lib/ui/ui_dart_state.cc(199)] Unhandled Exception: FormatException: Unexpected character (at character 1)
E/flutter (10228): <!DOCTYPE html>
E/flutter (10228): ^
E/flutter (10228):
E/flutter (10228): #0      Posts.loadPosts
package:fyp_test/…/postsFolder/Posts.dart:110
E/flutter (10228): <asynchronous suspension>
E/flutter (10228):

update

This is what is returned in the body of the response, i.e. value.body

I/flutter (11594): extractedData: <!DOCTYPE html>
I/flutter (11594): <html lang="en">
I/flutter (11594): <head>
I/flutter (11594):   <meta http-equiv="content-type" content="text/html; charset=utf-8">
I/flutter (11594):   <meta name="robots" content="NONE,NOARCHIVE">
I/flutter (11594):   <title>KeyError
I/flutter (11594):           at /api/allBlogs/</title>
I/flutter (11594):   <style type="text/css">
I/flutter (11594):     html * { padding:0; margin:0; }
I/flutter (11594):     body * { padding:10px 20px; }
I/flutter (11594):     body * * { padding:0; }
I/flutter (11594):     body { font:small sans-serif; background-color:#fff; color:#000; }
I/flutter (11594):     body>div { border-bottom:1px solid #ddd; }
I/flutter (11594):     h1 { font-weight:normal; }
I/flutter (11594):     h2 { margin-bottom:.8em; }
I/flutter (11594):     h3 { margin:1em 0 .5em 0; }
I/flutter (11594):     h4 { margin:0 0 .5em 0; font-weight: normal; }
I/flutter (11594):     code, pre { font-size: 100%; white-space: pre-wrap; }
I/flutter (11594):     table { border:1px solid #ccc; border-collapse: collapse; width:100%; background:white; }
Solution

  • You can use Dio package and send your data as json in queryParameter. Here i provide example

    Response response;
var dio = Dio();
response = await dio.get('https://beautyexperience.herokuapp.com/api/allBlogs',
queryParameters: {"uid": any_integer});

    update As i found, you have a server error. When you call api, the server returns to you an html response that say an error occurred and the error is <title>KeyError at /api/allBlogs/</title>. Can check your api service.

    Anyway, i suggest using Dio is better and more comfortable.