web-dev-qa-db-fra.com

Convertir une chaîne base64 en image

J'essaie de recadrer/redimensionner l'image de profil utilisateur à l'aide du plug-in jquery, à savoir crop.js, qui envoie une image d'utilisateur en base64 via ajax à mon contrôleur en tant que 

$.ajax({
         type: "post",
         dataType: "json",
         url: "${g.createLink(controller: 'personalDetail', action:'uploadUserImage')}",
         data: { avatar: canvas.toDataURL() }

        });

mais je suis incapable de décoder cette base64

'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAPAAAADwCAYAAAA+VemSAAAgAEl...=='

string as Image, pouvez-vous me guider, comment enregistrer ma chaîne base64 sous forme d'image sur mon serveur ?.

javaajaximagegrailsbase64
26
Abs

Cela suppose que vous sachiez quel est le nom du fichier de sortie et que vos données sont fournies sous forme de chaîne. Je suis sûr que vous pouvez modifier les éléments suivants pour répondre à vos besoins:

// Needed Imports
import Java.io.ByteArrayInputStream;
import Sun.misc.BASE64Decoder;


def sourceData = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAPAAAADwCAYAAAA+VemSAAAgAEl...==';

// tokenize the data
def parts = sourceData.tokenize(",");
def imageString = parts[1];

// create a buffered image
BufferedImage image = null;
byte[] imageByte;

BASE64Decoder decoder = new BASE64Decoder();
imageByte = decoder.decodeBuffer(imageString);
ByteArrayInputStream bis = new ByteArrayInputStream(imageByte);
image = ImageIO.read(bis);
bis.close();

// write the image to a file
File outputfile = new File("image.png");
ImageIO.write(image, "png", outputfile);

S'il vous plaît noter, ceci est juste un exemple de ce que les parties sont impliquées. Je n'ai pas du tout optimisé ce code et il l'a écrit comme ça.

38
Joshua Moore

Sur le serveur, faites quelque chose comme ça:

Supposer

String data = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAPAAAADwCAYAAAA+VemSAAAgAEl...=='

Ensuite:

String base64Image = data.split(",")[1];
byte[] imageBytes = javax.xml.bind.DatatypeConverter.parseBase64Binary(base64Image);

Ensuite, vous pouvez faire ce que vous voulez avec les octets comme:

BufferedImage img = ImageIO.read(new ByteArrayInputStream(imageBytes));
48
geo

ImageIO.write() compressera l'image par défaut - l'image compressée a une taille plus petite mais semble parfois étrange. J'utilise BufferedOutputStream pour enregistrer les données du tableau d'octets - cela conservera la taille d'origine de l'image.

Voici le code:

import javax.xml.bind.DatatypeConverter;
import Java.io.*;

public class ImageTest {
    public static void main(String[] args) {
        String base64String = "data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAAHkAAAB5C...";
        String[] strings = base64String.split(",");
        String extension;
        switch (strings[0]) {//check image's extension
            case "data:image/jpeg;base64":
                extension = "jpeg";
                break;
            case "data:image/png;base64":
                extension = "png";
                break;
            default://should write cases for more images types
                extension = "jpg";
                break;
        }
        //convert base64 string to binary data
        byte[] data = DatatypeConverter.parseBase64Binary(strings[1]);
        String path = "C:\\Users\\Ene\\Desktop\\test_image." + extension;
        File file = new File(path);
        try (OutputStream outputStream = new BufferedOutputStream(new FileOutputStream(file))) {
            outputStream.write(data);
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}
6
Ayano

Fichiers d’encodage/images côté serveur vers base64String prêts pour la consommation côté client

public Optional<String> InputStreamToBase64(Optional<InputStream> inputStream) throws IOException{
    if (inputStream.isPresent()) {
        ByteArrayOutputStream output = new ByteArrayOutputStream();
        FileCopyUtils.copy(inputStream.get(), output);
        //TODO retrieve content type from file, & replace png below with it
        return Optional.ofNullable("data:image/png;base64," + DatatypeConverter.printBase64Binary(output.toByteArray()));
    }

    return Optional.empty();
}

Décodeur image/fichier base64 côté serveur

public Optional<InputStream> Base64InputStream(Optional<String> base64String)throws IOException {
    if (base64String.isPresent()) {
        return Optional.ofNullable(new ByteArrayInputStream(DatatypeConverter.parseBase64Binary(base64String.get())));
    }

    return Optional.empty();
}
3
iamiddy
  public Optional<String> InputStreamToBase64(Optional<InputStream> inputStream) throws IOException{
    if (inputStream.isPresent()) {
        ByteArrayOutputStream outpString base64Image = data.split(",")[1];
byte[] imageBytes = javax.xml.bind.DatatypeConverter.parseBase64Binary(base64Image);

Ensuite, vous pouvez faire ce que vous voulez avec les octets comme:

BufferedImage img = ImageIO.read(new ByteArrayInputStream(imageBytes));ut = new ByteArrayOutputStream();
        FileCopyUtils.copy(inputStream.get(), output);
        //TODO retrieve content type from file, & replace png below with it
        return Optional.ofNullable("data:image/png;base64," + DatatypeConverter.printBase64Binary(output.toByteArray()));
    }

    return Optional.empty();
2
mero

Salut c'est ma solution 

Code javascript

    var base64before = document.querySelector('img').src;
    var base64 = base64before.replace(/^data:image\/(png|jpg);base64,/, "");
    var httpPost = new XMLHttpRequest();
    var path = "your url";
    var data = JSON.stringify(base64);

    httpPost.open("POST", path, false);
    // Set the content type of the request to json since that's what's being sent
    httpPost.setRequestHeader('Content-Type', 'application/json');
    httpPost.send(data);

Ceci est mon code Java.

    public void saveImage(InputStream imageStream){
    InputStream inStream = imageStream;

    try {
        String dataString = convertStreamToString(inStream);

        byte[] imageBytes = javax.xml.bind.DatatypeConverter.parseBase64Binary(dataString);
        BufferedImage image = ImageIO.read(new ByteArrayInputStream(imageBytes));
        // write the image to a file
        File outputfile = new File("/Users/paul/Desktop/testkey/myImage.png");
        ImageIO.write(image, "png", outputfile);

        }catch(Exception e) {
            System.out.println(e.getStackTrace());
        }
    }



  static String convertStreamToString(Java.io.InputStream is) {
    Java.util.Scanner s = new Java.util.Scanner(is).useDelimiter("\\A");
    return s.hasNext() ? s.next() : "";
  }
0
paulrda