flutter - Flutter:我没有得到网站的回复
问题描述
我在网站上编写了一个程序,我在其中使用虚拟 API - https://reqres.in/
现在,我正在制作一个 Http 服务文件,在其中我使用该getRequest
函数从 json 文件中获取响应,但我无法得到它。
这是文件 -
import 'package:dio/dio.dart';
class HttpService {
Dio? _dio;
final baseURL="https://reqres.in/";
HttpService() {
_dio=Dio(BaseOptions(
baseUrl: baseURL,
));
initializeInterceptors();
}
Future<Response> getRequest(String endPoint) async {
Response response;
try {
print("Getting response");
response = await _dio!.get(endPoint);
print("Got response");
} on DioError catch (e) {
print("Getting endpoint request failed");
print(e.message);
throw Exception(e.message);
}
print("Returning Response");
return response;
}
initializeInterceptors() {
_dio?.interceptors.add(InterceptorsWrapper(
onError: (dioError, errorInterceptorHandler) {
print(dioError.message);
},
onRequest: (requestOptions, requestInterceptorHandler) {
print("${requestOptions.method} | ${requestOptions.path}");
print("No error, request is successful");
},
onResponse: (response, responseInterceptorHandler) {
print(response.data);
print("We have got the response");
}
));
}
}
我在这个文件中使用这个函数,第 26 行:
import 'package:dio/dio.dart';
import 'package:dio_basics/http_service.dart';
import 'package:dio_basics/model/single_user_response.dart';
import 'package:dio_basics/model/user.dart';
import 'package:flutter/material.dart';
class SingleUserScreen extends StatefulWidget {
@override
_SingleUserScreenState createState() => _SingleUserScreenState();
}
class _SingleUserScreenState extends State<SingleUserScreen> {
HttpService? http;
SingleUserResponse? singleUserResponse;
User? user;
bool isLoading = false;
Future getUser() async {
Response response;
try {
isLoading = true;
print("into get user");
response = await http!.getRequest("/api/users?page=2");
isLoading = false;
print("Got Response");
if (response.statusCode == 200) {
print("Response is ok");
setState(() {
singleUserResponse = SingleUserResponse.fromJson(
response.data); //To convert into map of <string dynamic>
user = singleUserResponse!.user;
if (user == null) {
print("User is null");
}
});
} else {
print("Problem with status Code");
}
} on Exception catch (e) {
isLoading = false;
print(e.toString());
}
}
@override
void initState() {
http=HttpService();
super.initState();
getUser();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Single User'),
),
body: isLoading
? const Center(
child: CircularProgressIndicator(),
)
: user != null ? Container(
width: double.infinity,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Image.network(user!.avatar??""),
const SizedBox(
height: 16.0,
),
Text(
"Hello ${user!.firstName} ${user!.lastName}"
)
],
),
) : const Center(child: Text('User is null'),),
);
}
}
这是输出日志 -
into get user
Getting response
GET | /api/users?page=2
No error, request is successful
有人可以告诉我,我的代码有什么错误,或者我做错了什么?
解决方案
拦截器可能有问题检查此代码我已修复它
import 'package:flutter/material.dart';
import 'package:dio/dio.dart';
import 'dart:convert';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Location',
theme: ThemeData(
primarySwatch: Colors.amber,
),
home: SingleUserScreen(
httpService: HttpService(),
),
);
}
}
class SingleUserScreen extends StatefulWidget {
final HttpService httpService;
const SingleUserScreen({
Key? key,
required this.httpService,
}) : super(key: key);
@override
_SingleUserScreenState createState() => _SingleUserScreenState();
}
class _SingleUserScreenState extends State<SingleUserScreen> {
Future<Users?> getUsers() async {
try {
print("into get user");
final result = await widget.httpService.getRequest("/api/users?page=2");
print("Got Response");
if (result.statusCode == 200) {
print("Response is ok");
return usersFromMap(result. data);
} else {
print("Problem with status Code");
}
} on Exception catch (e) {
print(e.toString());
}
return null;
}
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Single User'),
),
body: FutureBuilder<Users?>(
future: getUsers(),
builder: (context, snapshot) {
if (snapshot.hasData) {
User? user = snapshot.data?.data.first;
return SizedBox(
width: double.infinity,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Image.network(user?.avatar ?? ""),
const SizedBox(
height: 16.0,
),
Text("Hello ${user?.firstName} ${user?.lastName}")
],
),
);
}
return const Center(
child: CircularProgressIndicator(),
);
},
),
);
}
}
class HttpService {
Dio? _dio;
final baseURL = "https://reqres.in";
HttpService() {
_dio = Dio(BaseOptions(
baseUrl: baseURL,
));
}
Future<Response> getRequest(String endPoint) async {
return _dio!.get(endPoint);
}
initializeInterceptors() {
_dio?.interceptors
.add(InterceptorsWrapper(onError: (dioError, errorInterceptorHandler) {
print(dioError.message);
}, onRequest: (requestOptions, requestInterceptorHandler) {
print(
"${requestOptions.method} | ${requestOptions.baseUrl}${requestOptions.path}");
print("No error, request is successful");
}, onResponse: (response, responseInterceptorHandler) {
print(response.data);
print("We have got the response");
}));
}
}
Users usersFromMap(dynamic str) => Users.fromMap(str);
String usersToMap(Users data) => json.encode(data.toMap());
class Users {
Users({
required this.page,
required this.perPage,
required this.total,
required this.totalPages,
required this.data,
required this.support,
});
int page;
int perPage;
int total;
int totalPages;
List<User> data;
Support support;
factory Users.fromMap(Map<String, dynamic> json) => Users(
page: json["page"],
perPage: json["per_page"],
total: json["total"],
totalPages: json["total_pages"],
data: List<User>.from(json["data"].map((x) => User.fromMap(x))),
support: Support.fromMap(json["support"]),
);
Map<String, dynamic> toMap() => {
"page": page,
"per_page": perPage,
"total": total,
"total_pages": totalPages,
"data": List<dynamic>.from(data.map((x) => x.toMap())),
"support": support.toMap(),
};
}
class User {
User({
required this.id,
required this.email,
required this.firstName,
required this.lastName,
required this.avatar,
});
int id;
String email;
String firstName;
String lastName;
String avatar;
factory User.fromMap(Map<String, dynamic> json) => User(
id: json["id"],
email: json["email"],
firstName: json["first_name"],
lastName: json["last_name"],
avatar: json["avatar"],
);
Map<String, dynamic> toMap() => {
"id": id,
"email": email,
"first_name": firstName,
"last_name": lastName,
"avatar": avatar,
};
}
class Support {
Support({
required this.url,
required this.text,
});
String url;
String text;
factory Support.fromMap(Map<String, dynamic> json) => Support(
url: json["url"],
text: json["text"],
);
Map<String, dynamic> toMap() => {
"url": url,
"text": text,
};
}
推荐阅读
- react-native - 创建新频道时如何上传自定义图片
- android - 在 android textview kotlin 扩展奇怪的行为上应用多种样式
- safari - localhost 程序无法在 Windows Safari 浏览器中运行。为什么?
- typescript - 使用类为 3rd 方库创建类型
- xamarin.forms - PrismTabbedPage 动态创建,每个选项卡都有自己的参数
- ios - 无法更新 WKWebView 的高度约束 - 自动布局
- ballerina - Ballerina 对反应式编程的支持
- python - 排序后如何从python中的文本文件中显示超过100的数字?
- bash - 批量更改和替换子目录中的文件扩展名
- javascript - ngOnInit 无法更新局部变量