本文链接:https://blog.csdn.net/kukudehui/article/details/80409522
在做项目的时候,我从后端返回了一个base64格式的图片文件,想把它渲染在前端页面上,找了一下午都没有找到办法,最后终于找到了资料!哈哈!

解决办法就是这样

后来又找了相关用法,总结如下:

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图片数据

但是这种方法不兼容IE6/7,使用时要注意!

前端 img标签显示 base64格式的 图片的更多相关文章

  1. base64格式的图片数据如何转成图片

    base64格式的图片数据如何转成图片 一.总结 一句话总结:不仅要去掉前面的格式串,还需要base64_decode()解码才行. // $base_img是获取到前端传递的值 $base_img ...

  2. 上传base64格式的图片到服务器

    上传base64格式的图片到服务器 /**bash64上传图片 * @param $base64 图片的base64数据 * @param $path 保存路径 */ function base64_ ...

  3. base64格式的图片上传阿里云

    base64格式的图片上传阿里云 上传图片的时候,除了普通的图片上传,还有一张图片信息是以base64格式发送到后台的. 后台接受base64格式的图片,上传至阿里云代码:(主要是将base64转化成 ...

  4. php base64格式的图片字符串和图片文件相互转换的代码

    在移动端上传图片的时候通常会将图片转换成base64格式的字符串提交,所以此时需要使用服务器端的程序进行转换成二进制的数据.如下PHP代码实现了图片文件和base64格式的图片字符串相互转换的方法,同 ...

  5. C# WEB.API 接收并解析保存base64格式的图片

    using System; using System.Collections.Generic; using System.Drawing; using System.IO; using System. ...

  6. 如何把base64格式的图片上传到到阿里云oss c#版

    今天碰到需要把canvas上的的图片转存到阿里云oss,于是百度了半天,一个能打的答案都没有.怒了,自己搞起. 代码超级简单,需要先引入nuget 中啊里云的oss api 1 byte[] arr ...

  7. base64格式的图片如何上传到oss

    ---恢复内容开始--- 对于base64图片的上传这个东西,一直是一个问题尤其是上传到oss.我们这次开发由于需要修剪图片,使用了h5的很多新特性. h5修剪图片,使用了我们的canvas.这个步骤 ...

  8. js下载base64格式的图片(兼容火狐)

    //下载图片 download() { let imgData = 'data:image/png;base64,iVBORw0KGgoAAAANSUh........'; this.download ...

  9. <img>标签显示本地路径的图片的.NET解决方案

    今天朋友问了我一个奇怪的需求:项目中要求图片上传到工作目录,上传后要在网页中通过<img>显示出来.图片上传后显示,在开发中常见的做法是将它图片上传到网站目录下(upload/),如果保存 ...

随机推荐

  1. python面试总结2(函数常考题和异常处理)

    python函数常考题 可变类型为参数 不能类型为参数 python如何传递参数 传递值还是引用呢?都不是.唯一支持的参数传递是共享穿参 Call by Object(Call by Object R ...

  2. Android Exception Hook

    承接上一篇文章Android Inline Hook,接下来我们看一下android系统中基于异常的hook方式,这种方式与inline hook相比实现较为简单,但执行效率是它的短板. except ...

  3. 【HICP Gauss】数据库 数据库高级语法(数据类型函数)-3

    SQL高级语法:整型:   integer 2(-31) ~2(31)-1 4字节 intger unsigned 2(0)~2(32)-1 4字节 bigint 2(-63)~2(63)-1 8字节 ...

  4. IDRAC 固件升级操:

    Internal Use - Confidential IDRAC 固件升级操作: R630:https://downloads.dell.com/FOLDER05590166M/1/iDRAC-wi ...

  5. MySQL JOIN原理(转)

    先看一下实验的两张表: 表comments,总行数28856 表comments_for,总行数57,comments_id是有索引的,ID列为主键. 以上两张表是我们测试的基础,然后看一下索引,co ...

  6. jenkins+ant+jmeter接口自动化的持续集成

    一.jmeter.jenkins安装 这里不再说明,请看上一个随笔!!! 链接:https://www.cnblogs.com/magicYJ/p/11839646.html 二.ant安装 下载地址 ...

  7. Keras神经网络data generators解决数据内存

    在使用kears训练model的时候,一般会将所有的训练数据加载到内存中,然后喂给网络,但当内存有限,且数据量过大时,此方法则不再可用.此博客,将介绍如何在多核(多线程)上实时的生成数据,并立即的送入 ...

  8. SQL SERVER使用 CROSS APPLY 与 OUTER APPLY 连接查询

    概述 CROSS APPLY 与 OUTER APPLY 可以做到:      左表一条关联右表多条记录时,我需要控制右表的某一条或多条记录跟左表匹配的情况. 有两张表:Student(学生表)和 S ...

  9. IDEA 中tomcat图片储存和访问虚拟路径(图片和程序分家)

    本文链接:https://blog.csdn.net/qq_36481052/article/details/78813213 **前段时间,遇到了图片已经储存了文件中也显示有图片,但就是死活访问不到 ...

  10. MongoDB dataSize如何比storageSize更大?

      原文   https://stackoverflow.com/questions/34054780/how-can-mongodb-datasize-be-larger-than-storages ...