Question

1）下面是我编码图像的方法 -

StringBuilder prefixToImageEncodedString=new StringBuilder("data:image/*;base64,"); 

 InputStream in =new BufferedInputStream(new FileInputStream("D:/resources/Australia.jpg"));
byte[] bytes=ImageIO.read(in).toString().getBytes();
String encodedfile = new String(Base64.encode(bytes), "UTF-8");
String imageBaseURL=prefixToImageEncodedString.append(encodedfile).toString();

我得到以下输出： -

   data:image/*;base64,QnVmZmVyZWRJbWFnZUAxMzA5OWNjOiB0eXBlID0gNSBDb2xvck1vZGVsOiAjcGl4ZWxCaXRzID0gMjQgbnVtQ29tcG9uZW50cyA9IDMgY29sb3Igc3BhY2UgPSBqYXZhLmF3dC5jb2xvci5JQ0NfQ29sb3JTcGFjZUAxYzEyMWI2IHRyYW5zcGFyZW5jeSA9IDEgaGFzIGFscGhhID0gZmFsc2UgaXNBbHBoYVByZSA9IGZhbHNlIEJ5dGVJbnRlcmxlYXZlZFJhc3Rlcjogd2lkdGggPSAxODggaGVpZ2h0ID0gMTE5ICNudW1EYXRhRWxlbWVudHMgMyBkYXRhT2ZmWzBdID0gMg==

在前端（AngularJS），当我通过设置字符串显示图像时，它不显示图像。

<img src="{{countryImageNew}}" class="img1">

需要指导。

Answer 1

  <img src="data:image/*;base64,QnVmZmVyZWRJbWFnZUAxMzA5OWNjOiB0eXBlID0gNSBDb2xvck1vZGVsOiAjcGl4ZWxCaXRzID0gMjQgbnVtQ29tcG9uZW50cyA9IDMgY29sb3Igc3BhY2UgPSBqYXZhLmF3dC5jb2xvci5JQ0NfQ29sb3JTcGFjZUAxYzEyMWI2IHRyYW5zcGFyZW5jeSA9IDEgaGFzIGFscGhhID0gZmFsc2UgaXNBbHBoYVByZSA9IGZhbHNlIEJ5dGVJbnRlcmxlYXZlZFJhc3Rlcjogd2lkdGggPSAxODggaGVpZ2h0ID0gMTE5ICNudW1EYXRhRWxlbWVudHMgMyBkYXRhT2ZmWzBdID0gMg==">

我认为编码是坏的，否则上述方法必须有效。我建议像 -

那样进行Base64编码

Base64.encode(FileUtils.readFileToByteArray(file));

Answer 2

这不是您从文件中读取字节的方式：

byte[] bytes=ImageIO.read(in).toString().getBytes();

ImageIO.read返回BufferedImage。 BufferedImage的toString（）方法不返回图像的字节，实际上它不能，因为Java字符串不是字节容器。它们包含字符，而不是字节。假设String包含字节将导致字节损坏;具体来说，String.getBytes（）encodes使用字符集编码转换的String的代码点。

你根本不应该使用ImageIO。你没有做任何与数据有关的图像;你只想要字节：

byte[] bytes = Files.readAllBytes(Paths.get("D:/resources/Australia.jpg"));

此外，由于String不是字节的安全容器，因此请勿使用new String(Base64.encode(bytes), "UTF-8")。这个将破坏你的一些字节。创建Base 64编码字符串的正确方法是使用encodeToString方法：

String encodedfile = Base64.getEncoder().encodeToString(bytes);

Answer 3

尝试使用

<img [src]="countryImageNew" class="img1">

将src括在括号中会告诉Angular将值替换为变量值。否则，文字字符串＆＃39; countryImageNew＆＃39;被设置为源，而不是变量的值。

Answer 4

使用

<img ng-attr-src="{{countryImageNew}}" class="img1">

或者

<img ng-src="{{countryImageNew}}" class="img1">

我无法显示基本的64位编码图像？

4 个答案: