CODEWITHSUNDEEP
node.jstypescriptflutterexpressflutter-getx
Fabiano Castro Monteiro
Fabiano Castro Monteiro

Reputation: 11

Access API NodeJS with express, by Flutter GetX, return response null

I try integration forntend Flutter with GetX, accessing API NodeJS framework Express. I'm create a simple Server:

import express from "express";
import cors from 'cors';

const PORT = 3000;
const app = express();

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "GET, PUT, PATCH, POST, DELETE");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    app.use(cors({
        origin: '*'
    }));
    next();
});
  
app.get('/', (request, response) => {
    response.status(200).send(JSON.stringify(
        {
            message: 'Welcome to API, for test'
        }
    ));
});

app.get('/users', (req, res) => {
    console.log(req);
    const users = [{
        id: 1,
        name: 'Steave Jobs',
        email: '[email protected]',
    }, {
        id: 2,
        name: 'Bill Gates',
        email: '[email protected]',
    }, {
        id: 3,
        name: 'Mark Zuckerberg',
        email: '[email protected]',
    }];

    console.log(JSON.stringify(users, null, "\t"));
    res.status(200).send(JSON.stringify(users, null, "\t"));
});

app.listen(PORT, () => {
    console.log(`Server inicializated in port ${PORT}`);
});

In the repository of flutter my code is:

import 'package:get/get.dart';
import 'package:teste_api/user.model.dart';

class UserRepository extends GetConnect {
  Future<List<User>> getUsers() async {
    List<User> users = [];

    var path = 'http://localhost:3000/users';

    print("*********************************************************************");
    print(path);
    print("*********************************************************************");
    final response = await get(path);
    print('STATUS: ${response.statusCode}');
    print('RESPONSE: ${response.body}');
    print("*********************************************************************");

    return users;
  }
}

The result is this:

Performing hot reload... Syncing files to device sdk gphone64 x86 64... 

I/flutter (  823): ****************************************************************** 

I/flutter (  823): http://localhost:3000/users 

I/flutter (  823): ****************************************************************** 

Reloaded 1 of 812 libraries in 1.085ms (compile: 52 ms, reload: 298 ms, reassemble: 295 ms). D/EGL_emulation(  823): app_time_stats: avg=65535.99ms min=48.92ms max=131023.07ms count=2 

I/flutter (  823): STATUS: null 

I/flutter (  823): RESPONSE: null 

I/flutter (  823): ******************************************************************

What is this my Error?

Accessing the API using Postman is correct! Flutter, acessing outer API public, 'https://jsonplaceholder.typicode.com/users', is correct too!

Upvotes: 1

Views: 36

Answers (2)

murakami Kau&#234;
murakami Kau&#234;

Reputation: 73

If last answer don't work try this:

Are you running on a local server? If so, did you change it via adb? In your case:

adb reverse tcp:3000 tcp:3000 and try request again.

if your consoles.log show the correct json, maybe it could be this.

Upvotes: 0

Hieu Pham
Hieu Pham

Reputation: 1

What you respond from /users is a JSON string instead of a JSON object, because of that plus the defaultContentType of GetHttpClient is 'application/json; charset=utf-8', you got null in the Flutter client.

So instead of

res.status(200).send(JSON.stringify(users, null, "\t"));

you could try respond the object directly

res.status(200).send(users);

Upvotes: 0

Related Questions