Uploading image to backend

Question

I can not get image upload to my restAPI server via http package. I spend whole day looking for an answer and didn't find any. My backend require an actually image but I don't seems to manage it with http package.

 Future<void> createProfile(Profile profile) async { try { var request = new http.MultipartRequest("POST", Uri.parse(APIPath.createProfile())); request.fields.addAll(profile.toMap()); request.files.add(await http.MultipartFile.fromPath( 'image', profile.image.path, contentType: MediaType('image', '*'))); request.headers['authorization'] = "Bearer $_token"; final response = await request.send(); if (response.statusCode == 200) print('Uploaded!'); notifyListeners(); } catch (error) { throw error; } }

My backend is written in node.js and was tested in postman so backend should be fine. However when I tried to upload an image from my front end it gives me error only images allowed which means the image doesn't get to the server(allowed image type is correct). Please any help appreciated

error triggered in Node.js

const fileFilter = (req, file, cb) => { if (file.mimetype === 'image/png' || file.mimetype === 'image/gif' || file.mimetype === 'image/jpg' || file.mimetype === 'image/jpeg') { cb(null, true); } else { const error = new Error('Only images are allowed') error.statusCode = 406; cb(error); } }

request.files.add(await http.MultipartFile.fromPath( 'image', profile.image.path, )); — John Joe
– John Joe, Commented Jun 12, 2020 at 11:39
@JohnJoe I have changed MediaType('image', '*') to MediaType('image', 'jpg') and it works. Reason why I used '*' was to allowed all image types from my client side to be uploaded to my backend.. So how do you allow all image types to be uploaded without specifying type then? — delmin
– delmin, Commented Jun 12, 2020 at 12:23
@JohnJoe well never mind..I'll ask in new question about it. You helped me a lot.. thanks.. Can you perhaps answer this question where you point me for that mistake so I can mark the question as answered? — delmin
– delmin, Commented Jun 12, 2020 at 12:43

John Joe · Accepted Answer · 2020-06-13 08:53:00Z

1

That because contentType: MediaType('image', '*') will resulted as image/*, which did not matched with the file.mimetype in node.js.

edited Jun 13, 2020 at 8:53

answered Jun 12, 2020 at 11:37

John Joe

12.8k19 gold badges79 silver badges142 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

proversion · Accepted Answer · 2020-06-12 11:56:28Z

0

 uri = Uri.parse(url); var request = new MultipartRequest("PUT", uri); var multipartFile = await MultipartFile.fromPath("package", path); //path = filepath request.files.add(multipartFile); StreamedResponse response = await request.send(); return response;

answered Jun 12, 2020 at 11:56

proversion

5933 gold badges12 silver badges25 bronze badges

2 Comments

delmin Over a year ago

Thanks for the answer but that is exactly what I have and it doesn't work. Please see updated code in my question

double-beep Over a year ago

While this code may solve the question, including an explanation of how and why this solves the problem would really help to improve the quality of your post, and probably result in more up-votes. Remember that you are answering the question for readers in the future, not just the person asking now. Please edit your answer to add explanations and give an indication of what limitations and assumptions apply. From Review

Collectives™ on Stack Overflow

Uploading image to backend

2 Answers 2

Comments

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Related