标签:chrome

浏览模式: 标准 | 列表 | 图文
迁移浏览器至Chrome

迁移浏览器至Chrome

说实话,这是一个艰难的决定,但,好象也是不得已,原来firefox给我最好用的地方就是F12,你懂的。

FireCookie这个小功能对我来说也是非常的需要,Sync功能更是不得了啊。我的speeldial上的信息,就靠他来配置了,然而,现在多了一个功能,就是要验证,不小心点击了一下重新生成验证码,没仔细看说明,原来生新生成验证码的时候,全清空所有保存的数据。于是乎,我所有保存的密码,都不见了。

幸好,我之前使用了一下google的导入firefox所有数据的功能,也包括了密码。(但是我在设置里查看已保存的密码时,都为空,所以我一直以为失败了)

在使用google帐户登录后,我打开一个常 见网站,我震精的事情发生了,居然,居然,用户名密码帮我输好了,心里一下子淡定了很多。

至此,firefox我真的再也没有什么特别让我留恋的了。cmd+shift+i也能实现F12的功能,只是不能修改cookie不太爽,还有fildder2好象也没有,不过,这又怎么样呢?从另外个角度来说,chrome的插件更容易开发,firefox还得考虑这考虑那。

于是,就真的换成了chrome,速度确实快了不少,内存倒是没省多少。够 快,OK了。

IE中的URL最大长度限制

IE中的URL最大长度限制

今天又遇到了这个问题,以前其实是知道的。IE下的cookie长度和firefox下不一样。GET的长度也不样。
但我在记忆中一直是当成4096来处理的。看来我脑子里想的更多的都是firefox或者chrome,今天遇到某些信息不能显示的时候,又想起这个问题。才发现:
原文:http://blog.csdn.net/tuwen/article/details/5257154

看见很多朋友讨论浏览器最大URL长度限制的问题。其实实际中URL长度限制是由2方面决定的。1 客户浏览器 2 接受服务请求的服务器端的设置。对于大多数用户来说,他们使用的浏览器是IE浏览器,IE的最大URL长度限制是2083字节,而实际可以使用的最大长度 为2048字节。

以下是微软方面的技术资料及翻译:
Maximum URL length is 2,083 characters in Internet Explorer
在IE中URL最大长度是2083字节
SUMMARY
摘要
Microsoft Internet Explorer has a maximum uniform resource locator (URL) length of 2,083 characters.
微软 Internet Explorer 限制最大统 一资源定位器 (URL) 长度为2083字节。
Internet Explorer also has a maximum path length of 2,048 characters. This limit applies to both POST
request and GET request URLs.
Internet Explorer 对最大请求路径长度也进行了限制,限制长度为2048字节。这个限制对 POST 请求和 GET 请求的URL均适用。
If you are using the GET method, you are limited to a maximum of 2,048 characters, minus the number of characters in the actual path.
如果您使用GET方法,您将受到最大2048字节的长度限制,减去实际路径中的字符数。
(注:实际可以使用的字符串长度=2048-请求页面路径字符长度)
However, the POST method is not limited by the size of the URL for submitting name/value pairs. These pairs are transferred in the header and not in the URL.
但是, POST 方法提交名称 / 值对不受 URL 长度的大小的限制。 因为这些名 / 值对是在请求中的header部分传输的,而不在URL中。
RFC 2616, "Hypertext Transfer Protocol -- HTTP/1.1," does not specify any requirement for URL length.
RFC 2616、 " 超文本传输协议 -- HTTP /1.1, " 未指定任何对 URL 长度要求。
由此文大家可以知道,实际在IE中可以使用的最大URL长度是2048字节减去您请求页面的路径长度。另外这个长度还受到服务端相应软件的限制。

--------------------
关于cookie,可以看一下:
Cookie常识
“同名Cookie”的分析
cookie,又见cookie

Firefox4来袭

Firefox4来袭

Firefox4如期来袭,你们准备好了吗?IE9,你在哪里?chrome 100你在哪里(没打错哦,chrome的版本升的太快了。。。)?Safari6?opera 11?

好了不多说了,今天上午就有传闻是FTP中可以下载了,早期还是有人可以下载得到的,但后来的人打开时都显示550 permisson denied。如今到了晚上,终于正式放出来了。

