localStorage也跨域

最近做一个项目,改动到了两个页面(A,B):在A页面(aa.example.com/a.html)往localStorage写一个key,然后在稍候的B页面(bb.example.com/b.html)读出来。结果是写的时候成功了,在A页面也读出来了,跑到B页面,localStorage却是空的!

别急,待俺掐指一算……嗯,子域不同,localStorage应该也是不一样的。在A页面的逻辑完成的时候,跳转到bb.example.c......

Compiler@NodeJS(二)- 强大的管道

接上篇:Compiler@NodeJS(一) – Web项目编译脚本

直接切入主题吧。

PS:打个广告先,Compiler@NodeJS,Web开发、居家旅行、杀人越货之必备良药!

比较深入的用过linux的童鞋,一定记得这个“|”。它的使用方式是这样子的:cmd_a | cmd_b,意思是执行cmd_a 并且把cmd_a输出的结果,作为cmd_b的输入参数,传给cmd_b并执行它。例如我在shell中执行 top | grep node,就可以把进程名字包含node的进程的相关信息都找出来。如下:

Compiler@NodeJS(一) - Web项目编译脚本

转眼这一年又要到尾声了。想想这一年,貌似没干啥大事,却写了一堆杂七杂八的脚本,零零碎碎的。单个单个地用的时候是挺爽的,一旦跟已有项目结合起来的时候,由于之前的编译脚本是用python写的,没有灵活的插件机制,操作起来相当的不方便。就比如之前写的自动合图脚本(iSpriter),如果要在项目中加入,就得手动执行一次合图脚本,然后再执行python编译脚本。万一忘了合图,就会酿成发布事故。

因此,一直都在计划着用NodeJS实现一个编译脚本,可以方便的把以前写的一些脚本组合起来。于是抽了一些时间,整了这个编译脚本(compiler)。more

特性

其实世面上的编译脚本也有不少了,那么这个c......

Canvas中createRadialGradient的各种取值研究

话说上次melody同学分享了canvas绘图的相关内容,大家都对createRadialGradient的输入参数和结果蛮感兴趣的。因此我也把它的各种取值都试了一遍,发现了一些有趣的东西,共享之。

首先说下createRadialGradient,createRadialGradient是canvas创建发射渐变的一个方法,它的形参是这样子的:

createLinearGradient(xStart, yStart, radiusStart, xEnd, yEnd, radiusEnd)

前三个参数是起始圆(cycle1)的x、y、半径,后三个是终点圆(cycle2)的x、y、半径。其它介......

OAuth授权的XSRF漏洞及其修复

话说前段时间 OAuth2.0 授权被人找出了个漏洞,各个开放平台都有影响,导致一阵恐慌。虽然后来发现其实是夸大其后果了,但也暴露出我们对这个经常用的协议仍一知半解的现状。所以花了点时间,整理了 OAuth1.0 和 2.0 的授权流程、以及其中的隐患和修复方案,供各位同学了解。由于本人也是临阵磨刀,难免疏漏,欢迎指点。

一、OAuth 1.0

a)OAuth1.0的授权流程为

[caption id="attachment_1461" align="alignnone" width="600"]

【更新】Template-Picker - 模板代码抽取工具

感慨几句

最近开搞Android开发了,没怎么弄js。跳出这个圈,开始考虑是不是可以做点代码之外的事。编程语言一直在发展,新特性总会层出不穷。那么,语言之外呢?

拿Web前端开发来说,js之外,还是有很多东西要做的。比如说发布脚本,比如说提速等等。

好,进入正题。

话说之前写过一个把写在html里的模板代码,抽取到js里面的脚本,开始的时候用了一段时间,感觉还可以再优化下。后来做了个新项目,里面与多个html页面,也都包含有模板代码,也都要抽取。这时之前的脚本就有点力不从心了。

所以把抽取脚本升级了下,给了个名字叫 template-picker,添加了一下特性:

支持多个ht......

自动生成HTML5离线应用的Manifest

碎碎念

HTML5的离线应用(Offline Application)已经广为人知了。无论是用来给WebApp提供离线使用的功能,还是仅仅用来加速页面加载,离线应用都是个让人很爽的特性。

离线应用的原理什么的就不在赘述了,google一下就有很多介绍。这里主要谈下怎么生成离线应用的配置文件。离线应用需要根据服务器上的manifest配置来决定时候要离线和更新,以及判断有哪些文件需要离线。

在小型WebApp中,可以人工一个个的添加文件路径,理论上是没啥大问题。当项目大了之后,会引用很多资源、图片等,特别是图片,必须人工从css文件中找出所有url添加到manifest中。个人觉得这是件相......

【走四方】九寨沟山山水水

千里之行,始于:2012-10-9

九寨沟,五花海

去年的年假原本7月中就到期了,但是4、5、6月都跑出去玩了,钱包吃不消啊~~

还好能延期3个月,不曾想3个月一下子就过去了。期间一直忙项目,也没时间休假。只好排到国庆过后休了。不过这时间段也不错,国庆期间出去玩的人都回来了,这回可以不用像去年去丽江那样人挤人了吧?^_......

【更新】iSpriter - 智能合并CSS精灵图

号外号外,iSpriter更新啦!

什么?你不知道iSpriter是什么?那你太out啦,必须先看看这个文章了。简单的一句话介绍:基于NodeJs的开源CSS精灵图合并工具,不用改变原有的 css 编写方式,就能自动帮你解决 css sprite 的合并问题。目前源码托管在 github(https://github.com/iazrael/ispriter),欢迎各位同学来一起完善。

由于最初写的时候不怎么注意代码自量,写得比较搓。在应用在几个项目之后,修复了一些 bug,发现再加新功能比较困难。最近终于下决心重构了下,并在重构的基础上增加了一些新特性。

目前 iSpriter 的特性......

让文本框支持Tab键缩进

文本框是Web输入必不可少的一个控件,虽说现在有了很多所见所的的编辑器,但是在做一些输入比较简单的功能的时候,总不能引入一个庞大的编辑器代码是吧?比如说,syntax-heighlighter 的代码输入框。

一般情况下,textarea写些示例代码已经够用了。但是遇到需要缩进的时候就比较蛋疼。页面上的Tab按钮默认行为是跳转焦点,无法实现对文本框的内容进行缩进。如果要缩进,就得自己敲4个空格,天啊,敲死我咩~~

所以,想要不蛋疼,就得做hack。more

话说textarea有两个很好用的属性,selectionStart、selectionEnd(不确定ie是否有这两个属性,但是本人......