Data URI scheme:data:image/jpeg;

  今天在用一个croppic的jQuery裁剪图片的插件的时候,发如今后台获取图片时,没法经过Request.File获取了,可是经过Request.Form[]能够。用firebug跟了一下发现,图片传输的数据不是一个文件流的形式进行提交的,而是一个表单元素,以下图所示:javascript

  

 通过一番度娘后,学习了新知识,原来是浏览器经过Data URI scheme 把图片利用base64编码把图片数据翻译成标准的ASCII字符。php

 在上面的Data URI中,data表示取得数据的协定名称,image/png 是数据类型名称,base64 是数据的编码方法,逗号后面就是这个image/png文件base64编码后的数据。css

 不仅是数据的提交,在数据的渲染时候,也能够这么用:<img src="data:image/jpg;base64,iVBORw0KGgo"/>等效于:<img src="http://www.oschina.net/img/logo_s2.png"/>html

 优势:Data URL是在本地直接绘制图片,不是从服务器加载,因此节省了一个HTTP 请求,起到加速网页的做用。
java

 缺点:适合于小图片,由于用这种方式会增长网页的大小,因此文件太大了不合适,另外IE8如下浏览器不支持这种方法。用这种方法会加剧客户端的CPU和内存负担,由于浏览器不会缓存这种图像
浏览器

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

 附加:asp.net后台程序如何获取这种编码而且保存成文件呢?缓存

  

  而后SaveAs一下就OK了。服务器

  学习地址:http://www.jb51.net/css/41981.html http://www.cnblogs.com/xcsn/p/4677373.html  https://www.lvtao.net/dev/php-image-data-url.html asp.net

相关文章
相关标签/搜索