FF4给大家带来了什么 ?更小的内存占用?更漂亮的UI界面?还是更快的速度?估计大家都在折腾了,但是对我来说,大量的插件还没有升级上去,是让我们非常痛苦的事情。
好吧,不说废话了,去下载吧:http://www.mozilla.com/en-US/firefox/new/

顺便:FF可以直接点check for update就可以升级了啦。无需单独下载

又是swfupload惹的祸

swfupload这个控件,只要是涉及到多文件上传、大文件上传,那么就几乎应该是听过这个控件的名称的。

确实,它解决了不少问题,就象我所提到的多文件上传、大文件上传,但也有很多问题存在,从最早的版本到现在,经历了很多问题的改变。。

1、最早的那个SESSION问题。IE和FF的swf下session传递会不一致。这个问题我在09年就遇到过了,记录在[2009-03-09] - 备忘:swfUpload注意事项 。这个问题最初官方的DEMO里并没有提到,在后来的版本里才有涉及。。。现在DEMO里已经有了

2、我用的uploadify这个封装的插件,如果URL路径中含有“//”,在这个时候,如果JS中的路径是相对路径,比如“../../js/xxx.swf”之类的引用,那么,在上传的时候就会出现security error。这件事情我记录在[2011-01-21] - 开发笔记记录 。

3、就是今天遇到的问题,在chrome下面上传的时候出现http error。bobby查了一下资料,发现问题和2中的有点相似,2的问题是采用相对路径的时候,路径中不能有“//”,但chrome下则是,不能有相对路径,当把JS中指向swf的路径換成URL可以访问的路径后,OK一切正常【firefox全部正常】

4、不知道是uploadify封装的有问题还是什么 ,在某些IE下就是不正常。比如我win7 IE8,上传图标不显示,但有的同事就显示了。几样的win7 , IE8(也可能是因为我是64位的??),但某位朋友在xp IE下也不能显示,郁闷了。。准备換到YUI自带的uploader上看看

好吧,就记录这么多了。。。

用谷歌浏览器来当手机模拟器

用谷歌浏览器来当手机模拟器

张宴在自己的博客里写着用《用谷歌浏览器来当手机模拟器》,看完后发现是模拟了User-Agent,这个其实在很早以前大家就都玩过类似的功能,只是,我们没有系统的拿出来说而已。

果然,光会用是没用的,还得会写会说。比如当QQ微博刚出来的时候,大家就在考虑怎么着能够发图片,于是乎opera模拟user-agent出来了,Firefox等的模拟也出来了。但这种技巧也就仅仅流传在微博上,而没有上升到文字的高度,可是,张宴他集中出来了。

---start

  很多网站都通过User-Agent来判断浏览器类型,如果是3G手机,显示手机页面内容,如果是普通浏览器,显示普通网页内容。

谷歌Chrome浏览器,可以很方便地用来当3G手机模拟器。在Windows的【开始】-->【运行】中输入以下命令,启动谷歌浏览器,即可模拟相应手机的浏览器去访问3G手机网页:

谷歌Android:

chrome.exe --user-agent="Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/FRF91) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1"
苹果iPhone:
chrome.exe --user-agent="Mozilla/5.0 (iPad; U; CPU OS 3_2_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B500 Safari/531.21.10"
诺基亚N97:
chrome.exe --user-agent="Mozilla/5.0 (SymbianOS/9.4; Series60/5.0 NokiaN97-1/20.0.019; Profile/MIDP-2.1 Configuration/CLDC-1.1) AppleWebKit/525 (KHTML, like Gecko) BrowserNG/7.1.18124"

试一试,分别用Android、iPhone、诺基亚访问http://www.163.com/、http://blog.s135.com/、http://www.google.com.hk/、http://3g.qq.com、http://t.sina.cn这些3G手机网页,看看有什么不同。

更多款手机的User-Agent:http://www.zytrax.com/tech/web/mobile_ids.html

----EOF--

以上功能对于我们firefox用户来说就没辙了,但并不是不可以使用,比如我们有一个很强大的addon,那就是:Nightly Tester Tools。这个工具可是非常强大哦,想更改啥都可,以前写过两篇介绍性的博客,其中一篇为介绍,一篇为应用

