第一步:安裝必須的軟件
在linux下生成圖片需要圖片處理軟件ImageMagick的Ruby語言RMagick庫支持。安裝RMagick最麻煩,我查了N多資料試了N次才安裝成功。
1. 安裝ImageMagick:sudo apt-get install imagemagick
2. 查看安裝結果:dpkg -l | grep magick
3. 更新軟件包列表:sudo apt-get update
4. 安裝圖片處理軟件包libmagick9-dev:sudo apt-get install libmagick9-dev ruby1.8-dev
5. 安裝接口軟件包RMagick:sudo gem install rmagick
6. 說明:如果出現問題或者錯誤請執行下面命令:sudo apt-get remove --purge libmagick9-dev
在irb里require 'RMagick'。如果返回true,表示安裝成功。
第二步:編碼
在models目錄創建一個proof_image.rb
require 'rubygems'
require 'RMagick'
class ProofImage
include Magick
attr_reader :text, :image
Jiggle = 15
Wobble = 15
def initialize(len=4)
chars = ('a'..'z').to_a # + ('0'..'9').to_a
text_array=[]
1.upto(len) {text_array << chars[rand(chars.length)]}
#background_type = "granite:" #花崗巖
#background_type = "netscape:" #彩條
#background_type = "xc:#EDF7E7" #指定背景色,例:xc:red
#background_type = "null:" #純黑
granite = Magick::ImageList.new('null:')
canvas = Magick::ImageList.new
canvas.new_image(32*len, 50, Magick::TextureFill.new(granite))
gc = Magick::Draw.new
gc.font_family = 'times'
gc.pointsize = 40
cur = 10
text_array.each{|c|
rand(10) > 5 ? rot=rand(Wobble):rot= -rand(Wobble)
rand(10) > 5 ? weight = NormalWeight : weight = BoldWeight
gc.annotate(canvas,0,0,cur,30+rand(Jiggle),c){
self.rotation=rot
self.font_weight = weight
self.fill = 'green'
}
cur += 30
}
@text = text_array.to_s
@image = canvas.to_blob{
self.format="GIF"
}
#生成圖片文件
#text.text(0, 0, " ")
#text.draw(canvas)
#canvas.write('test.gif') #圖片位于項目根目錄下。也可以使用linux中的絕對路徑如:/home/chengang/test.gif
end
end
在一個controller里加入一個方法,方法的作用是向網頁提供圖片數據。我選擇創建一個專門的UtilController。
class UtilController < ApplicationController
def proof_image
proof_image = ProofImage.new
session[:proof_text] = proof_image.text
send_data proof_image.image, :type => 'image/jpeg', :disposition => 'inline'
end
end
以下是在頁面中的調用代碼:
輸入驗證碼:<%=text_field(:proof, :text, :maxlength=>4) %>
<img id="img" src="/chen/util/proof_image">
<a href="#" onclick="changeImage();return false;">換一個驗證碼</a><br/>
其中changeImage()是一個javascript函數,因為換圖片時必須改變<img的src,否則瀏覽器不會執行UtilController的proof_image方法,而是從緩存中取得圖片數據。
function changeImage(){
$("img").src = "/chen/util/proof_image?tmp=" +new Date().getTime(); // Math.random();
}
我的環境:ubuntu 7.04 + Rails 1.2.3 +Ruby 1.8.5