关于 XSS 防范的一些思考

标签:HTML, JavaScript

最近在看一些 web 安全相关的文章,大部分都有系统和完善的解决方案,然而 XSS(Cross-site scripting)攻击相关的资料却很杂乱,甚至连 HTML 实体转义能解决哪些地方的 XSS 攻击都说不清。
于是在翻了一堆资料后,觉得还是把自己对它的一些思考记录下来吧。

加载 JavaScript 的各种姿势

标签:JavaScript

前天我给自己的博客做了些优化,让大部分的页面对所有人都输出相同的内容,然后再针对不同的用户,用 JavaScript 动态地修改一些细微的部分。
这样的好处是 HTTP 缓存可以设为 public 了,甚至可以用 nginx 的 proxy cache 或者完全静态化。
不过按照最近的习惯,这篇文章也不是介绍缓存的经验,而是另一个问题:我在给不同用户增加不同功能时,需要动态地加载 JavaScript 文件,那么正确的加载方式是怎样的呢?

原生应用 vs HTML 5

标签:HTML, JavaScript, iOS开发

这几个月都在开发知乎日报的后端,让我对移动应用的开发有了更多的认识。

简单来说,我以前一直都认为原生应用才是王道,现在则觉得 HTML 5 才是未来。

用JavaScript读取和保存文件

标签:JavaScript

话说今天只是粗略浏览了一下Proxy SwitchySharp的源码,就收获了不少东西,其中就包括本文要介绍的读取和保存文件。
因为Google还不提供同步插件数据的功能,所以导入和导出插件配置就必须和文件打交道了。而出于安全原因,只有IE才提供访问文件的API;但随着HTML 5的到来,其他浏览器也纷纷支持了。

字符串相加并不慢

标签:Python, 性能, JavaScript, Java

在学Java时,我对拼接字符串有个很深刻的印象:StringBuilder.append()比String相加要快很多。
这个偏见影响了我几年,直到今天才发现它并不一定适用于其他语言。

为什么遵循W3C标准极其重要?

标签:JavaScript

公司里一个IE only的项目里遇到个bug,有的测试人员遇到了,而作为开发人员的我却没遇到。我查了1天也没找出原因,倒是发现其中混杂着各种风格的代码。
以根据id获取DOM元素为例,我就找到4种方式:
  1. document.getElementById(elementId):W3C标准。
  2. document.all[elementId]或document.all.elementId:这个方法会返回id或name为elementId的元素(或元素数组)。IE、Chrome和Opera支持,Firefox不支持。
  3. window[elementId]或window.elementId:DOM元素会根据其id生成一个全局变量。IE、Chrome和Opera支持,Firefox不支持。
  4. eval(elementId, window):同上。IE、Chrome和Opera支持,Firefox不支持。

获取父窗口中包含自身的iframe

标签:JavaScript

今天在开发时遇到个问题:页面A包含几个标签,在切换标签时,高度会变化。页面B用iframe引用了页面A,并且在A载入完成时,把iframe的高度设为了页面A的高度(调用一个自定义的adjustHeight()函数)。可是在切换标签时,iframe的高度并不会变化,就出现滚动条了。
这个问题的难点在于页面B是框架自动生成的,我没法更改,只能在页面A里修复这个问题。

为视网膜显示屏优化网页上的图片

标签:HTML, JavaScript, iPhone, CSS

说起iPhone 4带来的革新,retina display绝对是最吸引眼球的一项,以至于我现在看电脑的显示屏时,都能看到满屏幕的像素点了⋯

正是依赖这视网膜显示屏,iPhone 4的分辨率达到了640×960 pixels;不过为了保持向下兼容性,它采用的仍然是320×480 points。
也就是说,在不进行缩放的情况下,显示普通图片时,它会用4个像素来显示图片中的1个像素;而在显示retina图片时,每个像素都对应图片中的1个像素。
如此一来,老的应用无需修改就可以在iPhone 4上运行了——虽然显示效果差了点,但是不会出现只有左上角那1/4的区域有内容的情况。

在用iOS SDK开发iOS应用时,只要将图片名加上“@2x”后缀,就能让支持retina display的设备自动显示这个解析度更高的图片。
但Safari等使用UIWebView的应用在展示图片时,却无法利用这个特性,因为这样可能会造成大量没必要的HTTP请求。
既然不能自动实现,那就只能手动来弄了。原理很简单,准备2种图片,当检测到支持retina display时,就显示大图,然后把图像的长宽各缩小一半即可。

« 看看还有什么好玩意