非 root 環境下的 App::perlbrew 與 App::cpanminus

跟 gugod 討論後發現我之前所寫的方式有問題,所以重寫一篇...

首先是安裝 App::perlbrew 的方式:

wget --no-check-certificate http://xrl.us/perlbrew
chmod a+x perlbrew
./perlbrew install
./perlbrew init

這樣在自己的目錄下就會有 perlbrew 了,接下來是設定環境變數:

source ~/perl5/perlbrew/etc/cshrc # (for csh/tcsh)
source ~/perl5/perlbrew/etc/bashrc # (for bash)

並將自己的 ~/.cshrc 或是 ~/.bashrc 裡加入上面的 source 指令。

原來下載的 perlbrew 就可以砍掉了,然後把 Perl 5.12.3 的環境建好:

rm perlbrew
perlbrew install perl-5.12.3
perlbrew switch perl-5.12.3

接著是用 App::cpanminus (standalone) 安裝 App::cpanminus (套件):

wget --no-check-certificate -O cpanm http://cpanmin.us/
chmod a+x cpanm
./cpanm -n App::cpanminus

然後一樣把下載下來的 cpanm 砍掉:

rm cpanm

這樣可以在不碰到「CPAN」這個大模組的情況下,把基本的系統裝好...

用 JSONView 看 JSON 資料...

之前是用 Force Content-Type 強制把 application/json 轉成 text/plain 然後直接看原始輸出的 JSON document。但如果遇到 JSON 很長一串的時候 (把空白及換行抽掉),看起來就很麻煩...

Firefox 上的 JSONView 可以同時處理 application/json 會跳出下載頁,以及排版的問題。以「emma.pixnet.cc/album/elements?set_id=15345490&user=nico」這個 JSON 輸出來說,這樣就好讀很多:

不過會把 url 轉成可點選連結的功能好像關不掉...

App::perlbrew 另外的裝法

Update:這篇內容有問題,請參考「非 root 環境下的 App::perlbrew 與 App::cpanminus」這篇新的說明。

App::perlbrew 的說明,在系統已經有 Perl 的情況下,不需要先用 CPAN 裝 App::perlbrew,可以直接抓 App::perlbrew 的執行檔:

wget --no-check-certificate http://xrl.us/perlbrew 或是
curl http://xrl.us/perlbrew > perlbrew

其中 wget 要加上 --no-check-certificate 是因為檔案實際是放在 GitHub 上,而 GitHub 目前是強制 HTTPS。

接下來直接執行 perlbrew 相關的指令,通常就是:

chmod 755 perlbrew
./perlbrew init
./perlbrew install perl-5.12.3
./perlbrew switch perl-5.12.3

後面的就跟之前提到的一樣了。這樣要建立自己的 Perl 環境就更簡單了...

window 的 hashchange (onhashchange) 事件

hashchange 是 HTML5 event,紀錄一下目前支援的情況:

目前 IE6/IE7 常見的模擬方式是透過 hidden iframe 做類似的效果...

另外在偵測瀏覽器是否有支援 hashchange 可以利用「Detecting event support without browser sniffing」這篇說明的方式偵測是否有支援特定的 event,可以避免使用 browser sniffing。

微軟推出 IE6 Countdown 網站

微軟推出了 IE6 Countdown 網站,希望可以把 IE6 的佔有率壓到 1% 以下。以目前網站上更新的數字,台灣是 10.7%...

不過上面的數字是以 2011/2/28 的數據產生出來的,這天雖然是星期一,但台灣剛好是國定假日,使用公司電腦的人少很多,這使得使用 IE 的人也少很多 (可以參考 StatCounter 的數據)。如果抓平常日的數字,大約在 14% 上下,超過印度的 12.3%。

IE6 是 2001 年 8 月 27 日出版,快要滿十年了,不知道有沒有機會在十週年生日前 (七月的報表) 看到他 5% 以下...

如果可以不用管 IE6 的話,有什麼好處呢?先不論 bug 的問題,光是網頁設計時的 css selector 就多出許多可以用:(圖片來自「CSS selectors and pseudo selectors browser compatibility」)

用 IE 的 conditional comments 建立 class

IE 的 Conditional comments 可以拿來建立對應的 class,可以減少 css 使用 IE hack 的情況 (有些 IE hack 會使得 css 的語法不正確,用工具壓縮後可能會出問題),以 IE6 為例,下面的例子可以把 IE6 與 IE7 分別標上 class="ie6" 或是 class="ie7"

<!--[if IE 6]><body class="ie6"><![endif]-->
<!--[if IE 7]><body class="ie7"><![endif]-->
<!--[if gt IE 7]><!--><body><!--<![endif]-->

這個方式不需要 javascript,而且是合法的 HTML (只有 IE 會看懂 comment 內的說明)...

jQuery 1.5.1 釋出

jQuery 的官方 blog 宣佈 1.5.1 正式出版:「jQuery 1.5.1 Released」,除了 bugfix 外,也宣佈要開 1.6 Roadmap Meeting 討論下一個版本要做的事情,預定在 irc.freenode.net 的 #jquery-meeting 上開,時間是 3/7 (時區是 EST)。

這次 Google CDN 上已經有 1.5.1 版,需要的人可以改過去了...

Protocol Preserve URI 的過濾

雖然知道 //host.domain/path 這種 Relative Protocol 用法 (而且也用很久了),不過最近在 irc.perl.org 上的 #plack 剛好有人提到,再加上最近剛好有人在探討安全性問題:「Bypassing "RequestPolicy" Using Protocol Relative URLs」,剛好可以拿出來再說一次。

簡單來說就是「以 / 開頭的 URI 並非一定是 same origin,不可以以此當作 same origin 的判斷」。因為「//ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js」這種用法是正確的用法,表示保留 Protocol。

另外講些題外話,這個用法也還是有缺點,用在 IE 的 css 時會造成重複抓取 (到 IE9 都還是):「CSS files downloaded twice in Internet Explorer with protocol relative URLs」,script 或是 relative path 都不會,只有 css 會...

反過來說,因為 js 的部份大家都沒問題,所以當使用 Google 提供的 jQuery 時,「永遠」都應該使用「//ajax.googleapis.com/...」,因為 Google Libraries API 是同時支援 HTTP 與 HTTPS 的。

Markapl:Markup as Perl

Markaplgugod 寫的 Perl module,這是在 miyagawa (宮川達彦) 的 Sunaba 模組上看到的... 以 Perl 的語法建立 HTML。

目前 CPAN 上面 Markapl 的不是最新版 (0.11),在 GitHub 上的 Markapl 比較新... (據說是作者忘記在 release 0.11 後有 commit 了,在寫這篇文章的時候已經 release 新版,等下應該就會看到了...)

至於範例... 直接參考 Sunaba 的 View.pm 會比較快。(我故意連到特定版本,避免之後改動架構這個檔案被搬走。目前版本的 View.pm 請點這個連結)

用 Markapl 除了可以用 Perl 語法外,另外一個「好處」是強迫自己將 css 與 javascript 搬到 template 外面,因為 template 內實在是不好寫... (用「q/.../」?用「<<CSS;」然後「CSS」結尾?gosh XD)

另外補充一點,範例上都沒有 DOCTYPE,請用「outs_raw('<doctype html>');」加在 html 前即可。

Blog 關掉 CloudFront CDN...

剛剛用手機看自己的 blog 發現版面亂掉,看起來是 CSS 有問題...

測了一些東西後發現,如果 W3 Total Cache 使用 CloudFront CDN,會使得 WPTouch 失效,拿掉 CDN 的部份就會恢復正常...

那只好先拿掉了,現在用手機看 blog 的人應該就正常了...