使用data:uri上传图片】的更多相关文章

上传图片的方式有两种,一种是使用传统的html控件的方式,设置form属性为multipart/form-data.这种方式兼容ie6,ie7.另一种方式是使用data:uri,将base64编码从浏览器端post到服务器端,然后利用Base64解码即可.这种方式只是用与比较modern的浏览器,比如ie9,chrome,firefox,safari.本文主要讲讲我们如何利用data:uri的方式上传图片的. Data URI 格式  data URI的格式非常简单,具体可以看RFC2397,d…
Data URL 早在 1995 年就被提出,那个时候有很多个版本的 Data URL Schema 定义陆续出现在 VRML 之中,随后不久,其中的一个版本被提上了议案——将它做个一个嵌入式的资源放置在 HTML 语言之中.从 RFC 文档定稿的时间来看(1998年),它是一个很受欢迎的发明. Data URIs 定义的内容可以作为小文件被插入到其他文档之中.URI 是 uniform resource identifier 的缩写,它定义了接受内容的协议以及附带的相关内容,如果附带的相关内容…
一.前言 上周五公司内部的Any Topic Conf.上我和同事们分享了这个主题,有同事说这个有用,有同事说这个没啥用,后来还延伸到网站性能的话题上,大家讨论的激烈程度让我觉得这次选题还不错.本篇先不管到底有用与否,仅仅记录理论知识.也希望大家一起来分享实战经验啊! 二.从HTTP URI Scheme入手 对于 <a href="http://github.com">HTTP URI Scheme</a> 我想大家都应该很熟悉了,href属性值http://…
Data URI scheme 在前端开发中是个常用的技术,通常会在 CSS 设置背景图中用到.比如在 Google 的首页就有用到: Data URI scheme 简称 Data URI,经常会被错误地写成 data URLs.笔者认为通常用于将图片 base64 编码的 Data URI 可以称为 data URLs,理由是这个地址(通过 base64 编码的 URL)可以在浏览器地址栏打开,而且 chrome 面板下也用了 "data URLs" 这个名称,但是广义的 Data…
一.php://input一句话木马 在调研dedecms的历史漏洞时,发现了dedecms安装文件曾经出过被植入后门的漏洞(SSV-ID站点include目录下shopcar.class.php文件被植入一句话木马) @eval(file_get_contents('php://input')) 我是个十足的php菜鸟,只有用到的时候才会去查查语法书,对php://input也只是有点印象而已,于是用脚本phpinput.php,配合firefox Hackbar插件测试了一下php://in…
参考资料:http://www.cnblogs.com/hustskyking/p/data-uri.html 与http,ftp等协议类似,data URL也是一种协议,不同的是它直接将数据(编码或未经编码的)作为URI的一部分. 其格式为: data:[<mime type>][;charset=<charset>][;base64],<encoded data> 其中, data 是协议头,表明这个<encoded data>内容为一个data URI…
网页优化的一大首要任务是减少HTTP 请求 (http request) 的次数,例如通过合并多个JS文件,合并CSS样式文件.除此之外,还有一个data URL 的密技,让我们直接把图像的内容崁入网页里面,这个密技的官方名称是 data URI scheme. Goolge Wave 中CSS定义的图片URL全部是 data URI scheme!那什么是 data URI scheme? 假设你有以下的图像: A把它在网页上显示出来的标准方法是: <img src="http://sj…
优化网页效能,首要的任务是尽量减少HTTP请求(http request)的次数,例如把多个JavaScript文档合并,多个CSS文件合并等等.此外,还有有一种 data URL 的方法,可以直接把图像的内容嵌入到网页里面,官方名称是 data URI scheme. 什么是 data URI scheme? 假设你有一个图像,把它在网页上显示出来的标准方法是: <img src="http://www.hkpug.net/files/images/check.png"/>…
前言(废话):鼓捣 Stylish 的时候发现了这么个奇怪的代码行: Data:image/gif;BASE64,R0lGODlhEAAQAKEAAEKF9NPi/AAAAAAAACH5BAEAAAIALAAAAAAQABAAAAIkFI6Zpu0YYnxnAvtC0hTzzH3UJY6kSUqdiCltu7GjBKMKgwoFADs= 由于自己有点 HTML/CSS 基础,看得出来这是在引用图片,可是后面这么长一串乱码难道就是图片地址吗?经过漫长的查询(突破点是 BASE64,我记得这是种加密…
日期:2013-7-6  来源:GBin1.com 提升页面大小的效率,不仅仅是取决于使用精灵或是压缩代码,给定页面的请求数量在前端性能中也占有了很不小的重量.减少请求可以让你的网站加载更快,而其中一种减少页面请求的方法就是用Data URI代替图片的src属性: <!-- 以前的写法 --> <img src="http://images.cnblogs.com/logo.png" /> <!-- 使用data URI的写法 --> <img…
组件的intent-filter属性         如果一个 Intent 请求在一片数据(Uri)上执行一个动作(Action), Android 如何知道哪个应用程序的哪个组件能用来响应这个请求呢?         Intent Filter 就是用来注册 Activity .Service 和 Broadcast Receiver 具有能在某种数据上执行某种动作的能力.         使用 intent-filter 指定action.data等属性后,应用程序组件就会告诉 Andro…
data URI scheme通俗的来讲就是将一张图片直接塞到HTML中而不是通过HTTP请求去获取.这样从表面上看会降低一次HTTP的请求,实现了对于网页的优化(只是看了其它一些文章data URI由于将图片採用了base 64的编码方式进行表达.所以还是须要进行HTTP去下载内容,并且这种渲染方式同一时候也加大了内存.cpu等等的压力,因此选择的时候须要进行性能方面的权衡). 比方一张图片用http请求方式进行请求而且显示的方法: <img src="http://sjolzy.cn/…
Data URL 早在 1995 年就被提出,那个时候有很多个版本的 Data URL Schema 定义陆续出现在 VRML 之中,随后不久,其中的一个版本被提上了议案——将它做个一个嵌入式的资源放置在 HTML 语言之中.从 RFC 文档定稿的时间来看(1998年),它是一个很受欢迎的发明. Data URIs 定义的内容可以作为小文件被插入到其他文档之中.URI 是 uniform resource identifier 的缩写,它定义了接受内容的协议以及附带的相关内容,如果附带的相关内容…
现如今,网民的网络账户被盗,很有可能是被“钓鱼”了.去年的一份安全报告中指出:“近85%的资金损失是通过钓鱼网址泄露支付信息造成的”. 传统的钓鱼网站通常是申请一个和被冒充网站相似的域名,比如 taobao000.com ,或者直接利用三四级域名来冒充,比如 taobao.com.evil.com. 钓鱼网址一般是通过邮件.短信.聊天工具等传输系统发送给目标群体的,于是这些传输系统的运营商会责无旁贷的采取措施,来尽可能的检测并屏蔽那些钓鱼网址,而且即便它们不做,现代的浏览器也都会做这件事.最常见…
[新增]:http://www.webhek.com/post/data-url.html 引子:在研究FileReader时,有个方法readAsDataURL;然后看到打印出来的东西类似于如下:[data:text/plain;base64,Y29tZSBvbiB0byBidXkgYSBwaWFubyE=],这个东西竟然像个超链接一样可以跳转,在新窗口中显示出文档内容,如果是图片还会显示出图片.于是比较好奇这是如何定位到图片的位置的,原来这串字符并没有定位图片位置,而是将图片的内容直接包含了…
要在服务器端基于HTML,拼接邮件内容,原来用户使用outlook采用了邮件签名,签名里含有公司Logo的图片,Outlook的msg文件里是专有的cid:xxxx,这里借用Data URI scheme,把图片嵌入HTML片段里. http://www.cnblogs.com/XL-Liang/archive/2012/06/01/2530509.html http://www.atool.org/img2base64.php…
转载一篇大神的文章 大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAAeAAD/7gAOQWRvYmUAZMAA= //这是随便写的,不要访问 什么是DATA URI Scheme呢? 其实就是形如data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAA…
在项目css中或者图片展示中: url(data:image/png;base64,iVBORw0KGgoAAA 在RFC2397中定义的Data URI scheme,目的是将一些小的数据,直接嵌入到网页中,从而不用再从外部文件载入 优点: 减少HTTP请求数,没有了TCP连接消耗和同一域名下浏览器的并发数限制. 对于小文件会降低带宽.虽然编码后数据量会增加,但是却减少了http头,当http头的数据量大于文件编码的增量,那么就会降低带宽. 对于HTTPS站点,HTTPS和HTTP混用会有安全…
----------------------------------------------------------------------------------------------- Data URI scheme is a URI scheme(统一资源定位符的模式). 我们熟知的站点引用资源文件,都是类似http://www.chenwei.ws/demo.png这种的格式,但是data URI scheme 提供将外部资源嵌入到网页中的方法. 它是一种文件或文档的形式,这项技术允许…
Data URL给了我们一种很巧妙的将图片“嵌入”到HTML中的方法.跟传统的用img标记将服务器上的图片引用到页面中的方式不一样,在Data URL协议中,图片被转换成base64编码的字符串形式,并存储在URL中,冠以mime-type.本文中,我将介绍如何巧妙的使用Data URL优化网站加载速度和执行效率. 观看演示 1. Data URL基本原理 图片在网页中的使用方法通常是下面这种利用img标记的形式: <img src="images/myimage.gif "&g…
一.从HTTP URI Scheme入手 对于 <a href="http://github.com">HTTP URI Scheme</a> 我想大家都应该很熟悉了,href属性值http://github.com就是HTTP URI Scheme,那么什么是DATA URI Scheme呢?其实就是形如data:text/jpeg;base64,XINGSXXIANGJIJIGSAG==的资源链接,一般出现在img元素的src属性. DATA URI Sch…
今天在用一个croppic的jQuery裁剪图片的插件的时候,发现在后台获取图片时,无法通过Request.File获取了,但是通过Request.Form[]可以.用firebug跟了一下发现,图片传输的数据不是一个文件流的形式进行提交的,而是一个表单元素,如下图所示:…
前言 不知道大家有没有电话拨号通过'猫'上网的经历,那时测试网络是否连接,最好的方式就是打开浏览器输入: www.baidu.com 那会管这一连串字母叫' 网址 '.之后上大学(计算机专业),知道了这一串字母还有一个名字' URL '.再后来毕业了,找了个IT工作,有的同事又管它叫' URI '.那么到底这一连串字母叫什么呢?URL和URI有时什么关系呢? 通过StackOverflow看问题,我对它们的关系有了基本的认识.分享给大家: PS:下文均翻译自StackOverflow看到的高票答…
一道关于Data URI Scheme的入门级CTF_Web题 0x00 题目描述 这是偶尔遇到的某网安交流群的入群题,题目没有任何的提示,直接给了一个txt文件. 0x01 解题过程 通过给的这个文件的名字,大致可以猜测和图片有关.我们先打开这个文本文件看看这里面有什么. data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANwAAAAoCAIAAAAaOwPZAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcE…
了解Data URI scheme,首要要掌握一些URI.URL的基本知识,很多做移动端上开发的同学对这两个基本概念掌握的不够,本文首先会对这两个基本概念做一些简单的介绍. 基本概念 <HTTP权威指南>对URI和URL的定义: URI(Uniform Resource Identifier):统一资源标识符,服务器资源名被称为统一资源标识符. URL(Uniform Resource Locator):统一资源定位符,描述了一台特定服务器上某资源的特定位置. URN(Uniform Reso…
mainactivity代码 package com.bwie.webviewupload; import java.io.ByteArrayInputStream; import java.io.ByteArrayOutputStream; import java.io.File; import java.io.FileNotFoundException; import java.io.InputStream; import java.text.SimpleDateFormat; import…
上传图片时,往往需要对图片进行裁剪. 实现方法为: 1.引入crop.css body{background:#}.upload-container{position:absolute;left:%;top:%;margin-left:-57px;margin-top:-57px}.upload-pretty{position:relative;left:;top:;display:block;overflow:hidden}.upload-pretty input{position:absol…
之前写过一篇“漫谈前端优化”的文章,里面提到过DataUrl,粗鲁的描述了下,感觉不甚详焉,所以这几天也总结了这方面的知识,参考一些资料,补充一篇文章在这里,对这方面的资料来说,也是一种强化记忆应用: Data URL给了我们一种很巧妙的将图片“嵌入”到HTML中的方法.跟传统的用img标记将服务器上的图片引用到页面中的方式不一样,在Data URL协议中,图片被转换成base64编码的字符串形式,并存储在URL中,冠以mime-type.本文中,我将介绍如何巧妙的使用Data URL优化网站加…
大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJAQMAAADaX5RTAAAAA3NCSVQICAjb4U/gAAAABlBMVEX///+ZmZmOUEqyAAAAAnRSTlMA/1uRIrUAAAAJcEhZcwAACusAAArrAYKLDVoAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDkvMjAvMTIGkKG+AA…
从网上下了个源文件查看时候发现了引用图片的地址不是在本地上的,而是后面跟了一大串字符data:image/png;base64...查了一下资料分析如下: 关于用base64存储图片 网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如:data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAYAAABIdFAMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHh…