按月归档:2014年一月月

[译]在WordPress中使用AJAX的5个小贴士

原文http://www.garyc40.com/2010/03/5-tips-for-using-ajax-in-wordpress/,这是一篇很棒的文章,虽然有些年月了,不过真正有价值的东西,可以经历时间的磨砺 :-)

AJAX被用到了很多Wordpress的主题和插件中,但是呢,不是所有的都正确的使用了AJAX。这里提5个Wordpress中使用AJAX的最佳实践。

注意:这篇文章很长而且充斥了知识,请把它加入收藏夹,以便以后随时回来查阅(好吧,这是作者在做广告了,虽然这也是我想说的,译注)。

使用AJAX的错误方法

我看过很多的使用AJAX的插件,有些使用了正确的方法有些的实现方法则不对。这些不正确的插件使用的方法通常就是:使用一个PHP文件来响应ajax请求,另外的一个php文件来写了些javascript的代码。

下面是一个常见但是错误的例子:

这个用法之所以错误,是因为用户有可能会使用其他的文件路径,这样上面的相对文件的读取方法就有问题了。更进一步,如果你在插件中使用了面向对象的开发方法,你就不能够直接访问需要的类属性和方法了。

上面的PHP代码中,我们还需要另外一个PHP文件来输出javascript文件。这样一来,这个PHP文件又要加载wp-config.php或者wp-load.php,这还可能需要读取数据库的数据等。所以我们相当于把整个Wordpress框架又加载了一遍。

抱歉到现在都没有给你展示正确的使用AJAX的方法,但是为了避免错误,我们需要把不利说说清楚,这样才能自然而然的引入下面五点

1. 使用wp_localize_script()来声明全局的javascript变量

尽管wp_localize_script()通常用于声明国际化的代码,它也可以有另外的用法。你可以使用它来声明javascript的变量,甚至可以带命名空间!下面是它的语法:

然后是你怎么用它来声明一个AJAX的全局对象(这个例子中我使用了admin-ajax.php,会在第二部分中讲到):

使用这种方法,你不需要使用PHP来输出Javascript代码,那可真是各种不爽。如果你看一下生成的HTML代码,你也许会发现:

现在,在你的ajax.js中,你就可以使用MyAjax.ajaxurl变量了,不需要wp-load.php。参考第二条学习关于收发请求的知识。

2. 使用admin-ajax.php来响应AJAX请求

AJAX请求应该指向wp-admin/admin-ajax.php。好吧,我知道”admin”这个词有点容易误导人,不过即使是前台的ajax请求,也应该定位到admin-ajax.php。

admin-ajax需要一个参数“action”。admin-ajax需要这个参数来处理请求,它通常触发一个hook,根据是否登录有所不同:

JavasScript代码的话有点象这样:

现在我们在插件或者主题里面写一个实际的代码来响应:

3. 使用nonces并且检查权限

我想我不需要再重申检查用户请求权限的事情了。虽然开发者总是会有意无意忽略它,然后结果会很悲剧。没有了适当的权限检查,一个不怀好意的访问者可以轻松毁了你煞费苦心打造的网站。这里我们要介绍两种安全层。

Nonces

Nonces是Numbers that are generated and used once的缩写(它是一个在加密通信只能使用一次的数字,通常翻译为随机数,但我觉得随机数不太能够完全表达它的含义,所以我下面还是用这个单词,译注)。Nonces保证了action由特定位置的授权用户发起的。这里有Jon Sykes的有趣分析,这让事情变得容易理解一些。

当你进入了一家熟食店,你会拿到一张票,当轮到你票上的号码时,你拿着票交给服务员,服务员把票收下并作废,然后为你提供服务。然后他们会接着为大屏幕上显示号码的顾客提供服务。

如果有不讲文明的孩子进入店里试图插队,他们是不会得逞的,因为他们没有票。

即使他们得到了其他顾客使用过的票,那也是不行的,因为票已经使用而且号码也已经过去了。

我们再把这个场景扩展一下,当客户得到一张票的时候,我们还给这个客户在他的票上签名。这样一来,当服务员给顾客服务的时候,他不仅看票的号码,也会让顾客再次签名,以和票上的签名进行比较确定这张票是不是真的属于这个顾客。

在扩展一下,我们限定只有顾客进入大门的时候发给他票然后在上面签名,这会进一步防止有人趴在窗口试图伪造顾客的签名。因为他没有进入大门,甚至连票也得不到一张。所以他根本没有办法插队来买走那最后一根腊肠。

Mark Jaquith 和 Vladimir Prelovac 同样对Nonces有精彩论述,读一读他们的文章,因为你肯定会在各种各样WP开发中使用到这些东西的(不仅仅是AJAX相关)。

不过,这里也应该说明一下,Nonces只用作对数据内容有修改的情况下,如果只是读取一些不敏感的信息,比如获得评论的条数,或者一篇文章的内容,那么Nonces是不必要的。不过如果你是对一篇文章进行新增/编辑/删除,那么确保你会使用Nonces。

好了,理论说的够多的了,我们来看看如何使用它吧。

首先,你需要产生一个nonce,然后使用wp_localize_script()来包含这个变量

现在你可以在JS中使用全局变量MyAjax.postCommentNonce了,你可以在随后的AJAX请求中发送这个值。

这基本和上一个例子差不多,除了我加了个nonce值发送给服务器。

