MozCC 在 Jetpack 裡重生:JetCC

趙柏強 Po-chiang Chao
jetcc-1.jpg

在弄 ccZotero 時,網頁裡後設資料皆經由 ccMetaView (MozCC 的一部份) 擷取而來。ccMetaView 的目標是要能夠抓到各式相關的後設資料格式 (而不論是否與 CC 相關),這是好事,不過如果就真的只想抓 CC 的後設資料、是否有跟 MozCC 1.0 一樣的簡單套件呢?又,Firefox 的 API 隨著版本演進而變,而就 CC 總部投注在 MozCC 上的資源,顯然不足以隨著版本變動而更新,是否有更能快速修改的東西呢?

之前提過,我最近花比較多時間玩 Jetpack,所以在想到這些後,就把腦筋動到 Jetpack 上。這種單純的架構果然是實作簡單套件的最佳方式,只花了一點點時間、就把這個 Jetpack feature: JetCC 做出來了。

安裝 JetCC 之後,在狀態列上會顯示目前網頁的授權方式,點選之後則會帶你前往授權條款的說明頁面。其實一切就與 MozCC 1.0 差不多,這也是我覺得比較「輕量」的方式。

jetcc-2.jpg;

拜 HTML 5 Selector API 所賜 (在此以 jQuery 處理),要找到網頁中有沒有「授權條款」相關資訊,只需要簡單一行:

$(doc).find("a[rel~='license']");


接著再取得該元素中的 href 屬性 (也就是授權條款網址),即可得知該文件採用什麼授權條款,然後顯示相應圖片即可、輕鬆愉快。

在這個小套件裡有幾件事情值得與大家分享:

1. CC Metadata 格式
從古到今,就我所知有三種在網頁裡嵌入 CC 授權資訊的方法,分別是放在註解裡的 RDF、microformat、以及目前的 ccREL 規格。後兩者都可以用剛剛那樣擷取 rel="license" 的方法來察知,不過對 JavaScript 來說、放在註解裡的東西還真是苦手。實作上還是可以分析網頁後自己寫簡要 RDF parser、不過我懶了…

除了註解中的 RDF 之外,XML 中的 RDF 也是個問題。按理說我不需要管到 XML 的部份、但因為 Firefox 的構成介面:XUL 也是種 XML,所以利用 XUL 做的「網頁」 (例如高橋流 XUL) 也可以由 Firefox 開啟,這麼一來支援一下就是理所當然的事情了。不過同上,目前懶得做,願意幫忙的大德快來吧 XD

2. 產生 referer
點選狀態列的 CC 圖示會帶你到該授權條款的說明網頁。其實 CC 的授權條款說明頁面會自動偵測來源網頁是否有其他 ccREL 的資訊 (例如 morePermission、姓名標示資訊等),並且顯示出來。因此,如果在這邊單純用 jetpack.tabs.open來開啟授權條款說明頁的話,在 HTTP request 內並不會送出 referer,那說明網頁也就無法找到來源網頁上的其他資訊。

只要能送出 referer 就能解決此問題,不過 Jetpack 的 API 目前還沒有提供修改 HTTP Request 內容的方法,所以只能靠其他旁門左道來處理了。在你點選狀態列的 JetCC 圖示時,我們偷偷在目前頁面上插入一個按鈕,設定按下後前往授權條款網頁,再用程式模擬按下動作。這樣就暫時繞過了 referer 的問題。

嚴格說來,這個套件的作用相當有限,但有鑑於 Jetpack 這種方式是未來瀏覽器擴充套件架構必走的道路,當成試作品亦有他的價值。程式碼本身相當簡單,我直接宣告進入 Public Domain 了,歡迎大家隨意使用,如果有興趣改成 Google Chrome 可以安裝的擴充套件也不錯 (應該也相當簡單)。

備註:
JetCC連結失效