How to send image over socket connection? - sockets

Question

I have been trying to send image over socket connection from client to server which will be saved on the server.
The socket connection works fine for string messages but when I try to send an image, it is not transmitted correctly. Please give me a clue on what's the right way to do it.
Server-side code:
import 'dart:io';
import 'dart:typed_data';
void main() async {
Uint8List bytes= await File('1.jpg').readAsBytes();
final socket = await Socket.connect('localhost', 8000);
print('Connected to: ${socket.remoteAddress.address}:${socket.remotePort}');
// listen for responses from the server
socket.listen(
// handle data from the server
(Uint8List data) {
final serverResponse = String.fromCharCodes(data);
print('Server: $serverResponse');
},
// handle errors
onError: (error) {
print(error);
socket.destroy();
},
// handle server ending connection
onDone: () {
print('Server left.');
socket.destroy();
},
);
// send some messages to the server
await sendMessage(socket, bytes);
}
Future<void> sendMessage(Socket socket, Uint8List message) async {
print('Client: $message');
socket.write(message);
}
Client-side code:
import 'dart:convert';
import 'dart:io';
import 'dart:typed_data';
import 'package:image/image.dart';
void main() async {
// bind the socket server to an address and port
final server = await ServerSocket.bind('127.0.0.1', 8000);
// listen for clent connections to the server
server.listen((client) {
handleConnection(client);
});
}
void handleConnection(Socket client) {
print('Connection from'
' ${client.remoteAddress.address}:${client.remotePort}');
// listen for events from the client
client.listen(
// handle data from the client
(Uint8List data) async {
// final message = String.fromCharCodes(data);
print(data);
await File('new.jpg').writeAsBytes(data);
},
// handle errors
onError: (error) {
print(error);
client.close();
},
// handle the client closing the connection
onDone: () {
print('Client left');
client.close();
},
);
}
Faulty image on server-side:

Answer 1

Just change socket.write(message) to socket.add(message) at the client-side and you are good to go
Future<void> sendMessage(Socket socket, Uint8List message) async {
print('Client: $message');
socket.add(message);
}
because socket.write(object) Converts object to a String by invoking Object.toString.
have a nice day:)