1、UserAgent分析

2、google notebook。。。

非得这么残忍吗?

非得这么残忍吗?

司徒正美在看到老赵的博客鄙视IE6用户时,不甘寂寞,放出了一段残忍的代码,可以对IE6、7进行封杀处理。。

代码如下:

<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<meta content="IE=8" http-equiv="X-UA-Compatible"/>
<meta name="keywords" content="IE6与IE7封杀器 by 司徒正美" />
<meta name="description" content="IE6与IE7封杀器 by 司徒正美" />
<script type="text/javascript">
//使用setAttribute也行,值好像是固定,为1(读作"日",日得好!)
document.createElement("li").value = 1;
</script>
<title>IE6与IE7封杀器 by 司徒正美</title>
</head>
<body>
<h1>杀!杀!杀!</h1>
<h2>不行请刷新页面(这是运行框的问题)</h2>
</body>
</html>
还有一段是可以关闭当前窗口的:
window.opener=null;window.open('','_self');window.close();
我的博客不能执行代码,如果你想测试,你可以到http://www.cnblogs.com/rubylouvre/archive/2010/05/18/1738370.html进行享受。
看上去不错:Chrome 扩展 Monster

看上去不错:Chrome 扩展 Monster

一直以来,我都是使用着firefox而不是chrome,虽然chrome的速度明显要比firefox快很多,但我还是使用着firefox,那是因为ff上面有很多插件是chrome没有的,比如firebug,yslow,scrapbook,readitlater,searchstatus等。但alipay uED居然推出了一款chrome上的插件,类似于yslow,让人感觉很意外,从图片上看,感觉不错:

Monster 是 Alipay UED 推出的网站代码分析、质量检测及评分的浏览器扩展,它能智能分析CSS、JS、HTML内容并生动形象展示网页得分情况(类似YSlow)。它是一个开源 项目,您可以在GoogleCode中心检出MonsterForChrome项目源代码。不久会推出Firefox版扩展。

highlightsearchkeywords.rar

Monster主要检测规则:

  1. 检测是否有重复ID的标签;
  2. 检测是否使用内联标签嵌套块级标签,如a嵌套div;
  3. 检测https协议页面,是否使用了http协议的图片、JS、CSS等;
  4. 检测compatMode、doctype是否出错;
  5. 检测是否使用了HTML5不再支持的标记,如font,s,u等;
  6. 检测标签是否正确关闭;
  7. 检测CSS、JS、background-image文件是否为404;
  8. 检测CSS、JS文件是否重复调用;
  9. 检测是否引用过多外部JS、CSS文件;
  10. 检测CSS、JS、HTML是否压缩;
  11. 检测CSS样式表是否使用了CSS expression;
  12. 检测Cookie是否超过30KB;
  13. 检测是否有form标签嵌套form标签;
  14. 检测是否直接在标签里定义JS事件,如<a href=http://www.google.org.cn/posts/”#” onclick=”…”>link</a>;
  15. 检测<meta charset=”utf-8″ />是否为<head>第一个子标签;
  16. 检测一个<form>标签内部是否出现二个input[type=submit]标签;
  17. 检测是否在<form>标签中使用了 id=”submit” 的标签;
  18. 检测是否将<style>块放置在</head>前面;
  19. 检测是否将<script>块放置在</body>前面;
  20. 检测<img>标签是否指定alt属性;
  21. 检测是否为input[text]指定label;
  22. 检测网页编码是否为gbk或utf-8;
  23. 检测是否使用了@import导入样式表;
  24. 如果CSS、JS指定 类似于“?t=20100405”时间戳,则自动输出最后修改时间,方便对比;
  25. 如果background-image超过6个,则提示所有背景图片及大小,超过30KB,标红显示;

Monster评分规则:

Monster是根据问题解决难易程度、性能提升程度、可用性提升程度以及维护性提升程度来综合评分的。具体,请下载 Monster评分算法.xls

下载Monster。

我没有试用过,不知道具体如何,我只能说,看上去真的很不错。而且,用上面的话来说,他们很快就会推出firefox版本,我又何必试呢?

