Data Uri Schema的使用
2012-05-07 12:43
323 查看
最近看了下关于Data Uri的资料.前一篇是我转载的维基百科的内容.这篇主要讲使用.
Data URI Schema的利弊
如前文所讲.Data Uri主要是为了减少Http连接.如
<img src="http://www.google.com/logo.png"/>
替换成
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA
7ljmRAAAAGElEQVQIW2P4DwcMDAxAfBvMAhEQMYgcACEHG8ELxtbPAAAAAElFTkSuQmCC" />
将负载由网络传输转移客户端.
客户端在解析网页时需要更多的时间去解码.同时如果该图被多次使用,那它将多次被解析,即浏览器不会对它做缓存.当然简单的解决办法是写到css中.
例如:
.logobg {
background: url(data:…)
}
<div class=”navigation logobg”>..
helo, hello
<div class=”footer logobg”>…
<Data URI的利弊>里面提供了例子展示了当调用单个和多个图片时,普通的连接与data uri在性能上的差异.
当然Data URI还有一个弊端.那就是IE对它不支持.
Data URI Schema在XSS中的应用
另外它也可以解决js injection被屏蔽的问题...
例如:
<iframe src="data:text/html;base64,PHNjcmlwdD5hbGVydCgxKTwvc2NyaXB0Pg=="></iframe>
该相关内容可以见<XSS with Data URI Scheme>.内容详细介绍了data uri在xss中的使用,以及各浏览器之间的区别.
例子
在<data: URL tests>中提供了一系列对Data URI 的例子.可以作为平常的参考.
Data URI Schema的利弊
如前文所讲.Data Uri主要是为了减少Http连接.如
<img src="http://www.google.com/logo.png"/>
替换成
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA
7ljmRAAAAGElEQVQIW2P4DwcMDAxAfBvMAhEQMYgcACEHG8ELxtbPAAAAAElFTkSuQmCC" />
将负载由网络传输转移客户端.
客户端在解析网页时需要更多的时间去解码.同时如果该图被多次使用,那它将多次被解析,即浏览器不会对它做缓存.当然简单的解决办法是写到css中.
例如:
.logobg {
background: url(data:…)
}
<div class=”navigation logobg”>..
helo, hello
<div class=”footer logobg”>…
<Data URI的利弊>里面提供了例子展示了当调用单个和多个图片时,普通的连接与data uri在性能上的差异.
当然Data URI还有一个弊端.那就是IE对它不支持.
Data URI Schema在XSS中的应用
另外它也可以解决js injection被屏蔽的问题...
例如:
<iframe src="data:text/html;base64,PHNjcmlwdD5hbGVydCgxKTwvc2NyaXB0Pg=="></iframe>
该相关内容可以见<XSS with Data URI Scheme>.内容详细介绍了data uri在xss中的使用,以及各浏览器之间的区别.
例子
在<data: URL tests>中提供了一系列对Data URI 的例子.可以作为平常的参考.
相关文章推荐
- 使用Apache xercesc验证XML文件的Schema
- Hibernate整合Spring后,如何使用SchemaExport生成数据库表
- Hibernate5.x 使用SchemaExport生成数据表
- NHibernate之旅(20):再探SchemaExport工具使用
- Atitit. 数据库-----catalog与schema的设计区别以及在实际中使用 获取数据库所有库表 java jdbc php c#.Net
- SQL Server:在Service Broker中使用Schema Collection验证消息
- 使用 SchemaExport 自动建表
- php://input,php://filter,data URI schema的那些事
- 什么是data URI scheme及如何使用data URI scheme
- NHibernate之旅(19):初探SchemaExport工具使用
- JAVA中使用Schema校验XML
- DBMS_STATS.GATHER_SCHEMA_STATS介绍使用
- MySQL自带information_schema数据库使用
- JAVA中使用Schema校验XML
- 数据库中INFORMATION_SCHEMA的说明及使用
- 使用ArcSDE10软件创建ArcSDE9 Schema的服务是否可行
- Spring 4.X 使用@AspectJ和Schema 报错
- 使用schema校验xml
- Atitit. 数据库-----catalog与schema的设计区别以及在实际中使用 获取数据库所有库表 java jdbc php c#.Net
- CakePHP中使用MemCache缓存数据库Schema