Flutter JSON数据问题

问题描述

我面临着从Flutter移动应用获取json数据的问题。

代码如下：

import 'package:flutter/material.dart';
import 'package:flutter_app/pages/main_page.dart';


class App extends StatelessWidget
{
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,title: "Flutter NodeJS",home: MainPage(),);
  }
}
void main(){
  runApp(App());
}

main_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_app/modules/http.dart';
import 'package:flutter_app/pages/add_user_page.dart';

class MainPage extends StatefulWidget
{
  @override
  State<StatefulWidget> createState() {
    return MainPageState();
  }
}
class User
{
  String id;
  String first_name,email;
  User(this.id,this.first_name,this.email);
}
class MainPageState extends State<MainPage>
{
  List<User> users = [];
  Future<void> refreshUsers()async{
    var result = await http_get('users');
    if(result.ok)
    {
      setState(() {
        users.clear();
        var in_users = result.data as List<dynamic>;
        in_users.forEach((in_user){
          users.add(User(
            in_user['id'].toString(),in_user['first_name'],in_user['email']
          ));
        });
      });
    }
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Users"),//email: Text("Email"),actions: <Widget>[
          IconButton(
            icon: Icon(Icons.add),onPressed: (){
              Navigator.of(context).push(MaterialPageRoute(
                builder: (context){
                  return AddUserPage();
                }
              ));
            },)
        ],),body: RefreshIndicator(

        onRefresh: refreshUsers,child: ListView.separated(
          itemCount: users.length,itemBuilder: (context,i) => ListTile(
            leading: Icon(Icons.person),title: Text(users[i].first_name+"\n" + users[i].email),//email: Text(users[i].email),separatorBuilder: (context,i) => Divider(),);
  }
}

http.dart

import 'dart:convert';

import "package:http/http.dart" as http;

class RequestResult
{
  bool ok;
  dynamic data;
  RequestResult(this.ok,this.data);
}
//'https://jsonplaceholder.typicode.com/users/1
//http://192.168.183.179:8081/api/users/
const PROTOCOL = "http";
const DOMAIN = "https://jsonplaceholder.typicode.com/users/1";

Future<RequestResult> http_get(String route,[dynamic data]) async
{
  var dataStr = jsonEncode(data);
  var url = "$PROTOCOL://$DOMAIN/$route?data=$dataStr";
  var result = await http.get(url);
  return RequestResult(true,jsonDecode(result.body));
}
Future<RequestResult> http_post(String route,[dynamic data]) async
{
  var url = "$PROTOCOL://$DOMAIN/$route";
  var dataStr = jsonEncode(data);
  var result = await http.post(url,body: dataStr,headers:{"Content-Type":"application/json"});
  return RequestResult(true,jsonDecode(result.body));
}

当我从“ https://jsonplaceholder.typicode.com/users/1”获取json数据时。它的工作正常。 enter image description here

当我尝试从“ https://192.168.183.179:8081/api/users”获取json数据时。其给出错误：

at Object.createErrorWithStack（http：// localhost：15340 / dart_sdk.js：4348：12） 在Object._rethrow（http：// localhost：15340 / dart_sdk.js：37892：16） 在async._AsyncCallbackEntry.new.callback（http：// localhost：15340 / dart_sdk.js：37886：13） 在Object._microtaskLoop（http：// localhost：15340 / dart_sdk.js：37718：13） 在_startMicrotaskLoop（http：// localhost：15340 / dart_sdk.js：37724：13） 在http：// localhost：15340 / dart_sdk.js：33243：9

我做错了

关于， SAO

解决方法

检查邮递员该IP地址是否正在返回数据。

另一种情况是获取的数据，无法正确传输到应用程序。检查数据存储的变量和类型。