js 对16进制转换byte[],然后进行base64转换成图片显示

开发中遇到一个问题,就是java返回给我一个16进制,让我进行解密后生成图片文件,并展示出来。
java是这样处理的:
1、先读取图片信息,获取byte[]字节流
2、将对应字节流做Base64编码得到编码后的byte[]字节流
3、将做Base64编码产生的字节流转换成16进制的字符串返回给前端
另外 报文传输的是字符串,不是字节流
我们收到的字符串转换成字节流,就是Base64编码的

然后我们前端将他反过来处理即可:
1、将16进制字符串转换byte[]字节流;
2、对转换后的字节流做Base64解码;
3、将解码后的byte[]字节流生成图片

本来浏览器支持直接显示base64字符串,我们只需要直接返回二进制的base64字符串即可。但是怎么要求,我们就怎么做吧。查资料,找别人写的代码,然后最终成功了。下面附上代码。

这是后台返还给我的16进制
这是后台返还给我的16进制数据,然后第一步先转成byte[],

Str2Bytes(str) {
                var pos = 0;
                var len = str.length;
                if(len %2 != 0) {
                    return null;
                }
                len /= 2;
                var hexA = new Array();
                for(var i=0; i<len; i++) {
                    var s = str.substr(pos, 2);
                    var v = parseInt(s, 16);
                    hexA.push(v);
                    pos += 2;
                }
                return hexA;
            }

然后在 将byte数组转字符串:

arrayBufferToBase64( buffer ) {
                var binary = '';
                var bytes = new Uint8Array( buffer );
                var len = bytes.byteLength;
                for (var i = 0; i < len; i++) {
                    binary += String.fromCharCode( bytes[ i ] );
                }
//                return window.btoa( binary );
                return binary;
             },
注释掉的是多做了一步编码,否则图片会不显示。

最后的处理:

                    let s = e.data.imageData // 获取到的16进制数据
                     _this.Str2Bytes (s)
                    let str = _this.arrayBufferToBase64(_this.Str2Bytes (s));//转换字符串
                    let outputImg = document.createElement('img');
                    outputImg.src = 'data:image/png;base64,'+ str;
                    document.body.appendChild(outputImg);

为了尽快看到图片,先这样处理的,将就看一下吧- -
最终的图片:
在这里插入图片描述

在这里插入图片描述

结束。

  • 5
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
好的,对于您的问题,我可以为您提供一些参考。 在Java中将二进制数据转换Base64编码的字符串可以使用Java提供的Base64类。该类提供了对Base64编码和解码的支持。 以下是将二进制数据转换Base64编码的字符串的示例代码: ```java import java.util.Base64; public class BinaryToBase64 { public static void main(String[] args) { // 读取二进制图片文件 byte[] imageBytes = readImageFile(); // 将二进制数据转换Base64编码 String base64Image = Base64.getEncoder().encodeToString(imageBytes); // 打印Base64编码 System.out.println(base64Image); } private static byte[] readImageFile() { // 读取二进制图片文件的代码 // ... } } ``` 如果您想将Base64编码的字符串转换回二进制数据并保存为图片文件,可以使用以下示例代码: ```java import java.util.Base64; import java.io.FileOutputStream; import java.io.IOException; public class Base64ToBinary { public static void main(String[] args) { // 读取Base64编码字符串 String base64Image = readBase64Image(); // 将Base64编码字符串转换为二进制数据 byte[] imageBytes = Base64.getDecoder().decode(base64Image); // 将二进制数据保存为图片文件 saveImageFile(imageBytes); } private static String readBase64Image() { // 读取Base64编码字符串的代码 // ... } private static void saveImageFile(byte[] imageBytes) { try { FileOutputStream fos = new FileOutputStream("image.jpg"); fos.write(imageBytes); fos.close(); } catch (IOException e) { e.printStackTrace(); } } } ``` 希望这些代码片段对您有所帮助!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值