web-dev-qa-db-fra.com

Convertir l'octet [] en chaîne Base64 pour l'URI de données

Je sais que cela a probablement été posé 10000 fois, cependant, je n'arrive pas à trouver une réponse directe à la question.

J'ai un LOB stocké dans ma base de données qui représente une image; Je reçois cette image de la base de données et je voudrais la montrer sur une page Web via la balise HTML IMG. Ce n'est pas ma solution préférée, mais c'est une mise en œuvre provisoire jusqu'à ce que je puisse trouver une meilleure solution.

J'essaie de convertir l'octet [] en Base64 en utilisant le codec Apache Commons de la manière suivante:

String base64String = Base64.encodeBase64String({my byte[]});

Ensuite, j'essaie de montrer mon image sur ma page comme ceci:

<img src="data:image/jpg;base64,{base64String from above}"/>

Il affiche la valeur par défaut du navigateur "Je ne trouve pas cette image", image.

Quelqu'un a-t-il une idée?

Merci.

javahtmlbytearraybase64
37
El Guapo

Je l'ai utilisé et cela a bien fonctionné (contrairement à la réponse acceptée, qui utilise un format non recommandé pour ce scénario):

StringBuilder sb = new StringBuilder();
sb.append("data:image/png;base64,");
sb.append(StringUtils.newStringUtf8(Base64.encodeBase64(imageByteArray, false)));
contourChart = sb.toString();
40
WhyNotHugo

Selon la documentation officielle Base64.encodeBase64URLSafeString(byte[] binaryData) devrait être ce que vous recherchez.

Le type mime pour JPG est également image/jpeg.

12
Crozin

Voilà la syntaxe correcte. Il se peut que votre navigateur Web ne prenne pas en charge le schéma d'URI de données. Voir Quels navigateurs prennent en charge les URI de données et depuis quelle version?

En outre, le type JPEG MIME est image/jpeg.

3
Daniel Trebbien

Vous pouvez également envisager de diffuser les images vers le navigateur plutôt que de les encoder sur la page elle-même.

Voici un exemple de streaming d'une image contenue dans un fichier vers le navigateur via un servlet, qui pourrait facilement être adopté pour diffuser le contenu de votre BLOB, plutôt qu'un fichier:

  public void doGet(HttpServletRequest req, HttpServletResponse resp)
    throws ServletException, IOException
  {
    ServletOutputStream sos = resp.getOutputStream();
    try {
      final String someImageName = req.getParameter(someKey);

      // encode the image path and write the resulting path to the response
      File imgFile = new File(someImageName);

      writeResponse(resp, sos, imgFile);
    }
    catch (URISyntaxException e) {
      throw new ServletException(e);
    }
    finally {
      sos.close();
    }
  }

  private void writeResponse(HttpServletResponse resp, OutputStream out, File file)
    throws URISyntaxException, FileNotFoundException, IOException
  {
    // Get the MIME type of the file
    String mimeType = getServletContext().getMimeType(file.getAbsolutePath());
    if (mimeType == null) {
      log.warn("Could not get MIME type of file: " + file.getAbsolutePath());
      resp.setStatus(HttpServletResponse.SC_INTERNAL_SERVER_ERROR);
      return;
    }

    resp.setContentType(mimeType);
    resp.setContentLength((int)file.length());

    writeToFile(out, file);
  }

  private void writeToFile(OutputStream out, File file)
    throws FileNotFoundException, IOException
  {
    final int BUF_SIZE = 8192;

    // write the contents of the file to the output stream
    FileInputStream in = new FileInputStream(file);
    try {
      byte[] buf = new byte[BUF_SIZE];
      for (int count = 0; (count = in.read(buf)) >= 0;) {
        out.write(buf, 0, count);
      }
    }
    finally {
      in.close();
    }
  }
2
jhouse

Si vous ne souhaitez pas diffuser à partir d'une servlet, enregistrez le fichier dans un répertoire de la racine Web, puis créez le src pointant vers cet emplacement. De cette façon, le serveur Web effectue le travail de traitement du fichier. Si vous vous sentez particulièrement intelligent, vous pouvez rechercher un fichier existant par horodatage/inode/crc32 et l'écrire uniquement s'il a changé dans la base de données, ce qui peut vous donner une amélioration des performances. Cette méthode de fichier prend également automatiquement en charge les en-têtes ETag et if-modified-since afin que le navigateur puisse mettre correctement en cache le fichier.

1
Mark Porter