大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如:data:image/png;base64, iVBORw0KGgoAAAANSUhEUgnZVJlYWR5ccllPAAAAHhJREFUeNo8zjsOxCAMBFB/KEAUFFR0Cbng3nQPw68ArZdAlOZppPFIBhH5EAB8b+Tlt9MYQ6i1BuqFaq1CKSVcxZ2Acs6406KUgpt5/KuVgz5BDCSZO99ZOdcZGvt4mJjzMVKqcha68iIePB86GAiOv8CDADlIUQBs7MD3wAAAABJRU5ErkJggg%3D%3D。那么这是什么呢?这是Data URI scheme。
  Data URI scheme是在RFC2397中定义的,目的是将一些小的数据,直接嵌入到网页中,从而不用再从外部文件载入。比如上面那串字符,其实是一张小图片,将这些字符复制黏贴到火狐的地址栏中并转到,就能看到它了,一张1X36的白灰png图片。
  在上面的Data URI中,data表示取得数据的协定名称,image/png 是数据类型名称,base64 是数据的编码方法,逗号后面就是这个image/png文件base64编码后的数据。

string result = Convert.ToBase64String(bytes);         //

byte[] bs= Convert.FromBase64String(string)   string转字节数组

fileData.ImageFile=string.Format("data:{0};base64,{1}", file.ContentType, fileData.File);  
   目前,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简单地说,它把一些 8-bit 数据翻译成标准 ASCII 字符,网上有很多免费的base64 编码和解码的工具,在PHP中可以用函数base64_encode() 进行编码,如echo base64_encode(file_get_contents(‘wg.png’));
目前,IE8、Firfox、Chrome、Opera浏览器都支持这种小文件嵌入。

举个图片的例子:

网页中一张图片可以这样显示:

<img src=“http://www.letuknowit.com/images/wg.png”/>
也可以这样显示:
<img src=“data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAYAAABIdFAMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHhJREFUeNo8zjsOxCAMBFB/KEAUFFR0Cbng3nQPw68ArZdAlOZppPFIBhH5EAB8b+Tlt9MYQ6i1BuqFaq1CKSVcxZ2Acs6406KUgpt5/LCKuVgz5BDCSb13ZO99ZOdcZGvt4mJjzMVKqcha68iIePB86GAiOv8CDADlIUQBs7MD3wAAAABJRU5ErkJggg%3D%3D”/>

  我们把图像文件的内容直接写在了HTML 文件中,这样做的好处是,节省了一个HTTP 请求。坏处呢,就是浏览器不会缓存这种图像。大家可以根据实际情况进行自由取舍。

转载于:https://www.cnblogs.com/DSC1991/p/9007127.html

src或者href值为base64编码代码相关推荐

  1. 支持中文的BASE64编码代码

    网上找的大多数不支持中文编码 下面的是可以支持中文的 #include <string.h> #include <stdio.h> #include "base64. ...

  2. 将base64编码图片上传到七牛云

    将base64编码图片上传到七牛云 接口说明 FAQ >对象存储 >上传下载> 如何上传base64编码图片到七牛云 在七牛云FAQ上有一篇文章,讲解的接口的使用 https://d ...

  3. php和js中,utf-8编码转成base64编码

    1.php下转化base64编码 php中,文本文件的编码决定了程序变量的编码,比如以下代码在不同编码的php文件中,展示的效果也是不一样的 <?php$word = '严';echo base ...

  4. base64编码_几分钟看懂Base64编码原理

    Base64简介 Base64是基于64个可打印字符(小写字母a-z,大写字母A-Z,数字0-9,符号"+","/" 再加上作为垫字的"=" ...

  5. 一文带你读懂base64编码

    hi,大家好,我是开发者FTD.相信很多同学在工作中,经常会用到Base64编码,那大家知道为什么会有Base64编码吗?我们为什么要使用它呢,它又是怎么实现的呢?下面就让我们来一起深入探究一下Bas ...

  6. 【Java】Base64编码与解码

    1.概述 转载:http://www.ruanyifeng.com/blog/2008/06/base64.html 1.1. 昨天的<MIME笔记>中提到,MIME主要使用两种编码转换方 ...

  7. Unicode编码和Base64编码

    Unicode JavaScript 定义了 6 个全局方法用于 Unicode 字符串的编码和解码,说明如表所示. 方法 说明 escape() 使用转义序列替换某些字符来对字符串进行编码 unes ...

  8. 密码学-编码算法:Base64编码原理和使用

    1.Base64简介 Base64是网络上最常见的用于传输8Bit字节码的编码方式之一,Base64就是一种基于64个可打印字符来表示二进制数据的方法.Base64编码是从二进制到字符的过程,可用于在 ...

  9. base64编码,原理是什么,有什么作用?

    base64到底是什么东西呢? Base64编码是网络上常见的用于传输8bit字节数据的一种编码方式之一 , 有些人和书本会将编码写成加密算法,这其实是欠妥的.因为任何人拿到编码后的数据都能转化成原始 ...

最新文章

  1. python读取时间_python 获取时间
  2. 深度探索C++ 对象模型(4)-Default Copy Constructor(4)
  3. c++ include 路径_程序员应如何理解include
  4. POJ1358 Agri-Net
  5. DAY12 生成器初始与列表生成式
  6. cocos2d-x游戏开发(十五)游戏加载动画loading界面
  7. Hive报错:Exception in thread main java.lang.Incom。。。。 Class com.google.common.collect.ImmutableSotil
  8. UDP和TCP协议包大小的计算-转
  9. [Vue.js] 基础 -- Vue实例
  10. Python爬虫_乱码、转码
  11. ssh mysql环境搭建_Ubuntu下JDK+Tomcat+MySql环境的搭建
  12. Java Interview Questions (1)
  13. c 语言文本文件判断是否到达结尾的问题
  14. hdu 1907 John (Nim变形)
  15. 服务器虚拟机要怎么安装,服务器虚拟机怎么安装
  16. Excel VBA高级编程-股票大盘跟踪
  17. python批量自动填写网页表单_Python爬虫自动填写调查表
  18. 规格说明书练习-吉林市1日游
  19. linux--常用命令
  20. 由于无法验证发布者 所以windows阻止此软件

热门文章

  1. mysql实验的好处_用好UniProt 数据库,蛋白实验不用愁
  2. java excel 导出_java导出Excel通用方法实例
  3. debain apt oracle jdk,debian安装oracle jdk
  4. centos7arm进入图形化_CentOS 7 安装图形化界面
  5. 学考语言成绩c对高考有影响吗_学考成绩会影响高考录取吗?2021年广东高中学考...
  6. Json解析不允许子类父类变量重名的原因
  7. 使用GAN 进行异常检测——anoGAN,TODO,待用于安全分析实验
  8. ES批量索引写入时的ID自动生成算法
  9. numpy matplotlib 柱状图
  10. 查看安卓keystore别名