• 添加了撤销和重作功能.
• 添加了部分retina高清图标，为了The new iPad.
• 预览界面里的链接现在是在内置的safari打开，避免点击链接之后无法预览
• 修复竖持时>按钮无法被按到的问题

下一个版本会做稍大的改动，计划内的改动如下：

• 补齐retina图标以及app的高清图标
• 支持MultiMarkdown语法，这样就可以画table了
• 支持编辑时手动上传

猛击App Store下载。

现在限时降价，6块

1.0.1新增的功能:

• 新增了多个语言支持
• 新增了全屏预览按钮
• 在键盘上新增了两个按钮: < 和 >
• 解决了第一次打开文件时有可能没有预览的问题
• 解决了Dropbox同步的一个问题

我借到一个支持Air Print的HP打印机测试了打印功能，MarkNote的打印功能工作正常。

图片预览

新增的全屏预览按键在下图的右下方，可惜被某浪的图片水印盖住了。

转换为原图的方法

在安装好Xcode之后（我安装的版本是4.3），可使用命令行转换

/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/usr/bin/pngcrush -revert-iphone-optimizations src.png dst.png

这个命令行太长，不好记，所以我在~/.bash_profile中加入一个alias。

alias pngcrush="/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/usr/bin/pngcrush -revert-iphone-optimizations "

所以之前的命令可以简化为

pngcrush src.png dst.png

批量转换png

用简单的shell就可以批量转换png图片为原图。

for i in `ls *.png`; do pngcrush $i /tmp/$i; mv /tmp/$i $i; done

小说跟踪器的用途

小说跟踪器可以试阅起点中文网的小说，订阅小说的章节更新通知。因为目前的阅读软件已经多的不得了，所以这款应用没有把阅读功能作为重点来做，只提供了基本的试阅功能。但是你会发现它的 章节更新通知 功能很好用，很及时而且也稳定，最重要的是，还免费。

所以，这个应用适用于起点小说的重度书友，跟书不愁。

目前支持的设备有iPhone以及iTouch，在iOS 4.3及以上版本都可以使用。

应用截图

书架

章节通知

阅读界面

网站

• 小说跟踪器的应用网站
• 小说跟踪器的微博

MarkNote的功能

• 实时预览
• 自动保存
• 多个主题选择,甚至可以做为一个简单的待办事项列表来使用(使用TopMarks主题)
• 和Dropbox同步
• 以html格式打印或邮件递送内容
• 复制内容到其它应用中使用

真相图

BTW:这个应用苹果的审核人员只用一个小时就通过了，可见是多么简单的一个应用。

Semantic Issue
PerformSelector may cause a leak because its selector is unknown

warning倒是不影响程序运行，但是这人要是有点代码小洁癖的话，那日子就没法过了，这warning怎么看都碍眼。所以必须得想办法把它弄没了：

#pragma clang diagnostic push
#pragma clang diagnostic ignored "-Warc-performSelector-leaks"
    [self performSelector:nextView];
#pragma clang diagnostic pop

世界清静啦

Only user-generated data or that cannot otherwise be recreated by your application, should be stored in the /Documents directory and rest should be stored to /Library/Caches directory。

照做会怎么样？

如果这么做的话，会出现两种情况

1. 如果对此置之不理，继续把应用生成的文件放在Documents目录下，那么这些文件会被备份到iTunes或者iCloud。如果这些文件很大，那么用户可能需要为了同步消耗不少流量，然后苹果可能会因此拒绝你的应用上架，这是一个悲剧。
2. 如果开发者照Apple说的干，把应用生成的文件放在Caches目录下，那么苹果不会拒绝你的应用，很happy。但是iOS 5会在磁盘空间紧张的时候删除Caches目录下的文件，这对用户来说可能是一个更大的悲剧。

如何应对新的文件存储策略?

开发者在这时陷入了两难的境地，但是到了iOS 5.0.1的时候，开发者多了第三种选择:

• 继续把文件存储在Documents目录下，但是标记这些文件为不需要备份。详情请参考 technote (QA1719)

原文如下:

Q: My app has a number of files that need to be stored on the device permanently for my app to function properly offline. However, those files do not contain user data and don’t need to be backed up. How should I store those files in iOS 5?

A: Starting in iOS 5.0.1 a new “do not back up” file attribute has been introduced allowing developers to clearly specify which files should be backed up, which files are local caches only and subject to purge, and which files should not be backed up but should also not be purged. In addition, setting this attribute on a folder will prevent the folder and all of its contents from being backed up.

代码示例

给文件加上”do not back up”属性的代码如下，需要注意这个是iOS 5.0.1才有效，低于这个版本就别费劲了。

#include <sys/xattr.h>
- (BOOL)addSkipBackupAttributeToItemAtURL:(NSURL *)URL
{
    const char* filePath = [[URL path] fileSystemRepresentation];

    const char* attrName = "com.apple.MobileBackup";
    u_int8_t attrValue = 1;

    int result = setxattr(filePath, attrName, &attrValue, sizeof(attrValue), 0, 0);
    return result == 0;
}

开始干

• 首先我找到了一个叫topmarks的markdown样式文件，这个样式文件能给出一个漂亮的Todo list样式，我把它合并到了 修改后的markdown preview插件
• 关注了一下markdown-preview原作者的github，他有计划增加一项功能，让用户可以自定义css文件，但是近期完成无望，所以我新增了一个topmarks的分支，采用新的样式
• 在chrome的扩展中重新加载插件

效果图

如图，我采用vim编辑文件，右边摆上chrome浏览器预览，文件采用dropbox同步，保证我随时能更新这个文件。

关于topmarks的补充说明

topmarks样式采用了这些自定义标签

• <t> 新任务
• <d> 已完成的任务
• <c> 已取消的任务
• http, ical, mailto, file链接有不同的图标

今天看到一个chrome的扩展叫markdown preview，它可以自动把md或markdown后缀的文本转换为html格式在chrome中查看，只是还欠缺一个自动刷新的功能。然后我看到它的源码已经放在github上，于是抓回来做了一些修改，加上了自动刷新的功能。

演示

尝试了一下在vim中编辑文件，然后在chrome中浏览，效果还不错，见下图：

更改后的扩展

我把修改后的markdown preview插件放在github上 ， 已经尝试向原作者发起pull requests，要试用的话需要按下面几步操作:

1. 把插件的代码clone回来 git clone git://github.com/volca/markdown-preview.git
2. 开启chrome扩展的开发者模式，具体位置在窗口 -> 扩展程序里
3. 载入正在开发的扩展程序
4. 将允许访问文件网址勾选上

然后你就可以尝试用chrome浏览器打开markdown文件预览html，采用趁手的编辑器去修改它。

BTW

• chrome下的插件写起来比想像的要简单，写javascript就是了
• 现在这篇blog即是我用markdown格式写成的，用到了wordpress的markdown on save扩展。

Update

• 测试把文件放在dropbox的Public下，修改之后的效果能够立刻在共享链接里看到效果，很完美

代码在github上：https://github.com/volca/AsyncHttpClient

使用示例

如下，在request的时候能够定义请求完成之后的callback函数。

<?php
$base = event_base_new();

$uri = "http://www.baidu.com/";
$config = array(
    'eventbase' => $base
);

for($i = 0; $i < 10; $i++) {
    $client = new AsyncHttpClient($uri, $config);
    $client->request(function($result) {
        echo "Result len:";
        echo strlen($result['response']);
        // parse response with Zend_Http_Response
        $response = Zend_Http_Response::fromString($result['response']);
        echo $response->getBody();
        echo "\n";
    });
}

event_base_loop($base);
echo "done\n";

目前的实现比较初级，只做了get方法的封装，如果需要http上传或者post，还需要另外实现。另外这个类也需要php的libevent扩展。

Update 2011.11.17

将这个类修改为继承自Zend_Http_Client，这样我可以少写一些代码，顺带也实现了文件http上传以及post（未经测试）,代码中的使用示例也已经更新。

• phpDaemon — 一个异步的服务器端开发框架.
• tail – 用php实现类似unix下的tail命令行
• ZeroMQ + libevent in PHP – 用php和ZeroMQ实现的一个事件驱动服务器端

我所想到的一个比较实用的使用场景是，在页面中利用libevent请求多个http接口来获得数据。若是在从前，一个可行的办法是利用curl_multi_exec来同时请求好几个接口，但是这个办法需要用一个do … while循环来完成请求，很是坑爹。那么看看采用libevent的例子:

