Flutter Dio:无法将图像上传到服务器
Flutter Dio: Failed Upload Image to Server
首先,我先在 Postman 中尝试,它成功了。
之后,我创建了我的 dio 函数来像这样上传到服务器。
Future<AttendanceResponse> checkOut(
String timeOfCheckout,
File image,
String notes,
) async {
try {
String fileName = image.path.split('/').last;
print("Image name --> $fileName");
print("Image path --> ${image.path}");
final formData = FormData.fromMap({
"out": timeOfCheckout,
"out_picture": await MultipartFile.fromFile(
image.path,
filename: fileName,
),
"out_note": notes,
"late": 0,
});
final response = await dio.post("attendances/check-out", data: formData);
return AttendanceResponse.fromJson(response.data);
} on DioError catch (e) {
return e.error;
}
}
但是出现如下错误。
Dio Response Error --> DioError [DioErrorType.RESPONSE]: Http status error [302]
这是来自相机的文件和路径。
I/flutter ( 2163): Image name --> scaled_32592bd5-704d-4e0a-9976-9ea94c667f7d4583818212866102164.jpg
I/flutter ( 2163): Image path --> /storage/emulated/0/Android/data/id.cometdev.bozzetto.dev/files/Pictures/scaled_32592bd5-704d-4e0a-9976-9ea94c667f7d4583818212866102164.jpg
我已经在谷歌上搜索并阅读了 dio 的文档并按照它进行操作,但仍然出现此错误。
您需要将 contentType
属性 添加到表单数据中。它看起来像这样,
final formData = FormData.fromMap({
"out": timeOfCheckout,
"out_picture": await MultipartFile.fromFile(
image.path,
filename: fileName,
contentType: new MediaType("image", "jpeg"), // Here we add the content type!
),
"out_note": notes,
"late": 0,
});
这是我的错,我忘了在我的 dio 函数中添加 token
。
Future<AttendanceResponse> checkOut(
String timeOfCheckout,
File image,
String notes,
) async {
try {
var fileName = image.path.split('/').last;
var token = await prefHelper.getToken();
print("Token --> $token");
var headers = {
'content-type': 'application/json',
'accept': 'application/json',
'authorization': 'Bearer $token',
};
final formData = FormData.fromMap({
"out": timeOfCheckout,
"out_picture": await MultipartFile.fromFile(
image.path,
filename: fileName,
),
"out_note": notes,
"late": 0,
});
final response = await dio.post("attendances/check-out",
data: formData, options: Options(method: "POST", headers: headers));
return AttendanceResponse.fromJson(response.data);
} on DioError catch (e) {
return e.error;
}
}
首先,我先在 Postman 中尝试,它成功了。
之后,我创建了我的 dio 函数来像这样上传到服务器。
Future<AttendanceResponse> checkOut(
String timeOfCheckout,
File image,
String notes,
) async {
try {
String fileName = image.path.split('/').last;
print("Image name --> $fileName");
print("Image path --> ${image.path}");
final formData = FormData.fromMap({
"out": timeOfCheckout,
"out_picture": await MultipartFile.fromFile(
image.path,
filename: fileName,
),
"out_note": notes,
"late": 0,
});
final response = await dio.post("attendances/check-out", data: formData);
return AttendanceResponse.fromJson(response.data);
} on DioError catch (e) {
return e.error;
}
}
但是出现如下错误。
Dio Response Error --> DioError [DioErrorType.RESPONSE]: Http status error [302]
这是来自相机的文件和路径。
I/flutter ( 2163): Image name --> scaled_32592bd5-704d-4e0a-9976-9ea94c667f7d4583818212866102164.jpg
I/flutter ( 2163): Image path --> /storage/emulated/0/Android/data/id.cometdev.bozzetto.dev/files/Pictures/scaled_32592bd5-704d-4e0a-9976-9ea94c667f7d4583818212866102164.jpg
我已经在谷歌上搜索并阅读了 dio 的文档并按照它进行操作,但仍然出现此错误。
您需要将 contentType
属性 添加到表单数据中。它看起来像这样,
final formData = FormData.fromMap({
"out": timeOfCheckout,
"out_picture": await MultipartFile.fromFile(
image.path,
filename: fileName,
contentType: new MediaType("image", "jpeg"), // Here we add the content type!
),
"out_note": notes,
"late": 0,
});
这是我的错,我忘了在我的 dio 函数中添加 token
。
Future<AttendanceResponse> checkOut(
String timeOfCheckout,
File image,
String notes,
) async {
try {
var fileName = image.path.split('/').last;
var token = await prefHelper.getToken();
print("Token --> $token");
var headers = {
'content-type': 'application/json',
'accept': 'application/json',
'authorization': 'Bearer $token',
};
final formData = FormData.fromMap({
"out": timeOfCheckout,
"out_picture": await MultipartFile.fromFile(
image.path,
filename: fileName,
),
"out_note": notes,
"late": 0,
});
final response = await dio.post("attendances/check-out",
data: formData, options: Options(method: "POST", headers: headers));
return AttendanceResponse.fromJson(response.data);
} on DioError catch (e) {
return e.error;
}
}