Socket.io, сохраненное изображение на сервере не открывается

Question

Я пытаюсь сохранить изображение с холста на сервере, но изображение не открывается (не поддерживается формат).

Клиент:

const canvas = document.getElementById('canvas');

var sendData = () => {
  const dataURL = canvas.toDataURL();

  socket.emit('sendImage', dataURL.toString('base64'));
};

Сервер:

io.on('connection', function(socket) {
  socket.on('sendImage', (imageData) => {
    fs.writeFile(__dirname + '/image.png', imageData, function (err) 
  {
    if (err) throw err;
    console.log('It\'s saved!');
  });
});
});

Answer 1

Я нашел решение.

Клиент:

dataURL.toString ('base64') содержит данные в кодировке base64 в формате

data: image / png; base64, / 9j / 4AAQSkZJRgABA… Итак, нам нужно избавиться от типа mime и информации о кодировке спереди.

var sendData = () => {
  const dataURL = canvas.toDataURL().toString('base64');
  const toSend = dataURL.split(',')[1];

  socket.emit('sendImage', toSend);
};

Сервер:

Теперь нам нужно преобразовать его буфер.

fs.writeFile(__dirname + '/image.png', Buffer.from(imageData, 'base64'), function 
  (err) {
    if (err) throw err;
    console.log('It\'s saved!');
  });