代码实例 http.php

<?php
$base_fd = event_base_new();
$times = 0;
$limit = 10;
$index = array();

function httpGet($host, $base_fd) {
    global $index;

    $fd = stream_socket_client("$host:80", $errno, $errstr, 3, STREAM_CLIENT_ASYNC_CONNECT | STREAM_CLIENT_CONNECT);
    $index[$fd] = 0;
    $event_fd = event_new();
    event_set($event_fd, $fd, EV_WRITE | EV_PERSIST, function($fd, $events, $arg) use($host) {
        global $times, $limit, $index;

        if(!$index[$fd]) {
            $index[$fd] = 1;
            $out = "GET / HTTP/1.1\r\n";
            $out .= "Host: $host\r\n";
            $out .= "Connection: Close\r\n\r\n";
            fwrite($fd, $out);
        } else {
            echo fread($fd, 4096);
            if(feof($fd)) {
                fclose($fd);
                $times++;
                echo "done\n";

                if($times == $limit - 1) {
                    event_base_loopexit($arg[1]);
                }
            }
        }
    }, array($event_fd, $base_fd));

    event_base_set($event_fd, $base_fd);
    event_add($event_fd);
}

for($i = 0; $i < $limit; $i++) {
    echo "$i\n";
    httpGet($argv[1], $base_fd);
        //echo file_get_contents("http://$argv[1]");
}

event_base_loop($base_fd);
?>

为了省事，这个php脚本仅仅是重复抓取一个网页5次，并且回调的逻辑我没怎么做处理，仅仅是echo出来而已，可以通过下面命令行来运行这个例子:

php http.php "www.baidu.com"

代码中的http_get($argv[1])这行虽然是靠一个命令行顺序执行，但是不会阻塞后面的代码，直接就进行下一次请求了。而且我们看看回调方法部分是不是很像用javascript调用ajax写的回调方法？这都是php 5.3中闭包的功劳。

event_set($event_fd, $fd, EV_WRITE | EV_PERSIST, function($fd, $events, $arg) {
    //回调方法，后续处理随意
    echo fread($fd, 4096);
    if(feof($fd)) {
        fclose($fd);
	event_base_loopexit($arg[1]);
	echo "done";
    }
}, array($event_fd, $base_fd));

想到更多

在mysqlnd，memcached…这些php扩展中，都已经有delay回调的实现，如果能好好利用，对性能提升岂不是有莫大的帮助？或者在libevent扩展的基础上，实现一个事件驱动的开发框架，也是可行的。

Update 2011.11.10

在这个代码的基础上实现了一个异步http请求的客户端

Update 2011.10.28

event_base_loop是会阻塞后续代码执行的，所以我调整了示例代码，使用同一个event_base，并且用stream_socket_client来进行异步连接，另外在/etc/hosts指定域名的ip会对执行速度有帮助。

但是在实际使用中，我希望左侧的字体能变大，右侧字体变小，所以我参照wiki的介绍 在TTTableViewController定制单元格 来进行调整，按文中介绍，我需要实现：

1. 自定义的tableItem
2. 自定义的tableItemCell
3. 自定义的datasource，以便支持新增的tableItem

但是考虑到three20的代码库中已经有个半成品的TTTableRightCaptionItem，所以我只需要在这个基础上加工一下。

实现TTTableTextCaptionItem

我将这个自定义的类命名为TTTableTextCaptionItem以示区别

TTTableTextCaptionItem

TTTableTextCaptionItem.h

#import <Three20/Three20.h>

@interface TTTableTextCaptionItem : TTTableRightCaptionItem {
}

@end

TTTableTextCaptionItem.m

#import "TTTableTextCaptionItem.h"

@implementation TTTableTextCaptionItem
@end

TTTableTextCaptionItemCell

TTTableTextCaptionItemCell.h

#import <Three20/Three20.h>

@interface TTTableTextCaptionItemCell : TTTableRightCaptionItemCell {
}
@end

TTTableTextCaptionItemCell.m

#import "TTTableTextCaptionItem.h"
#import "TTTableTextCaptionItemCell.h"

