1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > 后台将图片以base64形式传给前台 前台展示

后台将图片以base64形式传给前台 前台展示

时间:2021-07-20 06:24:45

相关推荐

后台将图片以base64形式传给前台 前台展示

图片以base64形式在页面上展示出来

在这里要说到Data URI scheme,它可以直接将一些小的数据直接嵌入到网页中,不需要再引入。支持格式如下

data:, 文本数据

data:text/plain, 文本数据

data:text/html, HTML代码

data:text/html;base64, base64编码的HTML代码

data:text/css, CSS代码

data:text/css;base64, base64编码的CSS代码

data:text/javascript, Javascript代码

data:text/javascript;base64, base64编码的Javascript代码

data:image/gif;base64, base64编码的gif图片数据

data:image/png;base64, base64编码的png图片数据

data:image/jpeg;base64, base64编码的jpeg图片数据

data:image/x-icon;base64, base64编码的icon图片数据

所以此时只要是将base64格式的图片赋值给图片的src属性即可。

<img src= "data:image/png;base64,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">

在页面上展示为

如果想展示为jpg格式,前面变为data:image/jpeg;base64,即可。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。