聚會時間公告: 因應COSCUP 2011, Kalug 8月份休會一次

三月 18, 2015

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» Ruby Deploy With Capistrano 碰到 SSH Connection Closed

CapistranoLogo

Ruby 開發環境最常用的 Deploy 工具就是 Capistrano,讓開發者可以快速部署程式碼,在部署進行中,由於大量的 js 及 css 需要處理,所以花最長的時間就是 assets:precompile,執行 cap deploy 就會發現卡在底下錯誤訊息

** [whenever:update_crontab] exception while rolling back: Net::SSH::Disconnect, connection closed by remote host *** [deploy:update_code] rolling back * executing “rm -rf /home/deploy/nami/releases/20150317135422; true” servers: [“xxxxx.tw”] ** [deploy:update_code] exception while rolling back: Net::SSH::Disconnect, connection closed by remote host

遇到這問題顧名思義就是 ssh timeout,造成原因就是由於 assets:precompile 執行時間過長,所以 Client 端的 ssh 就斷線,要解決這其實不難,請在 Server 端的 sshd 設定檔加入底下參數

ClientAliveInterval 120
ClientAliveCountMax 3

我們來看看 ClientAliveInterval 跟 ClientAliveCountMax 分別代表什麼意思,ClientAliveInterval 以上面例子來說,就是如果 120 秒內沒有收到 Client 端任何訊息,則 Server 會透過加密通道發送 Requerst 並且等待 Client 回應,而 ClientAliveCountMax 的用途就是,如果 120 秒沒收到回應,則繼續發送 Request 的次數,所以看到上面設定,就可以知道 120 * 3 秒後都沒有收到 Client 回應,則 SSH Server 就會強迫斷線,也就是會看到 Net::SSH::Disconnect。SSH 的設定檔位置為 /etc/ssh/sshd_config,完成後請記得重新啟動 sshd。

伺服器設定完成後,我們來看看 Client 端也要設定,請打開 /etc/ssh/ssh_config 輸入底下參數

ServerAliveInterval 120

讓 Client 端,每 120 秒可以送 response 給 Server 端,這樣就可以保持 ssh 連線。

參考:SSH Connection Closed While Deploying With Capistrano

三月 19, 2014

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» Using Capistrano to deploy current branch

CapistranoLogo

Capistrano 是一套用 Ruby 語言所寫的 Deploy Tool,可以用來管理多台伺服器自動化流程,在 Rails 專案內都會使用這套 Deploy Tool,也方便管理遠端機器。這次有個問題是,假設我們在 Staging 或 Production 設定檔分別定義了 :branch 變數如下

set :branch, "master"
set :env, "production"

這時候可以透過底下指令來 Deploy 到遠端伺服器

$ bundle exec cap production deploy

假設這次想要 deploy 不同 branch 到 Production Server,就必須修改 production.rb 設定檔,每次不同 branch 就要改一次,會比較麻煩,要解決此問題只需要將上述程式碼改成可以用 command line 方式管理

set :branch, fetch(:branch, "master")
set :env, fetch(:env, "production")

將指令換成

$ bundle exec cap -S branch="my-branch" production deploy

也就可以達成目的了。多人同時在開發專案時,一定會有很多 feature 或 issue branch,開發者會希望目前在哪個 Branch,程式碼 commit 後,就直接用 cap deploy,將現在的 Branch 程式碼 Deploy 到伺服器,方便其他人測試,要達成此功能,請修改 deploy.rb 加入底下程式碼

# Figure out the name of the current local branch
def current_git_branch
  branch = `git symbolic-ref HEAD 2> /dev/null`.strip.gsub(/^refs\/heads\//, '')
  branch
end

# Set the deploy branch to the current branch
set :branch, fetch(:branch, current_git_branch)

完成後,請將 config/deploy/*.rb 內的 set :branch 全部拿掉,這樣切到任何 Branch,就直接下 cap deploy 即可,,當然也可以透過 command line 方式指定 Branch 來 Deploy。最後附上 Capistrano 的目錄架構圖

├── Capfile
├── config
│   ├── deploy
│   │   ├── production.rb
│   │   └── staging.rb
│   └── deploy.rb
└── lib
    └── capistrano
            └── tasks

參考文章:

三月 11, 2014

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» Ruby Compass and Sass Auto Testing Environment

Compass Home   Compass Documentation

Compass 是一套 CSS Authoring Framework,也是基於 Sass 語法的一套 Framework,先前寫了 GulpCompass Plugin,在針對自動化測試時候出現版本相依性不同,造成無法自動測試成功。自動化測試目前跟 Github 最常搭配的就是 Travis CI 或者是 Codeship,當然如果非 Open source 專案可能就要自己架設 CI 伺服器,個人推薦就是 Jenkins。這次遇到的問題其實跟 Ruby Gem 版本相依性有關,由於要測試 Compass 所有 Command 語法,所以使用了 Susy + sass + compass,如果在 .travis.yml 內直接寫

language: node_js
node_js:
    - "0.10"
before_install:
    - gem update --system
    - gem install sass
    - gem install compass
    - gem install susy
    - gem install modular-scale

這樣編譯出來的結果會噴底下錯誤訊息

/home/rof/.rvm/rubies/ruby-1.9.3-p327/lib/ruby/site_ruby/1.9.1/rubygems/core_ext/kernel_require.rb:55:in `require’: cannot load such file — sass/script/node (LoadError) from /home/rof/.rvm/rubies/ruby-1.9.3-p327/lib/ruby/site_ruby/1.9.1/rubygems/core_ext/kernel_require.rb:55:in `require’ from /home/rof/.rvm/gems/ruby-1.9.3-p327/gems/compass-0.12.2/lib/compass/sass_extensions/monkey_patches/browser_support.rb:1:in `‘ from /home/rof/.rvm/rubies/ruby-1.9.3-p327/lib/ruby/site_ruby/1.9.1/rubygems/core_ext/kernel_require.rb:55:in `require’

會造成這樣的原因就是目前 sass、compass、susy 都不能安裝最新版本。Compass 目前版本是 0.12.3 只有支援 Sass 3.2.14 版本,但是 Sass 前幾天剛推出 3.3.1 版本,另外 Susy 也是一樣問題,由於 Susy 推出 2.0.0 版本需要 Sass 3.3.0 版本以上才可以使用,所以針對 Compass 變成只能指定版本測試,否則會得到上述錯誤訊息,請將 .travis.yml 修正為

language: node_js
node_js:
    - "0.10"
before_install:
    - gem update --system
    - gem install sass --version 3.2.14
    - gem install compass --version 0.12.3
    - gem install susy --version 1.0.9
    - gem install modular-scale

這樣就可以正常跑出測試結果。

二月 27, 2014

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» Ruby 安裝 debugger package 發生 No source for ruby 錯誤

Ruby_logo

當您在特定 Ruby 版本下安裝 debugger gem 套件,會碰到底下錯誤訊息

Using debugger-ruby_core_source (1.2.4) 
Installing debugger-linecache (1.2.4) with native extensions 
Gem::Installer::ExtensionBuildError: ERROR: Failed to build gem native
extension.

checking for vm_core.h... no
checking for vm_core.h... no
Makefile creation failed
**************************************************************************
No source for ruby-2.0.0-p451 provided with debugger-ruby_core_source
gem.
**************************************************************************

會發生此錯誤的最大原因是在 debugger-ruby_core_source 原始碼內,只有包含特定少數的 Headers,解決此錯誤也非常簡單,可以直接將目前的 ruby 版本 headers 安裝到 debugger-ruby_core_source 目錄內即可,透國 rake 就可以完成

$ cd /usr/local/rvm/gems/ruby-2.0.0-p451/gems/debugger-ruby_core_source-1.2.4/lib/debugger/ruby_core_source
$ rake add_source VERSION=2.0.0-p451 --trace

執行完成後,就可以回到原專案目錄透過 bundle install 繼續安裝套件。

二月 6, 2014

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» 在 Ubuntu 或 Debian 上跑 Ruby on Rails + Nginx

Ruby_logo

本篇用來紀錄學習 Ruby on Rails 所需要的開發環境,請不要輕易嘗試使用 Windows 當開發環境,因為真的很不好裝,又很難除錯,所以作者建議開發環境一定要有 Linux 機器,如果是個人電腦用 Mac 也沒這問題。用 Rails 可以快速開發 Web 搭配 MySQL 資料庫,完成後可以透過 Capistrano 工具幫助 Deploy 到 Production Server。底下會一一介紹如何在 Debian 機器上架設好 Ruby + Nginx 環境

安裝 RVM

相信大家如果開發過 Node.js 一定聽過 nvm 這套 Node.js 版本管理工具,那 Ruby 呢,就是透過 RVM 來管理 Ruby 版本,安裝方式如下:

$ aptitude install build-essential openssl libreadline6 libreadline6-dev curl git-core zlib1g zlib1g-dev libssl-dev libyaml-dev libsqlite3-dev sqlite3 libxml2-dev libxslt-dev autoconf libc6-dev ncurses-dev automake libtool bison subversion pkg-config
$ \curl -sSL https://get.rvm.io | bash -s stable
# install 2.0.0 version and set default version
$ rvm install 2.0.0 --default

安裝好之後可以使用 rvm ls 來看看本地端裝了哪些版本

rvm rubies

=* ruby-2.0.0-p353 [ x86_64 ]
   ruby-2.1.0 [ x86_64 ]

# => - current
# =* - current && default
#  * - default

如果不需要 gem 安裝 rdoc 和 ri 可以透過底下設定

$ echo "gem: --no-ri --no-rdoc" > ~/.gemrc

最後安裝 railsbundler

$ gem i bundler rails

建立 Rails 專案

透過 rails 指令就可以快速初始化專案

$ cd /var/www
$ rails new web_01
$ cd web_01

如果搭配 MySQL 服務請務必安裝底下套件

$ aptitude install -y libmysqlclient-dev
$ gem install mysql2

這時候就可以修改 config/database.yml 資料庫連線資訊,並且在 ./Gemfile 內容加入 gem 'mysql2'

安裝 Thin

Ruby 有好幾套伺服器在業界都非常多人用,像是 Passenger, Mongrel, Thin, Unicorn 等,這次會介紹 Thin 安裝方式

$ gem install thin
$ thin install
$ /usr/sbin/update-rc.d -f thin defaults

完成上述設定後,系統會產生 /etc/init.d/thin 其實跟一般伺服器很像,設定檔都是放在 /etc/thin 目錄下,下面 command 用來產生各網站設定檔,假設有網站根目錄在 /var/www/web_01

# or: -e production for caching, etc
$ thin config -C /etc/thin/web_01 -c /var/www/web_01 --servers 3 -e development

打開 /etc/thin/web_01

chdir: /var/www/web_01
environment: development
address: 0.0.0.0
port: 3000
timeout: 30
log: /root/log/thin.log
pid: tmp/pids/thin.pid
max_conns: 1024
max_persistent_conns: 100
require: []
wait: 30
threadpool_size: 20
servers: 3
daemonize: true

啟動 thin 伺服器

$ /etc/init.d/thin start

你可以看到跑了 3 個 port 分別是 3000, 3001, 3002

安裝 Nginx

這是最後一步驟,只完成這項就大功告成,首先建立 nginx vhost 檔案 /etc/nginx/sites-available/ 並且 link 到 /etc/nginx/sites-enable/,內容為

upstream web.localhost {
  server 127.0.0.1:3000;
  server 127.0.0.1:3001;
  server 127.0.0.1:3002;
}
server {
  listen   80;
  server_name web.localhost;

  access_log /var/www/web_01/log/access.log;
  error_log  /var/www/web_01/log/error.log;
  root     /var/www/web_01;
  index    index.html;

  location / {
    proxy_set_header  X-Real-IP  $remote_addr;
    proxy_set_header  X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header  Host $http_host;
    proxy_redirect  off;
    try_files /system/maintenance.html $uri $uri/index.html $uri.html @ruby;
  }

  location @ruby {
    proxy_pass http://web.localhost;
  }
}

存檔後透過 link 啟動此設定

$ ln -nfs /etc/nginx/sites-available/web_01 /etc/nginx/sites-enabled/web_01

最後重新啟動全部伺服器

$ /etc/init.d/thin restart
$ /etc/init.d/nginx reload
$ /etc/init.d/nginx restart

打開瀏覽器鍵入 http://web.localhost 就可以成功看到網站了

八月 15, 2013

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» Cross Site Request Forgery in JS Web Apps and CodeIgniter PHP Framework

Cross Site Request Forgery 簡稱 CSRF 是網路上最常見的攻擊方式,由於前端的盛行,現在開發網站偏向前後端拆開,前端使用大量的 Javascript 及 CSS3 效果,後端則是使用 PHP, Ruby, Python… 等,前端如何拿到資料庫資料呢,必需透
過 AJAX 方式來存取,常見的後端 API 會設計成 RESTful (GET/PUT/POST/DELETE),後端為了擋住 CSRF 攻擊,所以限定了特殊 Content-Type Header,前端需要帶 application/json 給後端才可以拿到資料,這只能透過 Ajax requests 才可以做到。

但是很不幸的是使用者還是透過 header injection 方式來達到目的 (Flash exploits),所以透過判斷 Content-Type Header 這方式是不夠的。正確的防護方式就是在每個 request 給上一組 token,因為 same origin policy 關係,攻擊者無法拿到此 token,無法達到攻擊效果。

如果你是 Ruby 愛好者,可以透過 Rack CSRF 來產生 token,並且放在網頁 Head 內

在 jQuery 部份,必須使用 ajaxPrefilter 將每個 Request 加上 CSRF token 傳給伺服器

var CSRF_HEADER = 'X-CSRF-Token';
var setCSRFToken = function(securityToken) {
  jQuery.ajaxPrefilter(function(options, _, xhr) {
    if ( !xhr.crossDomain ) xhr.setRequestHeader(CSRF_HEADER, securityToken);
  });
};
setCSRFToken($('meta[name="csrf-token"]').attr('content'));

如果是在 Head 內加上 csrf-token 就必須透過上述作法,但是 CodeIgniter 並非是使用此方式,要將 CSRF 打開可以透過 config/config.php 內的

$config['csrf_protection'] = FALSE;
$config['csrf_token_name'] = 'csrf-token';
$config['csrf_cookie_name'] = 'csrf-token';
$config['csrf_expire'] = 7200;

將 csrf_protection 改成 true,這樣透過 from helper 產生的 form 表單,你會發現會多出 hidden input value,這樣送出表單的時候就可以驗證此 token 是否正確,如果你不是透過 CI form 表單產生,那也可以在 Client 端抓取 csrf-token 的 Cookie 資料,因為 CI 也會同時將 csrf-token value 寫入 Cookie,Cookie 可以透過 jQuery cookie plugin 來讀取。

另外如果你也想透過最上面 head 方式來處理,CI 那邊也可以透過 $this->security->get_csrf_hash() 來取 hash 資料,將此資料放到 html head 裡面即可。

四月 25, 2013

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» Fabric 管理多台 Linux 機器的 command tool

python-logo-master-v3-TMpython-logo-master-v3-TM

相信 Administrator 管理過兩台以上的 Linux Server 都一定會找 tool 讓多台機器同時執行指令,這也應用在 Deploy 任何 application 到多台機器或者是同時更新系統套件…等,網路上有蠻多套 command line tool 像是 capistranoFabricpsshdsh…等都,本篇會以 Python 所推的 Fabric 來做介紹。另外 Ruby 所寫的 capistrano tool 也是不錯的選擇,這兩套其實大同小異,可以將 Deploy 的邏輯寫成單一 file 再透過 task 定義來決定執行的工作。當然你也可以透過此 tool 來管理 local 端動作,但是這有點多此一舉,因為基本的 Shell 就可以完成了,如果熟悉 Python 則選 fabric,如果喜歡寫 Ruby 則可以試試看 capistrano。

安裝方式(Installation)

如果是 CentOS 系列可以透過 yum 套件管理,UbuntuDebian 則是透過 aptitude 方式安裝。

Yum

# install python pip tool and fabric command
yum -y install python-pip
pip-python install fabric

APT

# install python easy_install
aptitude -y install python-pip
# install fabric command
pip install fabric

安裝 capistrano 可以透過 Ruby gem。

$ gem install capistrano

基本介紹

Fabric 可以透過 command line 或者是讀取 fabfile.py 檔案方式來執行,fabfile.py 務必放在執行 fab command 的目錄底下,也就是的命令列所在位置 。假設目前在 /home/appleboy 目錄下,就必須將 fabfile.py 存放在 /home/appleboy。

簡易設定 /home/appleboy/fabfile.py,內容

def hello():
    print("Hello world!")

該目錄底下執行

$ fab hello
Hello world!

Done.

如果不透過 fabfile.py 檔案的話,你直接打 fab 會得到 Couldn’t find any fabfiles!,看到這訊息沒關係,一樣可以用指令方式來達成上面的結果。學習 fabric 前,有一個很必要的條件,就是必需熟悉 Linux command 及 Shell script 用法,個人推薦鳥哥的網站,把基礎文件都看過後,就沒有任何 Linux 系統可以難倒你。如何用 fab command 直接得到上述的結果呢?

$ fab -p xxxx -H localhost -- 'echo "Hello world!";'

上述指令會產生下面結果

[localhost] Executing task '<remainder>'
[localhost] run: echo "Hello world!";
[localhost] out: Hello world!
[localhost] out:
Done.
Disconnecting from localhost... done.

執行 fab 就像是透過 ssh 登入機器,需要帳號及密碼,執行當下就必須提供使用者帳號及密碼,如果沒給參數,預設就是執行該 command 的使用者,-p 則是給密碼,這樣就不會詢問密碼了,-H 是指定要對哪個 host 執行該命令,也許同時 3 台機器,-H 請改寫成 -H web1,web2,web3。要換其他使用者直接加上 -u 參數

$ fab -u deploy -p xxxx -H localhost -- 'echo "Hello world!";'

接下來聊聊該如何寫 fabfile.py,fab 有分 local 端或 Host 端執行,如果只用在 local 端就跟寫 Shell script 沒啥不同,fabric 提供了 local function 執行 local command。對於專案而言,你可以建立 fabfile.py 設定檔,裡面寫入

from fabric.api import local

def prepare_deploy():
    local("git add -p && git commit")
    local("git push")

執行 fab prepare_deploy 會將專案已修改的 commit 到 server,當然你也可以拆開來執行

from fabric.api import local

def clone():
    local("git clone git@github.com:appleboy/minify-tool.git")

def commit():
    local("git add -p && git commit")

def push():
    local("git push")

def prepare_deploy():
    commit()
    push()

大家可以依照專案需求來定義工作項目,好讓團隊所有的成員都可以使用。

錯誤處理

看到上面例子,可以知道透過 fab clone 來初始化專案,執行後,發現多了 minify-tool 目錄,但是再執行同樣指令一次呢?會發現出現底下錯誤訊息

[localhost] local: git clone git@github.com:appleboy/minify-tool.git
fatal: destination path 'minify-tool' already exists and is not an empty directory.

Fatal error: local() encountered an error (return code 128) while executing 'git clone git@github.com:appleboy/minify-tool.git'

Aborting.

程式就停止了,但是如果底下有必須執行的工作,該怎麼辦,必須要 import with_statement 模組,將程式碼改成底下

from __future__ import with_statement
from fabric.api import local, settings, abort
from fabric.contrib.console import confirm

def clone():
    with settings(warn_only=True):
        result = local("git clone git@github.com:appleboy/minify-tool.git")
    if result.failed and not confirm("Tests failed. Continue anyway?"):
        abort("Aborting at user request.")

會發現畫面還是會出現錯誤訊息,最後跳出 confirm 視窗鍵入 Y,結果會得到 Done!,鍵入 N 則得到 Aborting 訊息。

[localhost] local: git clone git@github.com:appleboy/minify-tool.git
fatal: destination path 'minify-tool' already exists and is not an empty directory.

Warning: local() encountered an error (return code 128) while executing 'git clone git@github.com:appleboy/minify-tool.git'

Tests failed. Continue anyway? [Y/n] y

Done.

接著來定義 deploy 工作內容

def deploy():
    code_dir = 'minify-tool'
    with cd(code_dir):
        run("git pull")

上面多了二個函式,就是 cd 和 run,cd 很直覺,就跟 Linux command 一樣,run 跟 local 不同的地方就是 run 是用來管理遠端機器。

定義 Host

最前面有提到可以用 -H 方式定義,那也可以直些寫在 fabfile.py 設定檔

env.hosts = ['127.0.0.1']
env.hosts = ['localhost']
env.hosts = ['web1']

上面寫法都正確,host name 可以直接在 /etc/hosts 檔案內定義,將程式碼改為底下

env.hosts = ['my_server']

def deploy():
    code_dir = 'minify-tool'
    with settings(warn_only=True):
        if run("test -d %s" % code_dir).failed:
            run("git clone git@github.com:appleboy/minify-tool.git %s" % code_dir)
    with cd(code_dir):
        run("git pull")

如果沒有定義 env.hosts,你也可以執行

$ fab -H web1 deploy

這次先介紹到這裡,或許之後有機會來介紹進階用法,當然可以先參考看看 fabric document

十月 27, 2011

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» LiveReload 網頁程式設計師必備工具

如果讀者目前從事的工作跟 Web Develop 相關,相信每天在按 Ctrl + R 的次數至少在上百次吧,也許花在這上面的時間會真的很煩,有沒有想過如果每次修改 html php css s[ca]ss js 檔案後,網頁會自動幫忙 reload 呢,這樣就可以另外買個螢幕把網頁拉過去,修改好檔案,螢幕就會幫忙重新整理,大家省下這些時間就可以專心寫 Code 了啦,解決此問題非常容易,那就是裝上 livereload 這套 rubygem 程式,底下先看看 livereload 影片:



底下會簡單介紹 Ubuntu 及 FreeBSD 的安裝方法,其實在官網 README 都寫的蠻清楚。

Linux 安裝方式

用 apt-get 指令安裝

$ sudo gem install rb-inotify livereload

FreeBSD 安裝方式

原本我也是打算用 gem 方式安裝,不過安裝好之後噴出底下錯誤訊息

/usr/local/lib/ruby/site_ruby/1.8/rubygems/custom_require.rb:36:in `gem_original_require': no such file to load -- em-dir-watcher/platform/nix (LoadError)
        from /usr/local/lib/ruby/site_ruby/1.8/rubygems/custom_require.rb:36:in `require'

        from /usr/local/lib/ruby/gems/1.8/gems/em-dir-watcher-0.9.4/lib/em-dir-watcher.rb:16
        from /usr/local/lib/ruby/site_ruby/1.8/rubygems/custom_require.rb:36:in `gem_original_require'
        from /usr/local/lib/ruby/site_ruby/1.8/rubygems/custom_require.rb:36:in `require'

        from /usr/local/lib/ruby/gems/1.8/gems/livereload-1.6/bin/../lib/livereload.rb:2
        from /usr/local/lib/ruby/site_ruby/1.8/rubygems/custom_require.rb:55:in `gem_original_require'
        from /usr/local/lib/ruby/site_ruby/1.8/rubygems/custom_require.rb:55:in `require'

        from /usr/local/lib/ruby/gems/1.8/gems/livereload-1.6/bin/livereload:3
        from /usr/local/bin/livereload:19:in `load'
        from /usr/local/bin/livereload:19

會出現這錯誤訊息的原因是在 Ruby 偵測 OS 的時候出現問題

module EMDirWatcher
    PLATFORM = ENV['EM_DIR_WATCHER_PLATFORM'] ||
        case Config::CONFIG['target_os']
            when /mswin|mingw/ then 'Windows'
            when /darwin/      then 'Mac'
            when /linux/       then 'Linux'
            else                    'Nix'
        end
end

FreeBSD 底下 Config::CONFIG['target_os'] 會顯示 FreeBSD 字眼,所以此變數就會被設定到 Nix 然後就炸開了,為瞭解決這個雷,請另外安裝 sysutils/rubygem-guard-livereload port,透過底下指令來執行 LiveReload

# 初始化設定
guard init livereload

此指令會在目錄底下產生 Guardfile 檔案,內容是

# A sample Guardfile
# More info at https://github.com/guard/guard#readme

guard 'livereload' do
  watch(%r{app/.+\.(erb|haml)})
  watch(%r{app/helpers/.+\.rb})
  watch(%r{.+\.(css|js|html)})
  watch(%r{(.+\.css)\.s[ac]ss}) { |m| m[1] }
  watch(%r{(.+\.js)\.coffee}) { |m| m[1] }
  watch(%r{config/locales/.+\.yml})
end

可以看到 LiveReload 會偵測 css js html s[ac]ss coffee script 都可以。此步驟是用在 FreeBSD 機器,如果是 Linux 請參考以下步驟

LiveReload 使用

經過上面步驟安裝 LiveReload 後,接著來介紹如何在 Server 端使用 LiveReload,這指令會在 Server 端開啟一個 port 好讓 Client 端連接上,底下是建立方法。

# livereload 目錄
livereload /path

livereload 預設會 listen 0.0.0.0 address 及 tcp port 35729,如果要更改這兩項設定,請更改 option 設定

livereload --address [ADDRESS] --port [PORT]

執行後會吐出下面訊息

Version:  1.6  (compatible with browser extension versions 1.6.x)
Port:     35729
Watching: /var/www/html/Client
  - extensions: .html .css .js .png .gif .jpg .php .php5 .py .rb .erb
  - live refreshing disabled for .js: will reload the whole page when .js is changed
  - excluding changes in: */.git/* */.svn/* */.hg/*
  - with a grace period of 0.05 sec after each change

LiveReload is waiting for browser to connect.

以及會在目錄底下產生 .livereload 隱藏檔,檔案內容可以針對不想要偵測哪些檔案或者是目錄分別做設定,相當方便,此原理是偵測 server 端修改檔案,透過 web socket 通知 client browser reload 網頁,解決掉手動 reload 網頁時間,同時也支援 server side language: PHP , Compass SASS Less.js …等。

Client 端安裝

至於 Web Browser 就是安裝 Plugin,且設定 Web Host 及 port 就可以連接上了,目前官方提供了 FireFox, Safari, Google Chrome 等三者瀏覽器 plugin

如果讀者環境是 Windows,請參考鐵兄的網誌 在 Windows 下使用 LiveReload,另外也可以參考 XDite 大大寫的 LiveReload:你的套版好幫手!

Related View

十月 13, 2011

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» 在 CentOS 上面安裝 Ruby 環境

centos

目前開發網站都傾向於用 Compass 這套 CSS Framework 來 develop,開發之前必須把環境先弄好,就是要有 Ruby 套件才可以安裝 Compass,網路上的教學幾乎都在是 Ubuntu 底下用 apt-get 方式來安裝,其實相當方便,但是 FedoraCentOS 就是要用 yum 方式來安裝,這次碰到 CentOS 竟然 yum search git 出來的結果是空的,所以決定全部都透過 tar 的方式來安裝全部套件了。由於 Fedora 幾乎都可以找到套件,但是碰到 rubygems 需要用到 ruby 1.8.7 以上版本,所以還是乖乖的用 tar 方式吧。

大家可以試試看透過底下 yum 方式安裝:

yum install -y ruby ruby-devel rubygems

雖然 Fedora 透過上面可以安裝成功,可是 ruby 跟 rubygems 的版本根本是…太舊了吧 …

安裝 git

yum 方式:

yum install git

利用 tar 方式,先到 git download 專區 找到 1.7.7 版本

$ yum install curl-devel
$ wget http://git-core.googlecode.com/files/git-1.7.7.tar.gz
$ tar -zxvf git-1.7.7.tar.gz && cd git-1.7.7
$ ./configure
$ make && make install

安裝 Ruby

透過 yum 安裝好的 Ruby 版本太舊,乾脆直接衝最新版

$ wget ftp://ftp.ruby-lang.org//pub/ruby/1.9/ruby-1.9.2-p0.tar.gz
$ tar -zxvf ruby-1.9.2-p0.tar.gz
$ cd ruby-1.9.2-p0
$ ./configure
$ make && make install

安裝好打入 ruby -v 你會發現還是舊的版本,那是因為新版裝在 /usr/local/bin 底下,而 yum 方式安裝的會在 /usr/bin 底下,所以改變一下 $PATH 變數順序即可

$ export PATH=/usr/local/bin:$PATH
$ ruby -v
ruby 1.9.2p0 (2010-08-18 revision 29036) [x86_64-linux]

安裝 RubyGems

一樣到 RubyGems 下載最新版本

$ wget http://production.cf.rubygems.org/rubygems/rubygems-1.8.10.tgz
$ unzip rubygems-1.8.10.tgz
$ tar -zxvf rubygems-1.8.10.tgz
$ cd rubygems-1.8.10
$ ruby setup.rb

接著可以透過 gem 來安裝 Compass。Windows 請參考之前寫的 在 Windows 底下安裝 Compass CSS Authoring Framework

參考文章:
在CentOS 5上安裝Git

Related View

六月 11, 2009

小惡魔AppleBOY
AppleBOY
小惡魔 – 電腦技術 – 工作筆記 – AppleBOY is about »

tag cloud

» [網站] 好站連結 (三)


jQuery

Linux

FreeBSD

javascript

CSS

Wordpress

PHP

C/C++

Ruby

html

CodeIgniter

Related View

support:

biggo.com.tw

A Django site.