static const CGFloat kKeySpacing = 12;
static const CGFloat kKeyWidth = 75;

@implementation TTTableTextCaptionItemCell

///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
#pragma mark -
#pragma mark UIView

///////////////////////////////////////////////////////////////////////////////////////////////////
- (void)layoutSubviews {
    [super layoutSubviews];

    self.detailTextLabel.frame = CGRectMake(kTableCellHPadding, kTableCellVPadding,
                                      kKeyWidth, self.textLabel.font.ttLineHeight);

    CGFloat valueWidth = self.contentView.width - (kTableCellHPadding*2 + kKeyWidth + kKeySpacing);
    CGFloat innerHeight = self.contentView.height - kTableCellVPadding*2;
    self.textLabel.frame = CGRectMake(kTableCellHPadding + kKeyWidth + kKeySpacing,
                                            kTableCellVPadding,
                                            valueWidth, innerHeight);
}

///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
#pragma mark -
#pragma mark TTTableViewCell

///////////////////////////////////////////////////////////////////////////////////////////////////
- (void)setObject:(id)object {
    if (_item != object) {
        [super setObject:object];

        TTTableTextCaptionItem* item = object;
        self.textLabel.text = item.text;
        self.detailTextLabel.text = item.caption;
    }
}

@end

如何使用TTTableTextCaptionItem

首先实现一个自定义的DataSource，然后在后续代码中使用这个DataSource

#import "TTTableTextCaptionItemCell.h"
#import "TTTableTextCaptionItem.h"

@interface MyCustomDataSource : TTSectionedDataSource
@end

@implementation MyCustomDataSource

- (Class)tableView:(UITableView*)tableView cellClassForObject:(id)object {
    if ([object isKindOfClass:[TTTableTextCaptionItem class]]) {
        return [TTTableTextCaptionItemCell class];
    } else {
        return [super tableView:tableView cellClassForObject:object];
    }
}

@end

代码下载

我把代码放到github上，方便大家参考 TTTableTextCaptionItem.git

• post数据方便，只需要构建一个参数的dictionary就可以了，像get方法一样简单
• 支持磁盘缓存，而NSURLRequest仅支持内存缓存
• 因为TTTableViewController + TTURLRequestModel的存在，搭配使用效果良好

在ios的开发中我有时也用到了OAuthConsumer进行oauth授权，利用OAuthConsumer的fetcher类请求远程数据，所以我想TTURLRequest和OAuthConsumer能不能搭配使用，这样就能用上three20相关便利方法加载远程数据。于是做了点简单的测试，果然成功了:)大体思路是:

• 先利用OAuthConsumer根据提交的参数计算出oauth的Authorization认证头
• 把Authorization头加到TTURLRequest
• 由TTURLRequest提交数据。

直接上代码说话：

计算Authorization头

利用OAuthConsumer计算出Authorization头，为之后的请求做准备

//start
OAConsumer * consumer = [[OAConsumer alloc] initWithKey:yourConsumerKey secret:yourSecret];
NSURL * url = [NSURL URLWithString:@"http://your-api-host/your-method"];
OAToken * authToken = [[OAToken alloc] initWithKey:yourAuthToken secret:yourAuthSecrent];
OAMutableURLRequest * request = [[OAMutableURLRequest alloc] initWithURL:url
                                                                consumer:consumer
                                                                   token:authToken
                                                                   realm:nil
                                                       signatureProvider:[[[OAPlaintextSignatureProvider alloc] init] autorelease]];
[request setHTTPMethod:@"POST"];

NSMutableArray * params = [NSMutableArray array];
OARequestParameter * p1 = [[OARequestParameter alloc] initWithName:@"param1" value:@"i'm param1"];
[params addObject:p1];

[request setParameters:params];
[request prepare];

TTDINFO(@"Authorization is %@", [request valueForHTTPHeaderField:@"Authorization"]);

使用TTURLRequest请求数据

将Authorization头附加到TTURLRequest，然后请求远程接口

TTURLRequest* req = [TTURLRequest requestWithURL:request.URL.absoluteString delegate:self];
req.response = [[[TTURLDataResponse alloc] init] autorelease];
req.httpMethod = @"POST";
req.cachePolicy = TTURLRequestCachePolicyNone;
[req setValue:[request valueForHTTPHeaderField:@"Authorization"] forHTTPHeaderField:@"Authorization"];
[req send];