雅虎JavaScript架构师:网页开发技术安全优先

雅虎JavaScript架构师:网页开发技术安全优先

html5 越来越近了,HTML5可能给我们带来很大的改变,就象新的标签可以支持视频了。看看javascript的架构师能够做什么吧。原文来自http://www.cnbeta.com/articles/109538.htm

由于当前技术仍偏向功能强化为主要思维,指令码趋向庞杂的结果,容易产生更多安全漏洞,且失去快速因应攻击调整架构的灵活性。
身 为JavaScript网路技术重要推手的雅虎(Yahoo!)架构设计师Douglas Crockford表示,现行网页开发技术思维仍偏重多媒体功能或浏览效能的提升,未来应以安全为第一优先。 Crockford 现为Yahoo!资深JavaScript架构师,负责YUI(Yahoo! User Interface)的架构设计,并且担任ECMA JavaScript 2.0技术委员会成员,为JavaScript开发社群大师级人物,此次受邀来台参加OSDC(Open Source Developer's Conference Taiwan)进行专题演讲,向国内开发者介绍ECMA JavaScript的发展。

Crockford向媒体阐述网络技术发展时指出,当前的网络技术仍然不脱过去的思维,网页开发技术仍以功能强化、浏览网页效能提升为主,虽然强 化了网络开发的丰富性,但未将网络安全列为开发优先考虑因素的结果,致使网络安全事件层出不穷。

延续过去网络开发思维的结果,现今网络技 术强调强大的互动、多媒体功能,但也让一些攻击手法兴起,以XSS(Cross-Site Scripting)为例,由于内嵌多个不同来源的脚本,容易让黑客借指令集趁虚而入,窃取用户端计算机的数据。

虽然也有新的技术,如 Google推动的Caja,用以防范XSS跨站攻击手法,但整体技术发展方向仍是朝功能、效能提升前进。

以HTML 5技术为例,Crockford表示,虽然HTML5增加了许多功能,但让整个脚本变得更为庞大且复杂,容易产生漏洞遭到攻击;另外,支持存取使用者电 脑、手机的终端数据,将数据被窃的安全风险扩大至手机上,而过于庞大复杂的结果,不容易因应日新月异的攻击手法改变,长期而言易形成安全风险。

对 于当前浏览器业者形成速度竞赛,纷纷强化JavaScript引擎加速网页浏览速度,号称最快的浏览速度,他认为,浏览器加速网页浏览速度虽是好事,但这 样改善方式有限,只在5至10%的终端浏览器部份加速,若能同时改善服务器端,加速的效果更大。

对于制定中的新标准ECMA Script 5,他乐观预期未来将成为主要的网络开发标准,虽然Apple、Chrome还不明确,但包括IE、FireFox、Opera都倾向ECMA Script 5,今年应会看到新的浏览器应用。
--EOF--
HTML5已经被越来越多的浏览器所支持,IE还能挺多久?是否又会创造出什么新标准?从IE4开始,多少网页设计师为了兼容所有的浏览器而痛苦?以后又会怎么样?IE6还有这么多用户,怎么办?这一些都让人迷惘啊。HTML5来了,对于前端工程师的压力就要更大一点了。代码没写好,很可能就直接被人利用了。以前的XSS漏洞可能会被更加扩大、放大。还是需要多学一点安全了

不同浏览器对回车提交表单的处理办法

不同浏览器对回车提交表单的处理办法

不知道你是否注意过,在firefox或者Chrome下面,即使没有定义input type=submit,只要点击任何一个button,都能触发form 的submit事件,这是为什么呢?
看看这篇文章吧,介绍的有点详细,把它留下来是因为我一向属于知其然不知其所以然,只知道问题所在,和如何解决,从来不深究它的内涵,这也是我为什么水平上不去的原因。。。所以,不要学我,还是看完这篇文章吧。。。虽然不一定详细,但毕竟知其一部分所以然了。

原文来自:不同浏 览器对回车提交表单的处理办法
内容如下:

  在浏览器中填写表单的时,可以直接在“文本框”中敲击“Enter”来提交表单,很是方便。条件是:

  • 在IE和Firefox下

1、<form>属性的“action”字段必填;

2、有一个type="submit"的“input”。

  • 在Chrome和Safari下 满足第一条即可。(注释1)

  所以,如果要控制提交行为的话(比如,提交前检查必填项是否已填),可以在type="submit"的“input”后添加 Javascript“onXXX(比如onClick)”事件。而如果需要用异步交互来检测相关字段,则无效了。因为return false是作为onreadystate=的子函数,并不能控制全局。这时就需要用到<form>的 “onsubmit”属性(注释2)。比如:

HTML

<form name="form1" id="form1" action="act.php" method="post" onsubmit="myfn();return false;">
  • myfn()是自己定义的函数:无论通过什么办法 (比如敲击“enter”或点击type="submit"(而不是type="button")的“input”按钮)提交,都会触发这个这个函数。于 是,大可不必再在type="submit"的“input”后添加Javascript事件“onXXX”了。直接在“onsubmit”中控制,更直 观与统一,除非有意控制提交方式(是onClick还是什么)。
  • return false位于末尾,表示不提交本表单。提交表单的字句document.form1.submit()可以作为myfn()的一个选择条件的分支。

总结:

  这样,<form>有“action”和“onsubmit”属性,有type="submit"的“input”的提交按钮后, 就可以在任何浏览器下(不行吗?请给我反馈)实现使用“Enter”键和鼠标都可以对表单的相关字段进行异步(Ajax)和同步(单纯的 Javascript)检查并予以提交。

其他:

1、如果使用type="button"来异步检测相关字段呢?

  这样,这个“input”必须得有一个事件触发器。在IE和FF下,无法直接在文本框中按下“Enter”来提交表单。如果要的话,需要使用额 外的函数来监听用户按下了什么,给出一个怎样的反映(注释3)。更糟糕的是,在Ch和Sa下,会忽略是否有type="submit"按钮,而直接根据 “action”属性来提交表单,如此以来,便无法实现预期的检测,可能还有更麻烦的后果。

2、如果不写“action”属性,直接异步提交表单呢?

  这样,通过异步的方式提交表单,而不仅仅是检测,这个属性则没有必要。而且还是多余。假如这样能提供更好的用户体验,何乐而不为呢?呵呵。

【参考】

1 在IE8,FF,Ch中测试有效。Opera和Sa没有测试。参考了这篇文章(http://tieba.baidu.com/f?kz=669494938)

2 这篇文章(http://blog.csdn.net/xiewhenwe/archive/2009/11/08/4785469.aspx) 给了我借鉴

3 参考我以前的文章(http://www.cnblogs.com/lamper/archive/2010/02/06/1665117.html)

Firebug Lite For Chrome

Firebug Lite For Chrome

很意外,一直都认为firebug不会为chrome写插件了。毕竟chrome自带了一个F12的debug工具。
4。0开始后的chrome逐渐开始支持插件,然而,插件网站却不是每次打开都正常。也让我非常郁闷。
不过,看过chrome的插件编写的hello world,却真的发现,它的编写比firefox的插件简单的多。

上面都是闲话,真正想说的还是firebug,自从前两年firebug为IE出过lite版本后,更新幅度就小了很多,所以这次看到它为chrome做的更新,还是不禁想尝试一下的。
OK,上官方的菜,Firebug自己认为:

* Compatible with all major browsers: IE6+, Firefox, Opera, Safari and Chrome
* Same look and feel as Firebug
* Inspect HTML and modify style in real-time
* Powerful console logging functions
* Rich representation of DOM elements
* Extend Firebug Lite and add features to make it even more powerful

不过作为chrome插件,它还仅仅是一个beta版,他这么介绍的:

Firebug Lite is not a substitute for Firebug, or Chrome Developer Tools. It is a tool to be used in conjunction with these tools. Firebug Lite provides the rich visual representation we are used to see in Firebug when it comes to HTML elements, DOM elements, and Box Model shading. It provides also some cool features like inspecting HTML elemements with your mouse, and live editing CSS properties.

o get more information about what's new in Firebug Lite 1.3 beta (which is compatible with all major browsers) please visit the beta release page.


可以到这里进行下载:http://getfirebug.com/releases/lite/chrome/