左手's Blog
我是左手，行走在路上!
rails使用devise做登录验证
使用devise这个gem只需要简单几步就能做好用户注册登录等功能，能节省大量时间和精力。
1. 安装devise
# 编辑Gemfile加入以下内容
gem 'devise'
#安装gem
bundle install
#初始化devise
rails g devise:install
#初始化model为user
rails g devise user
#初始化视图
rails g devise:views
# 创建数据库
rake db:migrate
2. 使用
# 创建一个空的controller
rails g controller home index --no-helper --no-assets
# 编辑config/routes.rb将home index设为首页
root 'home#index'
# 编辑app/views/home/index.html.erb加入以下内容
<h1>Home#index</h1>
<% if user_signed_in? %>
hello, <%= current_user.username %><br />
<%= link_to('登出', destroy_user_session_path, :method => :delete) %>
<% else %>
<%= link_to('注册', new_registration_path(:user)) %>
<%= link_to('登录', new_session_path(:user)) %>
<% end %>
此时访问http://localhost:3000就可以使用注册登录功能了。
另附两个有用到的链接：
1. 添加用户名登录 How To: Allow users to sign in using their username or email address
2. 添加管理员角色 How To: Add an Admin Role
CentOS配置ruby on rails开发环境
最近用rails做了一个项目，分享一下开发环境搭建方面的信息。
一、基本信息
- 操作系统：CentOS 6.x
- 数据库：PostgreSQL 9.x
- Ruby版本：2.x
- Rails版本：4.x
二、基本软件
1. nodejs
rails中解析js的部份库会用到js引擎，nodejs较为高效，所以配置nodejs。
1). 下载nodejs Linux二进制包，nodejs的安装包可以在这里找到 http://www.nodejs.org/download/
wget http://nodejs.org/dist/v0.10.22/node-v0.10.22-linux-x86.tar.gz
2). 解压到/usr/local目录
tar -xzf node-v0.10.22-linux-x86.tar.gz -C /usr/local/
3). 建立软链接方便后期版本替换
ln -s node-v0.10.22-linux-x86 node
4). 添加环境变量
vim /etc/profile
# 在unset -f pathmunge之前加入如下两行，因为要用到pathmunge，所以要加在unset之前。
export NODE_HOME=/usr/local/node
pathmunge $NODE_HOME/bin
2. PostgreSQL
1). 添加9.x源，rpm源的列表可以在这里找到 http://yum.postgresql.org/repopackages.php#pg93
rpm -i http://yum.postgresql.org/9.3/redhat/rhel-6-i386/pgdg-centos93-9.3-1.noarch.rpm
2). 安装并初始化
yum install postgresql93-server postgresql93-contrib postgresql93-devel
service postgresql-9.3 initdb
chkconfig postgresql-9.3 on
3). 修改配置
cd /var/lib/pgsql/9.3/data/
vim pg_hba.conf
# 将原有 127.0.0.1 这一行中的indent修改为md5，并加下localhost这一行的配置
host all all localhost md5
host all all 127.0.0.1/32 md5
vim postgresql.conf
# 搜索listen_addresses，去掉注释修改localhost为*
listen_addresses = '*'
4). 添加环境变量
vim /etc/profile
export PSQL_HOME=/usr/pgsql-9.3
pathmunge $PSQL_HOME/bin
三、ROR安装配置
1. 安装rvm，
curl -L get.rvm.io | bash -s stable
# 输出以上命令，将会自动进行安装。
sed -i -e 's/ftp\.ruby-lang\.org\/pub\/ruby/ruby\.taobao\.org\/mirrors\/ruby/g' /usr/local/rvm/config/db
# 修改源为淘宝镜像，我的rvm安装在/usr/local目录中。完成后重启系统。
# 更多rvm使用可参考 http://ruby-china.org/wiki/rvm-guide
2. 使用rvm安装ruby
rvm install ruby-2.0.0
#修改gem默认源
gem source -a http://ruby.taobao.org/
gem source -r https://rubygems.org/
3. 创建项目以及对应的gemset
#创建项目路径
cd ~
mkdir demo
cd demo
#创建gemset
rvm gemset create demo
rvm gemset use demo
#安装rails
gem install rails
4. 添加postgresql帐号
su postgres
createuser -d demo
psql -d postgres
# 修改demo帐号的密码
ALTER USER demo WITH PASSWORD '123456';
# 退出
\q
5. 创建rails项目
rails new . -BT -d postgresql
# -B跳过bundle（后面手动进行）,-T跳过test-unit（建议使用RSpec)，-d 指定数据库为postgresql
6. 修改rails配置
vim Gemfile
#将第一行修改为淘宝源
source 'http://ruby.taobao.org'
#安装gem
bundle install
#安装pg库的时候会报错，PostgreSQL非系统标准路径，需指定pg_config安装
gem install pg -- --with-pg-config=/usr/pgsql-9.3/bin/pg_config
#编辑数据库配置
vim config/database.yml
# 找到development，修改username为demo，password为第4步指定的密码。如果不需要创建test数据库可以找到test的配置全部注释掉。
development: adapter: postgresql encoding: unicode database: demo_development pool: 5 username: demo password: 123456
7. 安装gem
bundle install
#安装到pg库的时候会报错，PostgreSQL非系统标准路径，需指定pg_config安装
gem install pg -- --with-pg-config=/usr/pgsql-9.3/bin/pg_config
8. 创建数据库，启动rails
rake db:create
rails s
经过以上几步，输入http://<ip address>:3000应该可以看到rails的默认页面了。
吐槽QQ空间
自从装了QQ，总习惯点开QQ空间，久之成瘾。最近改版之后弄得很郁闷，每次打开照片预览，“猜你喜欢”都正好挡住照片评论。
吐槽豆瓣4则
经常到豆瓣听民谣和DJ录音，用了大半年，有几点比较不爽，吐槽之
1. 奇葩的音乐人搜索
在music.douban.com上面的搜索，输入“宋冬野”，自动完成的提示里面有音乐人的小站，搜索的结果却另一翻模样。这个自动完成的功能是新加的，之前在这个位置搜不出音乐人。
如果你想搜索音乐人，得点到音乐人页面，拖到第二屏，用藏着的一个搜索框
2. 同一个页面多个专辑的播放不能互斥。
同一个页面，点开了一张专辑的歌曲，再播放另一张专辑的歌曲时。先前的播放不能自动停止。
3. 总是飘着的分享框
鼠标移动到播放列表中的rss图标，会出现一个悬浮的分享框。鼠标移到悬浮框，往右移出去，悬浮框会一直存在。在停止一首歌然后中键滚动的时候，肯定多出这个家伙在你眼前。打酱油的前端呀！
4. 分享的播放链接
分享的播放链接大约是一个这样的地址，http://site.douban.com/qikeqike8/room/1968340/?s=396923 会播放id为396923的歌曲。当一个页面列有大量歌曲的情况下，不知道当前播放的是哪一首。知道有个东西叫锚点么？不知道把页面滑动到正在播放的歌曲位置么？
css画箭头的两种方式
前端开发的时候，悬停弹出层经常会有小箭头。分享两种常见箭头实现方式。
1. 用边框做类似
.arrow1 {
width: 0;
height: 0;
overflow: hidden;
zoom: 1;
border: 8px solid transparent;
border-top-color: #FFF;
}
将元素大小设为0，将边框色设为透明只设置其中一个边的颜色，即可实现一个三角形。
2. 用css旋转正方式，用来画有边框的三角形
.arrow2 {
width: 10px;
height: 10px;
overflow:hidden;
zoom: 1;
position: absolute;
border-right: 1px solid #AAA;
border-bottom: 1px solid #AAA;
transform: rotate(45deg);
-o-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
background-color: #FFF;
}
通过css3旋转正方形，ie下可通过滤镜实现。需要注意的是如果当前系统安装的是ie9或ie10，通过模拟ie8来调试是看不到转滤镜的。
一个实例效果:
http://www.useragentman.com/IETransformsTranslator/ 一个在线转换的网址，用来生成IE旋转滤镜参数。
附实例代码：
<!DOCTYPE html>
<html><!--[if lte IE 8]><html class="ie ltie9"><![endif]--><!--[if gte IE 9]><html class="ie ie9"><![endif]-->
<head>
<meta charset="UTF-8">
<title>css三角形</title>
<style>
.box1, .box2 {
width: 200px;
height: 200px;
padding: 20px;
float:left;
margin-right: 5px;
background-color: #a4edae;
position: relative;
}
.square1 {
background-color: #FFF;
width: 120px;
height: 60px;
display: block;
}
.arrow1 {
width: 0;
height: 0;
overflow: hidden;
zoom: 1;
border: 8px solid transparent;
_border-color:tomato;
_filter:chroma(color=tomato);
border-top-color: #FFF;
vertical-align: -7px;
*vertical-align: 0;
margin-left: 10px;
}
.square2 {
background-color: #FFF;
border: 1px solid #AAA;
width: 120px;
height: 60px;
position: absolute;
top: 20px;
left: 20px;
}
.arrow2 { width: 10px; height: 10px; overflow:hidden; zoom: 1; position: absolute; top: 76px; left: 40px; border-right: 1px solid #AAA; border-bottom: 1px solid #AAA; transform: rotate(45deg); -o-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); background-color: #FFF; }
.ltie9 .arrow2 { transform: rotate(0deg); top: 75px; filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865474, M12=-0.7071067811865477, M21=0.7071067811865477, M22=0.7071067811865474, SizingMethod='auto expand'); }
</style>
</head>
<body>
<div class="box1">
<div class="square1"></div><i class="arrow1"></i>
</div>
<div class="box2">
<div class="square2"></div><i class="arrow2"></i>
</div>
</body>
</html>
编译macvim支持ruby 2.0
默认从https://code.google.com/p/macvim/下载的macvim是ruby1.8的支持，某些插件不好使，折腾了下编译一个支持ruby2.0的版本。
1. 获取macvim源代码
git clone https://github.com/b4winckler/macvim.git
2. 设置CC环境变量
export CC=clang
3. 配置及编译
./configure --with-features=huge \ --enable-rubyinterp \ --enable-pythoninterp \ --enable-cscope \ --with-macarchs=x86_64 \ --with-compiledby=user@domain
make
编译后的文件在src/MacVim/build/Release目录下，将MacVim.app复制到/Applications目录下即可。
通用linux后台运行shell脚本
经常遇到开启后需要占一个终端窗口的应用。写了一个通用的后台运行脚本用nohup在后台运行，将运行pid输出到文件，可以查看nohup.out中的输出内容。适用于GoAgent、grant watch、rails开发模式等。可以把脚本加在~/.bash_profile中，实现登陆后自动启动。修改PROGNAME中的内容为要运行的程序名，修改run中的运行命令为你要执行的命令即可。
#!/bin/sh
PID=0
DIR=`dirname $0`
PIDFILE=$DIR/nohup.pid
OUTFILE=$DIR/nohup.out
PROGNAME='GoAgent'
run() {
nohup $DIR/proxy.py>>$OUTFILE 2>&1 & echo $!>$PIDFILE
}
init() {
if [ -f $PIDFILE ]; then
PID=`cat $PIDFILE`
fi
}
check() {
if [ $PID -eq 0 ]; then
return 1
else
kill -0 $PID 2>/dev/null
fi
}
start() {
init
check
if [ $? -eq 0 ]; then
echo "$PROGNAME is run!" && exit 1
else
run
echo "Start $PROGNAME!" && exit 0
fi
}
silent() {
init
check
if [ $? -eq 0 ]; then
exit 1
else
run
exit 0
fi
}
restart() {
init
check
if [ $? -eq 0 ]; then
kill -9 $PID>/dev/null 2>&1
fi
run
echo "Restart $PROGNAME!" && exit 0
}
stop() {
init
check
if [ $? ]; then
kill -9 $PID>/dev/null 2>&1
echo "$PROGNAME is stop!" && exit 0
else
echo "$PROGNAME is not run!" && exit 1
fi
}
status() {
init
check
if [ $? -eq 0 ]; then
echo "$PROGNAME is run!" && exit 0
else
echo "$PROGNAME is not run!" && exit 1
fi
}
output() {
if [ -f $OUTFILE ]; then
watch -n 1 tail $OUTFILE
else
echo "$OUTFILE is not find!" && exit 1
fi
}
clean() {
if [ -f $OUTFILE ]; then
rm -f $OUTFILE
fi
if [ -f $PIDFILE ]; then
rm -f $PIDFILE
fi
echo 'Clean success!' && exit 0
}
case "$1" in
start)
$1
exit 0
;;
silent)
$1
exit 0
;;
restart)
$1
exit 0
;;
stop)
$1
exit 0
;;
status)
$1
exit 0
;;
output)
$1
exit 0
;;
clean)
$1
exit 0
;;
*)
echo $DIR
echo 'Usage: {start|stop|restart|silent|status|output|clean}'
;;
esac
命令说明：
start 启动
silent 安静模式启动（无输出）
stop 停止
restart 重启
status 查看运行状态
output 查看输出
clean 清除out和pid文件
用http代理屏蔽isp广告
最近装了“*城宽带”，发现打开网站时还会弹出广告。打电话给客服沟通，客服表示不知道他们有广告，声称是我本人电脑设置有问题。很无耐，写一代理用来屏蔽广告。
下载地址：http://pan.baidu.com/share/link?shareid=3835585554&uk=590772501#dir/path=%2Fpub%2Fother下载adbreak.zip
使用方法：
1. 解压软件包，点击adbreak.bat
软件启动后如下图：
2. 设置浏览器代理脚本配置，以IE为例。(firefox使用autoproxy、chrome使用proxy-switchysharp将指定网址的代理定向到 8337端口，使用goagent也可以直接修改GoAgent Pac文件，参照adbreak.pac）
工具->Internet选项->链接->局域网设置 勾选 “使用自动脚本配置” 在下面的“地址”这一栏填入 http://127.0.0.1:8337/break.pac
3. 设置屏蔽的网址：
编辑break.pac脚本，在 disable_url 中添加要屏蔽的网址。默认带的几个网址是用来屏蔽“*城宽带”这边的几个广告的。
4. 如何知道广告的网址？
首先建议使用抓包工具，如果没有抓包工具可以使用adbreak自带的代理来查看地址。
设置方法：将第2条中的设置地址改为http://127.0.0.1:8337/proxy.pac。
这时再用浏览器上网，所有的请求是走的adbreak自带的http代理访问，会将网址打印在地址栏中。使用浏览器浏览网页，弹出广告后，查看adbreak中的地址列表，找出广告地址。（你访问网址被拦截后的第一条）
由于cmd自带的缓冲区显示内容有限，需要将修改缓冲区大小，以显示足够多的请求地址。
设置方法：鼠右键点击adbreak标题栏，选择属性->布局 “将屏幕缓冲区大小”中的“高度”设为 5000
说明：程序使用nodejs运行，启用后占用 8337、8338 两个端口，8337端口有break.pac和proxy.pac两个文件。
使用break.pac文件时，当弹出ISP的广告时，break.pac脚本识别到广告地址将这个请求定向到8337端口，这时原请求地址被附加在广告请求地址的Referer中，代理读取referer地址，将请求重定向到原地址。
使用proxy.pac时，请求请重定向到8338端口，这时所请求的文件通过adbreak从网络获取，可以得到每一个请求的地址。用来从地址列表中找出广告的地址。
附adbreak的coffee源代码：
http = require 'http'
url = require 'url'
http.createServer (req, res)->
request_url = req.url
request_pac = request_url.match /\/((?:break|proxy).pac)((?:\?.*)?)/
if request_pac isnt null
console.log "[#{req.method}] #{request_url}"
res.writeHead 200, 'Content-Type': 'application/x-ns-proxy-autoconfig'
pac = require('fs').createReadStream request_pac[1]
pac.pipe res
pac.on 'end', ->
res.end()
else
referer = req.headers.referer
if referer
console.log "[#{req.method}] -referer- #{request_url}"
res.writeHead 302, 'Location': referer
else
res.writeHead 200, 'Content-Type': 'text/plain'
console.log "[#{req.method}] -disable- #{request_url}"
res.write 'no referer'
res.end()
return
.listen 8337, '0.0.0.0'
console.log 'start break server by http://127.0.0.1:8337'
http.createServer (req, res)->
# 请求地址
request_url = req.url
# 请求记录
console.log "[#{req.method}] #{request_url}"
# 请求数据
post_data = ''
request_option = url.parse request_url
request_option.method = req.method
request_option.headers = req.headers
# 接收数据
req.on 'data', (chunk)->
post_data += chunk
return
# 结束请求
.on 'end', ->
if request_option.method is 'POST' then proxy_request.end post_data else proxy_request.end()
return
# 开始代理请求
proxy_request = http.request request_option, (result)->
# header
headers = result.headers
# statusCode
statusCode = result.statusCode
# 写入头
res.writeHead statusCode, headers
# 写入代理数据
result.on 'data', (chunk)->
res.write chunk
return
# 数据结束
result.on 'end', ->
res.end()
return
return
# 错误处理
.on 'error', (error)->
res.end "remote http.request error#{error}"
return
return
.listen 8338, '0.0.0.0'
console.log 'start proxy server by http://127.0.0.1:8338'
附使用截图：
“*城宽带”拦截网络访问弹自家广告抓包截图：
可以看到访问www.jd.com被强制转向到了count.chanet.com.cn上面，后面连续跳转了多个广告请求，还有骗京东自家的推广点击的。在第11个请求时，被定向到了京东首页。
代理的拦截效果截图：
访问优酷，被重定向到了ye87.net
ye87.net被代理拦截重新定向到了youku
adbreak打印的重定向信息
win平台编译64位gvim
接上篇：我编译的gvim7.4a BETA 64位版本(win平台)
1. 安装visualstudio 2012，hg
2. 获取源代码
hg clone https://vim.googlecode.com/hg/ vim
hg update v7-4a
3. 源代码修改
启用非等宽字体支持，修改该项后可使用微软雅黑字体。
编辑 vim/src/os_mswin.c 查找
/* Ignore non-monospace fonts without further ado */
if ((ntm->tmPitchAndFamily & 1) != 0)
return 1;
注释即该段代码即可。
关微软雅黑字体：
vim显示非等宽字体是有bug的所以关掉了。汉字都是方块字全部等宽的，在开启非等宽字体支持后我们可以用微软雅黑显示汉字。在vimrc中添加如下配置：
set gfw=youyuan:h10.5:cGB2312
4. 编译
打开vs命令提示行
切换到源码目录
编译命令：
nmake -f Make_mvc.mak PYTHON=C:\Python27 DYNAMIC_PYTHON=yes PYTHON_VER=27 MBYTE=yes USERNAME=leftcold USERDOMAIN=gmail.com GUI=yes
说明：将USERNAME USERDOMAIN修改为你的邮箱名、邮箱域，可以定制vim中编译人信息。将GUI选项修改为no可以编译命令行版本。PYTHON为自己的python安装路径，将PYTHON选项去掉，编译的将是不带python支持的版本。
参考链接：https://groups.google.com/forum/#!topic/vim_dev/N8jzif4e9L8
http://nootn.com/blog/Tool/22/
https://github.com/asins/vim
分享我编译的gvim7.4a BETA 64位版本(win平台)
看到vim已经放出7.4a BETA版了，下载源码自己编译了一份64位的，添加了python支持、修正等宽字体（可以使用微软雅黑）。
下载地址：http://pan.baidu.com/share/link?shareid=3835585554&uk=590772501#dir/path=%2Fpub%2Fvim%2Fgvim7.4
下载vim74a_m_all.zip这个文件即可。