后端通过 websocket 推送来了图片的二进制流，该如何显示在 img 标签上

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

这是一个创建于 2268 天前的主题，其中的信息可能已经有所发展或是发生改变。

后端通过 websocket 推送来了图片的二进制流，该如何显示在相应 img 标签上？是用 base64 编码，但我觉得浏览器解析的时候不也得转化为二进制么，这不就有损耗了？如何才是正确的方式呢？还有，如果这张图片很大，用 websocket 直接转化为二进制推送，会不会有问题呢

7 条回复 • 2018-02-09 16:40:23 +08:00

ArthurKing

2018-02-09 11:20:41 +08:00

推送你给一个 url，然后动态加载不行吗

yejinmo

2018-02-09 11:22:05 +08:00

base64 咋了。。你二进制还是需要转化啊

fyp0414

2018-02-09 11:23:00 +08:00

img 可以用 base64

<img src=“ data:image/png;base64,fggdsSAFSDFwer...

lzvezr

2018-02-09 11:54:02 +08:00

img 也可以用 blob
img.src = URL.createObjectURL(blob)

ZiLong

2018-02-09 16:19:09 +08:00

@ArthurKing 能直接推送内容当然更好，改 url，多一个请求应答的消耗，没必要

ZiLong

2018-02-09 16:38:16 +08:00

@yejinmo 不太懂，我以为二进制可以直接展示
@fyp0414 现在还有个问题是，我每隔 50ms，修改 img 的 src 属性指向另一张 image，画面直接卡那不动，并没有切换，这有什么好的解决方案

ZiLong

2018-02-09 16:40:23 +08:00

@lzvezr 现在确实是这样做的