这个方法不需要对TTURLRequest进行修改，简单有效。

安装pman

使用传说中的pear来安装pman

sudo pear install doc.php.net/pman

如果pear版本比较老，需要先升级pear才可以继续

sudo pear upgrade pear

pman使用方法

pman的使用方法很傻瓜，比如我们想查看strlen的帮助信息:

pman strlen

帮助文本的内容是彩色的，能和chm版本的php帮助文档媲美。pman的详细使用帮助如下

#pman --help
man, version 1.6c

usage: man [-adfhktwW] [section] [-M path] [-P pager] [-S list]
	[-m system] [-p string] name ...

  a : find all matching entries
  c : do not use cat file
  d : print gobs of debugging information
  D : as for -d, but also display the pages
  f : same as whatis(1)
  h : print this help message
  k : same as apropos(1)
  K : search for a string in all pages
  t : use troff to format pages for printing
  w : print location of man page(s) that would be displayed
      (if no name given: print directories that would be searched)
  W : as for -w, but display filenames only

  C file   : use `file' as configuration file
  M path   : set search path for manual pages to `path'
  P pager  : use program `pager' to display pages
  S list   : colon separated section list
  m system : search for alternate system's man pages
  p string : string tells which preprocessors to run
               e - [n]eqn(1)   p - pic(1)    t - tbl(1)
               g - grap(1)     r - refer(1)  v - vgrind(1)

还有一个好处是在vim里查看php帮助信息更方便了，结合完美

:!pman strlen

但是实际使用过程中有一些小小的意外流程，完全照搬git flow的模型不太容易处理好。好在git本身就很灵活，碰到问题基本上都有办法绕过去。下面是我总结的一些特例情况下的处理办法。

测试/共享单独一个feature

有时候我们需要将一个feature独立测试，或者share给多人一块开发，那么可以将这个feature推到远程git库上，这可以利用git flow的publish功能搞定:

git flow feature publish my_cool_feature

这会将 feature/my_cool_feature 分支push到远程git库，多人开发或者单独测试毫无压力。

feature在development分支测试完成，准备release的时候有另外一个未经测试的feature合并进来

已经完成测试的development被未经测试的提交污染了，这时候可以先本地回滚development分支，然后再进行git flow的release流程，例如:

git checkout development
git reset --hard 5cbadfe885d1eb514b3f07b3f269ca1a7f261e21   #假设测试通过的git rev是这个
git flow release start v1.0.1
git flow release finish v1.0.1

development上有个feature需要测试比较长时间，影响了一些耗时较短的feature发布

development分支上有个feature测试时间比较长一直释放不了，怎么办？—— 果断采用hotfix功能

git br -m feature/another_cool_feature hotfix/another_cool_feature

把耗时短的feature直接转换为hotfix，然后采用git flow的hotfix流程可以直接合并到master分支发布。

关于three20的中文资料不是太多，所以我搜集整理翻译了一些内容，放到了wiki上:

本人才疏学浅，翻译的内容难免出错或者词不达意，欢迎批评指正。

在远程服务器的设置

假定你需要部署的代码在/var/www/yoursite

cd /var/www/yoursite
git init .
git config receive.denyCurrentBranch ignore
git config --bool receive.denyNonFastForwards false
cd .git/hooks
wget http://utsl.gen.nz/git/post-update
chmod +x post-update

在本地git库中新增配置

[remote "prod"]
        url = your-ssh-username@your-host:/var/www/yoursite/

这样就算设置完成了。

如果你想把本地的代码推送到远程服务器，下面简单的步骤就可以做到

git pull
git push prod

注意事项

如果远程服务器上git的配置目录.git暴露在外部可访问的位置，请在web服务器上设置这个目录不可见。

Windows Phone 7 (WP7) 支持

JQM已经支持在WP7上运行，原来对WP7原生浏览器的支持度为C，也就是说部分核心功能不可用。而alpha4对这个做了大幅改动，支持度为A-，也就是说jquery mobile所有核心功能在WP7上都能运行良好。顺带受惠的还有桌面版的ie7, 8, 9，也能取得很好的运行效果。

名称空间data- 属性

jquery mobile大量使用html5的data属性来定义html标签，比如页头是 data-role=”header”，但是其它开发框架和插件也可能使用了data来标记某些特性，为避免冲突，alpha4新增了名称空间的概念，新增了jqmData,jqmRemoveData和jqmHasData这几个方法来访问data属性，和jquery的data()相比，这几个方法支持名称空间访问。

举个例子，原来使用data-icon来标记一个标签使用的图标，但是如果你使用了名称空间 foo,那么这个属性应该变成 data-foo-icon。为了不影响原来基于jquery mobile开发的程序，名称空间默认为空，保持不变。

统一的touch/mouse事件处理系统

新的touch/mouse“虚拟”事件，详情请参考The current state of touch events

phonegap支持增强

jquery mobile很适合和phonegap一起搭配来做原生的手机应用，但是在alpha3的时候，页面上的链接会被phonegap神奇的截断，有三个相关的问题：

• jQuery 1.5 截断了 file:// URLs
• jQuery 1.5.1 修复了 file://，但是它把HTML当成是XML, 所以需要在做ajax请求的时候指定dataType.
• 原来是不允许JQM加载跨域的JQM页面，但是这个版本新增了一个配置选项 $.mobile.allowCrossDomainPages 来支持http/https页面. 这个改动会导致URL可能出现这样的情况: file://dir1/dir2/myPhoneGapApp.html#https://myHomeServer.com/dir1/dir2/foo

以上这些问题在JQM alpha4里都得到了很好的解决，前提是使用jquery 1.5.1。

重要的升级注意事项

• 列表li的html结构变化，可以用a标签直接包住li中需要链接的整个部分，比如图片,文字段落。
• 由于WP7不支持动态插入viewport meta标签，所以现在推荐的方式是在每个页面上都放上meta标签，原来是由JQM的metaViewportContent 方法动态插入的，但是以后这个方法将被取消。为了避免影响已有的站点，JQM会在缺少meta标签的页面上直接插入了一个。
• 原生的select选单将成为默认选项，这是出于性能问题考虑，如果你希望在alpha4中继续使用JQM定制的select选单，那么需要加上 data-native-menu=”false”

典型代码示例

yepnope({
  test : Modernizr.geolocation,
  yep  : 'normal.js',
  nope : ['polyfill.js', 'wrapper.js']
});

当Modernizr.geolocation为真时，加载yep项也就是”normal.js”，否则加载nope项——可以同时加载多个文件。

yepnope和现有的xxx script loader有什么区别？

个人认为主要 是这两点：

• 可以同时处理javascript以及css
• 能够按条件加载

yepnope的全部参数

yepnope([{
  test : /* boolean(ish) - 你要检查真伪的表达式             */,
  yep  : /* array (of strings) | string - test为true时加载这项  */,
  nope : /* array (of strings) | string - test为false时加载这项 */,
  both : /* array (of strings) | string - 什么情况下都加载              */,
  load : /* array (of strings) | string - 什么情况下都加载              */,
  callback : /* function ( testResult, key ) | object { key : fn }   当某个url加载成功时执行相应的方法         */,
  complete : /* function   都加载完成了执行这个方法                                                   */
}, ... ]);

这里的参数都可以是array或者object，在加载多个资源文件的时候有用。

yepnope加载jquery的实例

yepnope([{
  load: 'http:/­/ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js',
  complete: function () {
    if (!window.jQuery) {
      yepnope('local/jquery.min.js');
    }
  }
}, {
  load: 'jquery.plugin.js',
  complete: function () {
    jQuery(function () {
      jQuery('div').plugin();
    });
  }
}]);

这段代码异步加载了jquery和jquery.plugin.js，甚至还对jquery加载失败的情况做了一个备用处理。

Mac

在Mac下，如果你喜欢用homebrew，那么只用一行就可以装好:

brew install node

否则，只能考虑手工安装了，步骤如下：

1. 安装Xcode
2. 安装git
3. 运行下面的命令行编译node.js

   git clone git://github.com/joyent/node.git
   cd node
   ./configure
   make
   sudo make install

Ubuntu

1. 安装依赖包

   sudo apt-get install g++ curl libssl-dev apache2-utils
   sudo apt-get install git-core

2. 运行下面的命令行:

   git clone git://github.com/joyent/node.git
   cd node
   ./configure
   make
   sudo make install

Windows

用cygwin来安装node，步骤如下:

1. 安装cygwin
2. 在cygwin的目录下，运行setup.exe安装下面列表中的包
   • devel → openssl
   • devel → g++-gcc
   • devel → make
   • python → python
   • devel → git
3. 运行cygwin
4. 运行下面的命令行:

   git clone git://github.com/joyent/node.git
   cd node
   ./configure
   make
   sudo make install

Centos

yum install gcc-c++ openssl-devel
wget --no-check-certificate https://github.com/joyent/node/tarball/v0.3.3
tar -xzvf ry-node-v0.3.3-0-g57544ba.tar.gz
cd ry-node-v0.3.3-0-g57544bac1
./configure
make
make install

Hello Node.js!

写一段小程序例如hello_node.js来验证安装是否正确：

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello Node.js\n');
}).listen(8124, "127.0.0.1");
console.log('Server running at http://127.0.0.1:8124/');

用node来运行这段代码

node hello_node.js
Server running at http://127.0.0.1:8124/

现在，用浏览器打开 http://127.0.0.1:8124/ ， 应该能够看到一条好消息。

参考文档

How to Install Node.js

Update

• 补充了在centos上安装Node.js的步骤

ssh -D 7070 -qnN [username]@[server]

但是ssh通道如果闲置了一段时间，就会自动断连，等我需要用到代理的时候往往又得蛋疼的重新跑一遍，非常麻烦。所以我刻苦学习前辈的经验，找到一个解决办法，在mac或linux下都可使用，分享如下:

• 把ssh配置为免密码登录，这个一搜一大把，略过不提
• 在/etc/inittab的最后一行加上:

  tunl:345:respawn:/usr/bin/ssh -D 7070 -qnN [username]@[server] > /dev/null 2>&1

• 让修改的inittab马上生效

  sudo init q

• 在/root/.ssh/config里加上几行

  Host *
    ServerAliveInterval 60

然后这个ssh通道就会自动重连了。

Update

• 增加了一个ssh配置，要不然这个进程虽然在，但是通道已经连不上了
• .ssh/config的配置是关键，/etc/inittab的配置只是让服务器开机即启动ssh通道

照着这个思路，捋起袖子就开干了。

用git-svn抓取插件代码

wordpress的插件svn库大且缓慢，如果直接用git-svn去clone代码，一定会慢死，所以我按照以前的笔记，用git从大型svn快速clone代码。

以code-prettify插件为例，首先需要读取这个插件创建时的版本号

svn log http://svn.wp-plugins.org/code-prettify|tail -4|head -1

得到了如下信息，获得一个版本号 318479

r318479 | plugin-master | 2010-12-03 20:12:29 +0800 (五, 03 12 2010) | 1 line

开始clone代码

git svn clone -s --prefix=svn/ -r318479:HEAD http://svn.wp-plugins.org/code-prettify

设置git仓库

首先把代码传了一份到github: https://github.com/volca/code-prettify

然后操作本地git仓库

git branch -m svn
git remote add origin git@github.com:volca/code-prettify.git
git checkout master

本地svn分支对应svn的远程仓库，本地master分支对应github的远程仓库

Happy time

现在可以按照平常的习惯在git下更改代码，然后用git push到github上。

如果需要更新代码到svn上，按这个流程操作就可以了：

git checkout svn
git merge master
git svn dcommit

如果需要发布wordpress插件的新版本，这个在svn里就是一个打tag的过程，用git-svn操作非常简单，下面的例子表示发布code-prettify插件的0.3版本：

git svn tag 0.3

伪造跨站请求比较难以防范，而且危害巨大，攻击者可以通过这种方式恶作剧，发spam信息，删除数据等等。这种攻击常见的表现形式有：

• 伪造链接，引诱用户点击，或是让用户在不知情的情况下访问
• 伪造表单，引诱用户提交。表单可以是隐藏的，用图片或链接的形式伪装。

比较常见而且也很廉价的防范手段是在所有可能涉及用户写操作的表单中加入一个随机且变换频繁的字符串，然后在处理表单的时候对这个字符串进行检查。这个随机字符串如果和当前用户身份相关联的话，那么攻击者伪造请求会比较麻烦。

yahoo对付伪造跨站请求的办法是在表单里加入一个叫.crumb的随机串；而facebook也有类似的解决办法，它的表单里常常会有post_form_id和fb_dtsg。

随机串代码实现

咱们按照这个思路，山寨一个crumb的实现，代码如下：

<?php
class Crumb {                                                                                                  

    CONST SALT = "your-secret-salt";                                                         

    static $ttl = 7200;                                                                                           

    static public function challenge($data) {
        return hash_hmac('md5', $data, self::SALT);
    }                                                                                                             

    static public function issueCrumb($uid, $action = -1) {
        $i = ceil(time() / self::$ttl);
        return substr(self::challenge($i . $action . $uid), -12, 10);
    }                                                                                                             

    static public function verifyCrumb($uid, $crumb, $action = -1) {
        $i = ceil(time() / self::$ttl);                                                                           

        if(substr(self::challenge($i . $action . $uid), -12, 10) == $crumb ||
            substr(self::challenge(($i - 1) . $action . $uid), -12, 10) == $crumb)
            return true;                                                                                          

        return false;
    }                                                                                                             

}

代码中的$uid表示用户唯一标识，而$ttl表示这个随机串的有效时间。

应用示例

构造表单
在表单中插入一个隐藏的随机串crumb

<form method="post" action="demo.php">
<input type="hidden" name="crumb" value="<?php echo Crumb::issueCrumb($uid)?>">
<input type="text" name="content">
<input type="submit">
</form>

处理表单 demo.php
对crumb进行检查

<?php
if(Crumb::verifyCrumb($uid, $_POST['crumb'])) {
    //按照正常流程处理表单
} else {
    //crumb校验失败，错误提示流程
}

代码示例

首先是代码示例，使用iphone或android之类的手机查看，效果更佳
google map with jquery mobile

关键代码说明

map.js

map.js定义了加载地图的方法initiallize()，这个和常规网页中加载google map是一致的，因此这里不再细述。

map.html

地图的实际页面，在这个页面中不能直接加载google map的api，因为它是采用document.write再次写入script来实现的，所以我们采用callback的方式来加载它，见下面的代码：

head.js(
        "map.js",
        function() {
            head.js("http://maps.google.com/maps/api/js?sensor=true&callback=initialize");
        }
    );

首先用head.js把initialize方法装载进来，然后用callback方式调用google map api。你可以试试用最平常的方式加载这段代码，看看有什么效果。

<script src="map.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=true&callback=initialize"></script>

这里是code-prettify的项目主页，我会把这个plugin的最新情况更新在这里。

code-prettify的特点

• 完全由javascript完成代码高亮，不占用服务器资源
• 使用简单，只要用<pre><code>和</code></pre>包住代码，发布即可，这是wordpress编辑器自带的quicktag。
• 没有添加额外的hook，所以不会和别的wordpress插件产生冲突，绿色无污染
• 载入速度很快，因为js是在页面尾部加载的，不会堵塞页面的载入！

代码高亮效果演示

eg:

<pre><code>
class BigBang {
    function blah() {
        echo "Hello ooso.net";
    }
}
</code></pre>

Effect:

class BigBang {
    function blah() {
        echo "Hello ooso.net";
    }
}

测试objective-c的code prettify效果

TTImageView *thumb = [[[TTImageView alloc] initWithFrame:CGRectMake(30, 30, 0, 0)] autorelease];
[thumb setAutoresizesToImage:YES];
[thumb setURL:@"http://farm4.static.flickr.com/3163/3110335722_7a906f9d8b_m.jpg"];
[self.view addSubview:thumb];

code-prettify下载

暂时把代码托管到github.com/volca/code-prettify，所以你可以直接使用git下载代码，或者直接从github下载现成的zip包。

代码非常简单，如果你有合适修正，可以试着用github推给我。

Update

另外安装了一个全新的wordpress测试，发现一些bug，因为wordpress默认对文本进行格式修正，在代码后面添加了很多br以及p标签，导致插件失效，所以我不得已用php替换了一些内容保证插件的正常运行。