这里有个事情要注意一下,如果你需要发送多次ajax请求,那么你必须在一次ajax请求中生成一个新的nonce值返回,然后用脚本更新这个值,在下一次ajax请求中再使用。否则这个nonce会在多次ajax请求中使用,就会出问题啦。

检查权限

很多脚本忽视了完整的权限检查,记住使用current_user_can()来确定当前的用户是被授权的,这里有一个终极版本的代码来回应请求:

4. 使用内置的jQuery表单插件来提交表单

大家都知道使用ajax来提交表单避免页面的刷新,但不是不是所有人都知道wordpress提供了一个jquery的插件来处理表单的相关动作。要想使用这个插件,想下面一样先包含它:

(译注:这个JS莫名其妙,它这里说的应该是ajaxForm插件,请参看下面的链接)
然后提交表单就很轻松了:

这个插件还有很多参数,请自己查阅吧。

5. 警惕jQuery自带的JSON解析功能

(原文撰写时间较早,Wordpress版本为2.9.2,jQuery版本为1.3.2,这个版本的jQuery有时候会完全依靠eval来解析JSON数据,因而会有安全性问题,后续版本已有改进,我们现在接触的版本应该都是安全的,因而这一点不在翻译,否则反而混淆视听了。译注)

总结

ajax是一把双刃剑,它使得用户体验平滑而且迅捷,但是也带来了复杂度的提升和安全检查的繁杂,正确的使用它,安全的使用它。文章涵盖了5个重要的使用ajax的注意点,遵守他们,确保您的代码安全而且高效。

您对ajax的使用是否有什么心得?请在下面留言吧:)

写在2013年末

域名还在转移中,和原来和现在的主机商都联系了,前者说已转出,后者说待转入,只能继续等了,靠着hosts的绑定,连上了这个只有自己能看的新空间,随便写点什么。

现在是2014年1月30日,阴历的话,2013年的除夕,算是辞旧迎新的一天了。按说今年除夕无休,总算是偷了个小懒,不上班其实也无所谓了,安分工作的人估计也不会有几个了。沐浴着零星阳光,听着外面的唢呐喇叭,想着这一年,想着下一年。

外面的唢呐声,是邻居一位老人家走了,27号的晚上吧,原想着能撑过今年的,终于没有。老人是一位铜匠,我们小辈的一直以来叫他“公公”,大一辈的就以职业代称号直呼“铜匠”了,真名?我想我并不知道。

公公以前有很多的铜匠工具,或者叫吃饭的家伙,记得小时候有一次去他家,他正架起炉子准备补什么器皿,铁锅下火旺得很,我却还以为要烧菜,然后他取出一段铁丝,把火柴擦上烘烤那铁丝,铁丝居然就融化为一滴一滴,滴落到铁锅里调皮的滚动,就像夏日荷叶上的水珠,颇为晶莹灵动。从来没有见过火柴能融化铁丝的我,着实吃惊的很,尽管那时候还小,但还是被这一幕震撼到了,以至于现在都可以记得很清楚。现在想来,那应该是一根锡丝,可惜那时候不懂,之后好多次尝试用火柴烧化铁丝,每每无法成功,后来直接把铁丝放到煤气灶上烧至通红,依然没有融化的迹象。不过后来发现把鲜红的铁丝放在水里听那一声“呲”~好像也很有趣,乐此不疲。稍大一些,从新华词典上得知这种叫“淬火”,古时候铁匠把铁烧红锻打后又浸入水中,可以让铁变得更坚硬,更是兴致勃勃,不停的重复,幻想着那根铁丝有朝一日能够无坚不摧称霸武林,终是孩童是的美好想法罢了,想在想来,不禁莞尔且唏嘘。现在用烙铁蘸些锡焊什么的时候,也会不时响起这些,有趣的很。

其实每一天都是一样的,之所以今天好多人变得比较多愁善感,估计是受了外界影响,觉得大年夜有什么特殊,需要继往开来需要承前启后,需要再规划一下未来的一年。

我倒想在这里给自己立个军令状,比如2014要看多少书写多少博文深造多少技术完成几个项目生几个孩子什么的……又恐琼楼玉宇的远处不甚明了,计划赶不上变化,但是没有准备又不行。没有了目标,我们就沦落为给有目标的人实现目标的垫脚石了。鲜有人甘愿做垫脚石,但更少有人愿意在没有外力的情况下一直努力下去。所以我真是喜欢我们人类啊,要是大家和我不同,都那么努力,那我的处境该多么糟糕 😉

另外最后,发现自打用了Evernote,很多东西写写笔记就好了,再用不着正儿八经往博客上归纳总结了,一年的空白期,Evernote也是个大大的促成因素,那这到底是个好东西,还是个坏家伙?

世界,你好again!

目光博客又回来啦~~

上一篇文章已经是大半年的事情了,而有意义的文字那是一年不见。人一旦懒起来,那是二十头牛都拉不回来,说的就是我了。

这一年里发生了很多,于我,最大的改变就是,家里多了个叫“老婆”的大人物,嗯,虽然她不看我博客,倒也不忌讳调侃,但是余威尚在,还是收敛一些。结婚了嘛,酸甜苦辣咸,谁经历谁知道哇!

我终于放弃了justhost的主机服务,转战国内了。这次选了个国内的主机商,不过机器似乎是在香港的,所以你们懂得,省了很多麻烦事情。而且一狠心买了个独立IP的,心里上更踏实一些。为避免广告之嫌,暂时就不说IDC名字了,要是用下来真心好,那就再回来宣传宣传。
更多