布丁的自我簡介 (2011年版)

布丁布丁吃布丁

6月 09, 2011 2 Comments 日記 Blogger

布丁的自我簡介 (2011年版)

姓名	陳勇汀(ㄊㄧㄥ)
暱稱	布丁 (布丁布丁吃布丁)
e-mail	pulipuli.chen@gmail.com
學術領域	數位學習、數位圖書館、數位典藏
專長	以網頁程式為主：JavaScript (jQuery)、CSS、PHP，略懂Java跟JSP。具有網路伺服器管理、大量電腦維護的經驗
興趣	技術學習、程式實作爬山、散步
學歷	國立政治大學圖書資訊與檔案學研究所（碩士學位）天主教輔仁大學圖書資訊學系（學士學位）國立臺中第一高級中學社會組

自我介紹

作為一位現代社會人，我認為時常保持著一顆求知的好奇心是必備的習慣。為了滿足求知的欲望，我致力學習如何尋求知識的方法。修習圖書資訊學領域的課程中，我學到了如何利用參考書、資料庫等各種資訊媒體來找尋別人發表的知識；在大學參與計畫、研究所撰寫論文的過程中，我開始學習如何設計研究方法、規劃實驗、問卷與訪談來蒐集那些尚未發掘的知識。接下來，我希望能夠更加地熟悉探究、發掘知識的研究技術，並且更進一步地以發表來與其他人一同分享研究的成果。

人生短暫稍縱即逝，但是人們記錄下來的知識，卻仍能讓後人永久受惠。從就讀輔仁大學圖書資訊學系開始，我受到多位老師的薰陶，秉持著知識分享的想法，將自己在學習與生活中有價值的事物，像是讀書筆記、考試準備、DSpace與伺服器管理等技術資料，透過blog「布丁布丁吃什麼？」(http://pulipuli.blogspot.com) 分享到網際網路上供人瀏覽。另一方面，將程式開發作為興趣的我，也相當樂於將自己的開發成果公開分享。我在碩士論文「合作閱讀標註之知識萃取機制」中開發的「知識標註學習系統」即以開放原始碼的形式授權，提供學弟妹或其他任何想要參與此領域的研究人員自由地取用、進一步開發。

有同學看著我的筆記來準備考試，有網管人員看著我的技術文件來處理伺服器的問題，也有開發人員看著我的DSpace教學來認識這個系統。看到我在blog撰寫的文章能夠幫助許許多多的人，更讓我覺得知識的分享是一件非常有意義的行為。然而，我並不滿足於這種程度的分享。透過blog在網路上發表文章很容易，但若要撰寫出架構嚴謹、條理分明的文章，我還有待訓練；系統程式開發只要拿書與練習就能夠做得到，但是要做出一個有意義的系統、並且從各種角度驗證系統的價值，卻是一件相當步容易、但是非常值得去學習的知識。

在就讀輔仁大學圖書資訊學系時，我從大二就進入林麗娟老師的實驗室，協助老師管理伺服器與教學網站。在大三時，由於我嘗試在林老師原有的教學網站上加入了討論區的回覆功能，林老師指導我以此申請國科會95年大專生參與專題研究計畫，探討「網路非同步互動引言機制」的價值所在，並啟發了我對於研究的興趣。在就讀政治大學圖書資訊與檔案學研究所時，我進入了陳志銘老師的實驗室團隊，跟著陳老師學習論文撰寫與程式開發的技術。在就學期間，我不僅跟著陳老師發表了幾篇國內外的期刊與研討會論文、參與圖資系所論文聯合發表研討會與圖資青年論壇與談人，也與陳老師、實驗室的同窗們一同撰寫了「DSpace開放源碼數位典藏系統建置理論與實務」一書。在陳老師的指導之下，我對於老師在研究構想與論文撰寫感到相當地欽佩，更覺得自己在研究方法、資料分析與文章寫作上還有相當大的努力空間。

即使是碩士論文「合作閱讀標註之知識萃取機制」撰寫完成的時候，我仍然覺得還有其他方向可以繼續延伸發展、深入探討，而對研究之路感到意猶未盡。在研究議題上，數位閱讀環境中的多人閱讀標註中，讀者的閱讀行為與深層認知等研究仍有相當多探究的價值。這不僅有助於推廣閱讀活動，更能夠利用讀者閱讀標註的行為資料來萃取知識──這也是我在碩士論文中想要解決的問題，但還有許多可以改進的地方。另一方面，在系統發展的成果之上，我在碩士論文中開發的「知識標註學習系統」能夠結合各種以網頁呈現的數位圖書館、數位典藏，不論是造福讀者閱讀上的便利、或是對於數位閱讀研究上，未來仍具有持續開發的價值。

我希望未來能夠繼續深耕數位閱讀的議題，並且持續發展「知識標註學習系統」、使它更為完善。更重要的是，我想要在學術的殿堂中，將我所學所得的研究成果發表在研討會與期刊中，與他人一同分享知識、一起為圖書資訊領域而努力。

經歷

[2008~ 2011] 陳志銘教授主持的行政院國科會專題研究計畫助理

情感感知遊戲互動之合作式語言學習模式發展與學習成效評估研究 (NSC97-2511-S-004-002-MY3)
網路學習之形成性評量語學習診斷工具發展與研究 (NSC97-2628-S-004-001-MY3)

[2008~2010] 教育部全國通識教育資源平台建構與永續發展計畫研究助理

負責技術指導、協助功能開發。計畫網址：http://get.nccu.edu.tw/。

[2009] 國立臺中圖書館獎助博碩士班學生研撰圖書資訊學位論文獲選

論文題目「合作式閱讀標註之知識萃取機制研究」（原題目「基於閱讀標註策略之知識萃取在支援數位學習上的應用研究」）。獲獎報導：文教廣角鏡─獎助碩博士論文累積研究文獻。

[2009] 圖書館事業發展2009青年論壇與談人

與談議題五：「技術新浪潮──傳統再感動」，演講內容「標註應用於數位典藏」。

[2008] 政大圖檔所數位典藏實務與加值服務研習班工作人員

協助研習班事務與輔助教師授課，設計「數位典藏系統與平台設計──以DSpace為例」與「DSpace實作教學」教材。

[2008] 華藝公司GCScholar資料庫測試員

測試資料庫各種功能。現在該資料庫已正式上線，命名為「Airiti Library 華藝線上圖書館」。

[2007~2008] 政大圖檔所、數位圖書館與數位學習實驗室之伺服器設備管理維護

[2007] 政大圖檔所頂尖大學計畫「臺灣百年圖書館史暨數位圖書館先導計畫」計畫助理

負責系統建置。計畫成果網址：http://tlh.lias.nccu.edu.tw/。

同時也建置計畫介紹網站，但現已停止服務。計畫介紹網站請看此介紹：http://pulipuli.blogspot.com/2011/06/blog-post_01.html。

[2007] 中華民國圖書館學會50屆會員大會舞台表演

[2007] 臺灣圖書館數位典藏現況與展望研討會工作人員

[2007] 國際學校圖書館事業學會IASL 2007年年會志工

[2005~2007] 林麗娟教授主持的行政院國科會專題研究計畫助理

資訊科技應用與創意教學(NSC 93-2511-S-030-001)
資訊融入自然領域專題式學習(NSC 93-2520-S-030-001)
由動機探討電腦人因網路互動學習(NSC 94-2520-S-030-002)

在這段期間協助林麗娟老師維護Linux伺服器與多個網站，其中學到最多的是「大家e起來互動式計分討論區」，介紹請看這邊：http://pulipuli.blogspot.com/2011/05/e.html。

[2006~2007] 國科會95年大專生參與專題研究計畫執行者

[2007] 輔仁大學圖書資訊學系系友與學生互動網建置

網址：http://alumni.lins.fju.edu.tw/。關於此網站的介紹請看：http://pulipuli.blogspot.com/2011/06/blog-post.html。

[2006~2007] 英國語文學系英文卓越教學計畫助理

「英文導讀 Reading Guiding」開發與維護。關於此網站的介紹請看：http://pulipuli.blogspot.com/2011/06/guided-reading-on-web.html。

[2006~2007] 輔大圖資電腦教室工讀生

在李隆基助教指導維護與管理電腦教室，練就一身快速換裝燈管的特技。(!?)

[2003~2004] 輔仁大學圖書館服務隊

出隊服務「港源國小」與「陸豐國小」，擔任資管與生活職務。

[2004] 輔仁大學圖書資訊學系班代表

[2004] 全國大學學生議會及議事員研習營工作人員

著作目錄

專書

陳志銘、陳勇汀。DSpace開放源碼數位典藏系統建置理論與實務。臺北市：文華圖書館管理股份有限公司。（出版中）

期刊論文

Chen, C.-M., & Chen, Y.-T. (2010). Developing a Taiwan Library History Digital Library with Reader Knowledge Archiving and Sharing Mechanisms Based on the DSpace Platform. The Electronic Library. [SSCI收錄]
陳志銘、陳勇汀、林筱芳（2010）。通識教育開放式課程數位典藏建置之研究。大學圖書館，14（2），83–112。[THCI收錄]
王梅玲、蔡明月、陳志銘、柯雲娥、蔡佳縈、陳勇汀等（2008）。台灣圖書館史數位圖書館建構之研究。圖書館學與資訊科學，34（1），15-38。 [THCI收錄]

研討會論文

陳志銘、陳勇汀、黃柏翰、林育如（2011）。DSpace-DLLL開放源碼數位典藏系統建置與應用。臺北市：國立政治大學圖書資訊與檔案學研究所。
陳勇汀（2009）。基於閱讀標註策略之知識萃取在支援數位學習上的應用研究（頁。155-165）。第一屆圖資系所論文聯合發表暨觀摩研討會。
Chen, C.-M., Wang, M.-L., Tsay, M.-Y., Zhang, D.-Y., & Chen, Y.-T. (2008). Developing a Taiwan Libraries’ History Digital Library with Reader Knowledge Archiving and Sharing Services Based on DSpace Platform. LNCS conference proceeding. Presented at the International Conference on Asia-Pacific Digital Libraries.
ChanLin, L. J., Chen, Y., & Chan, K. C. (2008). The use of labeled postings for promoting asynchronous interaction. Proceedings of World Conference on Educational Multimedia, Hypermedia and Telecommunications 2008 (pp. 988-997). Chesapeake, VA: AACE.

報告

陳勇汀（2006）。網路非同步互動引言機制之建置與分析。行政院國家科學委員會補助大專學生參與專題研究計畫研究成果報告。

作品

網站

Blogger工具

JavaScript程式

[2011] Add to Evernote書籤
[2011] Plurk圖示未讀記數器、Google Reader圖示未讀記數器、Upload Screenshot圖片直連網址剖析器
[2011] 輸出陣列元素所有不重複組合
[2010] 序列分析工具
[2009] LISA to WOS Output Record
[2009] ERIC Output Record Parser
[2009] 書目計量學用Output Records分析工具
[2008] Bradford's Law分區計算機
[2007] 日文歌詞注音網頁轉換器
[2006] Timemark to SSA 字幕製作程式
[2006] 數獨解答計算機

其他

今年都已經快要過了一半了，不過還是要鼓起勁來更新自我介紹。

今年四月到五月間，我在博士班報名中寫了一些關於自己的介紹、履歷、以及一些作品的簡介。有些是值得跟大家分享，或是為自己做個記錄的資料，最近我會陸陸續續將他們擺上來。

上面的自我介紹，就是在書面資料中的內容，僅做些文詞上的修飾而已。也許看起來是有點太過冠冕堂皇，不過作為我個人現在的目標之一，倒也沒有半點虛假。

每年看著自己對自己的介紹略有改變，也許這也是一種有趣的日記吧。2010年的舊版自我簡介請看這篇。

(more...)

英文導讀 Guided Reading on the Web

布丁布丁吃布丁

6月 01, 2011 0 Comments 作品程式寫作輔大圖資

英文導讀 Guided Reading on the Web

題名：英文導讀 Guided Reading on the Web
網址：http://www.etweb.fju.edu.tw/reading/
建置時間：2006~2007，之後他人接手維護。

我大學三年級是接下英文導讀的網站架設與維護工作。這是一個以PHP、MySQL組成的網站。當時該計畫是將英文導讀網站由外包公司設計，然後交貨到計畫，聘請工讀生來維護，我就是擔任這個工作。

課程典藏

英文導讀是一個數位多媒體課程典藏的網站。典藏內容以英文文章為主，能夠典藏靜態文字、影音、圖片等資料。

文章註解

在數位學習的支援上，除了基本的公告欄、討論區、留言板、線上辭典之外，學生還可以在文章每個段落撰寫標註、為每篇文章撰寫筆記，並彼此分享、觀摩。

初次碰觸大型系統

這是我第一次修改別人寫好的大型系統，而且其實該外包公司偷工減料不少，我的工作不僅僅只是維護，還額外地寫了許多功能進去，像是資料排序、搜尋、刪除與修改功能的補強。除此之外，我將phpMyAdmin整合英文導讀的計畫中，教導老師用更簡單的方式管理資料庫，並且將資料庫匯入、匯出的功能整合進英文導讀網站中，即使我離開了，接手的工讀生也能夠輕易地管理與備份網站。

後話

我在2007年大學畢業之後，該網站轉交其他工讀生維護。後來李老師也有幾次找我幫忙處理一些修正工作，不過目前似乎是沒有在使用中的樣子。

現在回頭看看這個網站，發現他有許多在數位學習上的用心。不僅課程教材提供了認知理解支援，讓學生不僅僅只有文字閱讀，還有圖片與語音等多媒體的輔助。註解與作業分享也是相當前瞻的功能，內涵了許多數位學習中值得深入探討議題呢。

(more...)

台灣百年圖書館史暨數位圖書館先導計畫建置手冊

布丁布丁吃布丁

6月 01, 2011 0 Comments 作品政大圖檔程式寫作

台灣百年圖書館史暨數位圖書館先導計畫建置手冊

題名：台灣百年圖書館史暨數位圖書館先導計畫
網址：http://top.lias.nccu.edu.tw/modules/newbb/ (2011年已經失效)
負責建置時間：2007

大多數人對於台灣百年圖書館史數位圖書館先導計畫的印象都是DSpace系統，但該計畫在執行前期的時候，其實是用我架設的計畫網站來存放計畫相關文件。架設這個網站的時間點是繼系友網站與輔大圖資系網站之後，一樣都是以XOOPS技術建置而成，並有更進一步的長進。

以下是當時計畫告一段落的時候撰寫的建置手冊，描述一些建置的細節以及操作畫面。特別是管理介面的操作過程跟編輯畫面，當時實在是用了很多心力在修改啊。然而比較私密的部分，我也做了些修改，以避免不必要的麻煩。

當初匆促寫完這份文件，語氣上似乎也很不嚴謹，現在回頭看來還真是感到有趣啊。

摘要

計劃說明網站(以下稱為本系統)跟主要的數位圖書館暨數位典藏網站(以下稱為Dspace系統)是完全不同的兩個系統，本篇技術文件在敘述前者的建置過程及重點。本系統是由XOOPS建置而成，用XOOPS的CBB論壇提供的編輯器及管理功能，修改而成為一個可以直接使用瀏覽器進行編修、上傳檔案的網站系統。然而本系統卻因為之後將重心轉移到Dspace系統上，導致本系統在內容或是系統維護上逐漸荒廢。本系統的網頁管理功能可以彌補Dspace系統的不足，整合兩個系統是未來可以考慮的方向。

一、建置目的

原本計畫的說明應該要跟網站本身結合在一起，但是為了先做到宣傳效果，而決定另外先架起一個網站，負責擺置計畫的宣傳文宣。只是內容並沒有按照時程更新，導致本網站頗有被擺置荒廢的傾向。(實際上，2011年的時候，該網站已經消失了)

計畫網站的網址為http://top.lias.nccu.edu.tw/，與DSpace系統是在不同的伺服器上運作，是獨立的系統。

二、內容架構

計畫網站大致上是截取本計劃的總體計劃書內容，再加上近期的活動而建構而成。網站的架構圖大致如下：

首頁：包括近期活動廣告、會議記錄、參訪記錄、最新消息、網站搜尋、網站訂閱
最新消息：發佈最近的消息，但因為缺乏維護，所以消息過時。
使命：總體計劃書內容擷取，包括計畫緣起、計畫目標、執行團隊與分工、工作時程。不過有些資料在計畫後期有所改變，例如執行團隊與分工，還有實際進行的工作時程，這些是需要更新的項目。
參與人員：同上，多了e-mail連絡位址。一樣是有需要更新的問題。
會議記錄：放置每次開會的會議記錄，那是Word檔轉加密過後的PDF檔案。
參訪記錄：目前總共有兩次參訪記錄，各別是「交通大學楊英風數位美術館參訪紀錄」、「臺灣大學圖書館數位典藏計畫參訪記錄」。格式同上。
演講記錄：目前沒有資料。這個論壇的定位與研討會的定位頗有混淆的感覺。
相關資料：關於本計劃的相關書目及網站列表，特別是有些技術文件是來自於參訪單位所提供的私家資料。
臺灣圖書館事業與教育史研討會：研討會的相關資料。在該研討會開始之前，此頁面是拿來做廣告的用途。研討會結束之後，就只是擺放資料而已。

三、系統建置過程

伺服器及系統

本系統是以PHP&MySQL為基礎的XOOPS之CBB論壇模組修改而成。PHP伺服器端程式語言與MySQL皆是跨平台開放原始碼軟體，Windows需要另外安裝軟體，大部分Linux都有內建安裝。本系統是架設在Linux伺服器上，以XAMPP這個包含了PHP、MySQL以及資料庫管理程式PhpMyAdmin多合一的包裝程式做為網路伺服器。XOOPS是一種資源入口網站，提供基本平台，再由使用者自行安裝各種不同的模組程式，而有不同的應用。其中CBB論壇便是模組的一種，主要是用來作為討論區使用，網路上十分盛行。

版本及各別說明

Linux：雖然本身已經安裝了PHP與MySQL，但我們另外安裝XAMPP，方便整合管理。在Linux上的XAMPP，會改稱為lampp。
XAMPP 1.6.4套件控制首頁在http://140.119.61.142/。
- PHP 5.2.1：PHP5跟以前的版本有很大差異，請務必使用PHP5
- MySQL 5.0.33
- phpMyAdmin 2.9.2：網址是http://top.lias.nccu.edu.tw/phpmyadmin/，必須要通過兩段認證。
XOOPS 2.13：已經包括以下的CBB論壇。注意，要使用Unicode編碼，不要再回頭用Big-5了。
- CBB論壇 2.3：以下的修改並沒有作成XOOPS模組，所以如果要照下面的方式修改，必須要搭配相對應的版本。

調整php.ini增加檔案上傳大小上限

本系統要提供一些檔案給人下載，但是PHP預設的檔案上傳上限僅有2MB，必須要修改php.ini中的參數以提供大檔案的上傳。

參數有三個，用搜尋就可以找到了：

upload_max_filesize：上傳檔案最大上限。
post_max_size：POST最大傳遞檔案，因為檔案上傳是用POST方式傳送的，所以這個也要設定。
max_execution_time：最大執行時間，為避免檔案上傳耗時過久而伺服器將他斷線，所以調高一點會比較保險。

修改完php.ini之後要記得將伺服器重新啟動才會生效。

安裝XOOPS前，先做過UTF8化

安裝XOOPS本身並不是很困難，所以可是在安裝前卻有幾點要注意的。

MySQL建立資料庫的校對

即使XOOPS本身的程式是用PHP撰寫，這也要MySQL資料庫是以Unicode編碼建置才能夠搭配。MySQL在後來的版本裏面加入了「校正」的功能，這就是指資料存入資料庫時的編碼，資料庫的編碼與資料的編碼必須要相符，才能在phpMyAdmin看到正確的資料呈現。可惜MySQL預設校對的編碼是很奇怪的拉丁語系(明明Unicode都盛行這麼久了)，所以在建立資料庫，必須要手動將校正調整成為「uft8_general_ci」，請參考下圖：

XOOPS資料庫連線的編碼

然後必須要調整XOOPS資料庫連線的編碼設定為utf-8。請手動修改以下兩支程式：

1. XOOP建置資料庫(CREATE DATABASE)時，設定語系為utf8、校對為utf8_general_ci

檔案位置：/html/install/class/dbmanager.php
行數：62
原程式：
$result = $this->db->query("CREATE DATABASE ".XOOPS_DB_NAME);
修正後：
$result = $this->db->query("CREATE DATABASE ".XOOPS_DB_NAME." DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci");

資料庫連線(mysql connect)時，修改它連線的語系為uft8。

檔案位置：/html/class/database/mysqldatabase.php
行數：78~82
原程式：
if (XOOPS_DB_PCONNECT == 1) { $this->conn = @mysql_pconnect(XOOPS_DB_HOST, XOOPS_DB_USER, XOOPS_DB_PASS); } else { $this->conn = @mysql_connect(XOOPS_DB_HOST, XOOPS_DB_USER, XOOPS_DB_PASS); }
修正後：
if (XOOPS_DB_PCONNECT == 1) { $this->conn = @mysql_pconnect(XOOPS_DB_HOST, XOOPS_DB_USER, XOOPS_DB_PASS); } else { $this->conn = @mysql_connect(XOOPS_DB_HOST, XOOPS_DB_USER, XOOPS_DB_PASS); }mysql_query("SET NAMES utf8");

修改完成之後再進行安裝即可。

安裝之後再修改XOOPS參數設定

如果在安裝過程之後，卻發生資料庫或是網址變更的情況，請修改/html/mainfile.php這個檔案的設定。但是變更此檔案會導致範本快取的hash碼修改，可能會導致之後的修改無法套用，下面會再提到。

目前的參數設定：

資料庫名稱digilib_xoops
資料表前置詞{prefix}為digilib
XOOPS的網址為http://top.lias.nccu.edu.tw/，連入之後會自動導到CBB論壇的首頁

修改CBB論壇

由於CBB論壇具備發言、附件、權限控管等功能，所以我將CBB論壇調整成僅供管理者發言、修改及刪除，增加FCKeditor這個與Word較為相容的所見即得編輯器(但仍難以完全相容，這問題下面會再提到)，再將整個系統改成以CBB為主體呈現的網站。

修改權限這功能在XOOPS裡面即有提供，故省略不提。以下我想講的是需要手動修改的部份。

增加FCKeditor，提供較容易上手的Word編輯環境

CBB論壇本身即有提供Koivi Editor編輯器，如上圖。然而這個編輯器僅能提供基本的編輯功能，不堪使用。

FCKeditor是一個網頁上使用的所見即得編輯器，網站在http://www.fckeditor.net/，裡面有試用版本。比起Koivi Editor，多了幾個重要的功能：

1. 具備檔案上傳功能

提供整合性插入圖片、插入檔案的功能，在編輯上更為順手。然而檔案上傳管理功能還是十分陽春，如果檔案量過多將會難以管理，需要搭配FTP管理較佳。

2. 具備Word標籤清除功能

FCKeditor會在複製貼上文字時，自動偵測Microsoft Word的標籤，然後另外有個Word標籤清除功能。跟HTML格式標籤一樣，Word也有自己專屬的標籤。在從Word複製出來的文字內便會自動嵌入，貼到所見即得編輯器時將會轉換成網頁語法呈現，一般使用是難以察覺的。但是Word標籤有很多是多餘限制的贅碼，會導致在網頁顯示時會有錯誤的格式呈現，網頁HTML語法跟Word格式語法是有很大的差異，所以FCKeditor才提供這功能，讓使用者先把Word的標籤清空，再到FCKeditor編輯器設定格式。然而這功能並不能算十分完善，建議最好還是直接寫原生的HTML碼比較好，從Word複製貼上而來的資料只能算是權宜之計。

FCKeditor並不是專為XOOPS而設計，所以要將FCKeditor安裝上去要花一番功夫。需要手動修改的程式碼在/html/class/xoopseditor/裡面，詳細請自行研究程式碼。

如果後來的CBB論壇版本已經具備FCKeditor的話是比較好的，但是這會對我們在CBB論壇的修改上造成版本不合的問題。

XOOPS與CBB論壇模組

XOOPS及其外掛的輸出流程如下：

模組範本及CSS範本個別位於/html/modules/及/html/themes/裡面。由於要範本是使用XOOPS的特定語法，故我們不從這邊修改，而是修改後面流程的程式。

先從範本快取開始談起。範本快取的程式碼在於/html/templates_c/，這是最終輸出之前的PHP程式碼，因為是我們熟悉的PHP語言，所以在修改上較為容易，這也包括與資料庫連線、取用資料的方法。

需要注意的是範本快取所產生的檔名，他是由原本外掛的範本檔檔名加上XOOPS系統所計算出的hash碼而成，而這個hash碼會因為XOOPS對於伺服器設定不同而會有不同的變化。例如我想修改一個來自於/html/themes/7dana-soft/theme.html的範本，這是7dana-soft樣板的範本，會影響到XOOPS的外觀，那麼最後輸出到/html/templates_c/檔名則會是「%%23^23B^23BB62A0%%theme.html.php」，但如果移到其他伺服器、而修改XOOPS本身的設定，那麼XOOPS會重新產生範本快取，檔名則會改成「%%8D^8DC^8DCD7BBD%%theme.html.php」，導致之前的修改失效。

CBB論壇修改要點

主要要修改的有兩個部份，一個是PHP主程式碼，另一個是session、cookie等記錄身分用的程式。

PHP主程式碼

主要是修改範本快取，位於/html/templates_c/裡面。修改最多的是{hash}_theme.html.php這支程式。然而範本快取可以讀取session或cookie中的身分資料，但卻無法設定，必須要透過/html/include/裡面的程式來控制。

記錄身分資訊

位於/html/include/common.php裡面有詳細記錄XOOPS所使用的大部分session與cookie資料，他將這些資料設定成常數(語法是define("NAME", "VALUE"))及物件，而修改時也只能從這個地方著手。

請在此或同個資料的其他程式直接設定session或cookie，以供範本快取使用。

其他較常使用的常數有：

XOOPS_ROOT_PATH：XOOPS在伺服器上的根目錄位置
XOOPS_URL：XOOPS的網址

下面是我另外加入的，方便控制現在的顯示層級：

XOOPS_FORUM_ID：論壇的ID
XOOPS_TOPIC_ID：主題的ID
XOOPS_POST_ID：留言的ID

物件主要是儲存身分資訊的$xoopsUser，用$xoopsUser->getVar('欄位名稱')以取得登入的資料，欄位名稱可以參考MySQL中的{prefix}_users資料表。如果沒有登入，則$xoopsUser會等於null。

CBB論壇與網站對應

CBB論壇的架構有四層：類別、論壇、主題、留言。為了將這個CBB論壇的架構轉為網站型式，所以我將這個架構重新定義。

類別

我將類別分為網站目錄與系統管理。網站目錄類別裡面的論壇標題會顯示在網頁頂端的導覽列，包括最新消息、使命等等，如下圖。而系統管理則包含一些其他頁面使用的欄位，包括管理者登入介面、網站地圖編輯以及連絡方式，同樣包括在CBB論壇裡面以方便編輯。

論壇

主要是導覽列的標題。

主題

主題是在論壇裡面的個別主題，主題裡面包含了許多留言，其中有開新主題的首篇留言以及之後的回應留言，但是我們只取用到主題層級裡面的第一篇留言。

如上圖，「最新消息」是論壇層級，而「臺灣圖書館事業與教育史研討會順利結束」與「計畫網站開始運作」則是主題層次，點進去右邊的內容則是首篇留言的內容。

CBB論壇層級在資料庫裡面的架構對應如下表，其{prefix}則是資料庫名稱的前置詞，是在XOOPS安裝時即可設定的內容，目前是digilib：

CBB論壇層級	資料庫名稱
類別	{prefix}_bb_categories
論壇	{prefix}_bb_forums
主題	{prefix}_bb_topics
留言	{prefix}_bb_posts
留言的內文：跟留言是分開的，很特別的設計	{prefix}_bb_posts_text

XOOPS程式移殖注意事項

目前修改完成的XOOPS程式碼位於附件的xoops_top_html.zip。

如果要將此程式碼移植到其他伺服器，必須要注意以上的重新產生範本快取之外，還要注意權限開放。以下將重點重新整理列表：

增加php.ini的檔案上傳上限
修改/html/mainfile.php的資料庫連線與網址設定
要將原本修改的程式碼，對應到重新產生的範本快取
開放全部權限：
1. /html/cache
2. /html/templates_c
3. /html/uploads：這是FCKeditor檔案上傳所使用的空間

四、內容維護

為了方便理解，以下以Step by Step圖文解說方式，幾個管理內容的方式。

管理者登入

不管進行任何動作，都必須要先登入管理者才行。

位於每個網頁的下方，皆有一個 管理者登入 的連結。
輸入帳號密碼。
在允許編輯或是可以新增主題的地方，便會出現相對應的按鈕

發新主題

每個論壇都可以作發新主題的功能，以增加該論壇的內容。以下以「最新消息」做為示範。

登入管理者後，到「最新消息」
預設是使用FCKeditor編輯器，畫面如下，大部分功能應該看圖示就知道怎麼操作了。
上傳並插入圖片：將游標移到插入點，接著請參考下圖，按下「插入/.編輯影像」的圖示，網頁會跳出一個視窗，你可以按「瀏覽伺服器端」來選擇已經上傳的檔案，或是按「上傳」來另外上傳一個新的檔案。

上傳檔案的視窗如下圖：
插入任意檔案：步驟同上，只是要點選「插入/編輯超連結」，位置請看下圖：
從word複製貼上到FCKeditor：先隨便找一段Word文字來做測試，附帶一提，我是用Word 2003

將這些文字用複製起來，到FCKeditor點選「自Word貼上」的功能

FCKeditor便會開啟一個「自Word貼上」的編輯視窗，請在此選擇是否要「移除字型設定」或「移除樣式設定」(反正都是Word的格式啦)，編輯完成之後按下「確定」，就會把內容貼到 FCKeditor裡面供你繼續編輯。

但是這個功能並不保證能夠清除Word的格式，建議還是用FCKeditor內建的功能重新撰寫文件吧。
上傳附件的方法：雖然FCKeditor有提供上傳檔案的功能，但是要讓使用者下載的檔案，最好統一用附件的方式放上去。附件上傳的位置在編輯區下方，可允許多個檔案上傳。

但問題是上傳檔案的檔名並不會經過編碼處理，如果你使用非英數的中文字，IE6以前的使用者下載的檔名將會是亂碼。

新增會議記錄

這邊示範新增一篇會議記錄的過程，由於會議紀錄有固定的摘要表格，所以是從不同路徑進入的。

登入管理者後，到「會議記錄」的討論區中，找到「新增會議記錄」按紐，請看下圖：
開啟FCKeditor，不同的是，這邊已經有預設的摘要表格，為方便程式抓取資料，請按照表格填寫。
該論壇的首頁便是從表格抓取而來的結果。

檔案要經過PDF加密

為了著作權等等爭議的問題，提供給瀏覽者下載的檔案必須為轉換並加密過後的PDF檔，而不能是Word或JPEG圖片檔。

PDF的轉換與加密必須使用Adobe Acrobat 7.0 Professional之類的軟體，礙於版權所以這邊也無法提供，但是大多數學校應該都有購買才是。

PDF中加密稱之為「保全」，詳細操作請直接查閱Acrobat說明，最終保全設定必須如下：

其他功能

以下功能是具備的，請自行摸索吧。

每個論壇的首頁都可以用PHP程式碼來自定，方便進行資料庫連線取得資料的動作。
論壇的順序、名稱等管理，可使用XOOPS中CBB論壇的模組管理介面

在系統層級好像還有很多修改的細節，詳細也無法一一敘述，請見諒。

五、建置成果

首頁

論壇首頁──最新消息

編輯畫面

會議記錄頁面

研討會說明頁面

六、未來發展

與Dspace整合

一個頂尖大學計劃，卻有兩個系統。一個是這一個XOOPS系統，負責計畫內容說明，另一個則是主要的Dspace系統。然而這兩個系統之間並沒有密切的整合在一起，僅提供簡單的幾個連結，這是為人所詬病的地方。

在公告管理上，XOOPS有較佳的管理能力，能夠取代Dspace貧乏的新聞功能(等同於公告)，FCKeditor功能完善的編輯器也可以加入Dspace當中，而不要讓管理人員每次都要看原始碼進行作業。

但是XOOPS是用PHP&MySQL，Dspace則是用JAVA&JSP&PostgreSQL，兩個系統使用的程式語言及資料庫迴然不同，增加了在整合上的困難度。還好FCKeditor也有提供JSP版本，有機會未來可以繼續研究。

需要專職的內容維護人員

之前的工作中，程式設計師被分派到內容維護的工作，但是後來程式設計師的精力就專注在系統的修改及維護上，導致內容維護的荒廢。

建議系統建置人員及內容維護人員的工作應該要分工進行，才不會變成現在的慘狀。 (more...)

輔大圖資系系友與學生互動網

布丁布丁吃布丁

6月 01, 2011 0 Comments 作品程式寫作輔大圖資

輔大圖資系系友與學生互動網

題名：輔大圖資系系友與學生互動網
網址：http://alumni.lins.fju.edu.tw/
負責建置時間：2007

2007年的時候，我在輔大圖資系當工讀生，負責維護電腦教室、做做雜事。當時擔任系主任的林麗娟老師指示要架設一個新的系友與學生互動網，而要我來完成這個任務。

基於XOOPS的修改

XOOPS的登入介面

當時我用XOOPS的CBB論壇功能來進行修改，網站中幾乎所有功能都是論壇的「一篇文章」。因此管理者基本上就是在撰寫論壇文章、修改論壇文章。對於當時還算挺盛行的CBB論壇來說，這種操作經驗應該是很容易讓人接受的。

特製的輪播照片與標語

為了顯示首頁中特殊的資料，包括輪播照片與標語，我為幾篇文章加入表格的限制，讓程式容易從文章定制的資料中擷取特定內容。

標語還利用跑馬燈的形式，讓字一個一個顯示出來。附帶一提，那個飄香的咖啡小圖示中，我切割了咖啡杯跟上面飄香的圖片，並利用背景圖示y軸移動來製作飄香的動畫……即使在AJAX盛行的現代中，這種看起來毫不起眼的技術，也是我剛開始學習AJAX的一個初步成果呢。

被捨棄的XOOPS系網站

之後林主任又要我來改系網站，於是我又同樣地利用XOOPS來進行修改。由於有了系友網站的經驗，所以這次改起來更順了點。

改用Drupal來建置的輔大圖資系網站

即使如此，XOOPS的論壇終究只是XOOPS的論壇，而我那無可救藥的設計感也仍然是沒有任何長進，因此系網站大概在一年之後就不知不覺消失了，改成利用Drupal來建設起新的輔大圖資系網站。現在想要回去找找當時的網站也已經找不到了，連截圖都沒有留下，倍感遺憾。

小結

說真的，當時架好之後，其實我不是很敢跟別人說這是我架的──因為網站真的不太好看。所以之前的Blog似乎也都沒有提起這段過去，直到現在才拿出來講。

然而經過這些建置過程之後，還是學到了不少XOOPS跟Smarty樣板等PHP程設經驗。儘管當時並沒有設計模式的概念，所以學到的也都是相當枝微末節的小技巧，但是也算是第一次碰觸大型「完整」的系統吧。

不過，相較於後來新盛Joomla、Drupal等內容管理系統來說，我覺得XOOPS還是頗難上手，甚至有人已經在預言XOOPS的倒閉了。看著現在所上老師還在教XOOPS架站，不禁有種淡淡的哀傷就是。

(more...)

大家e起來互動式計分討論區

布丁布丁吃布丁

5月 31, 2011 0 Comments 作品程式寫作輔大圖資

大家e起來互動式計分討論區

題名：大家e起來互動式計分討論區

網址：http://pbl.lins.fju.edu.tw/news/

「大家e起來互動式計分討論區」是輔仁大學林麗娟老師授課學習平台兼研究工具。這是一個以PHP與MySQL寫成的討論區系統，原始程式是由學長開發，而我接手維護。

這個討論區的功能相當基本，管理者可以設置多個討論群組，而學生就在各群組之中進行討論。原本僅能擺放純文字，我在此加上了回應、排序，也設計了自動辨識出http網址的分析器，豐富討論區的功能。林麗娟老師看中回應功能的研究價值，鼓勵我以「網路非同步互動引言機制之建置與分析」申請行政院國家科學委員會補助大專學生參與專題研究計畫，開啟了我的研究之路。

討論區的回應功能

之後我也設計了一個線上問卷調查系統，方便老師進行使用者問卷調查。該系統可以讓使用者填寫5點量表及開放式填答，管理者可以輕易地建置題目、設定問卷開放與關閉的期限。系統建置時，用了特殊的資料結構來記錄問卷的題目與順序。可惜網站在不知不覺的時候已經關閉，沒辦法記錄這個功能的樣貌。

由於之前在整理博士班推甄的文件，其中我介紹了幾個自己做過的系統。回頭來看看的時候，發現自己並沒有在blog中好好介紹過他們的樣子，這個系統甚至已經不能連線了。甚是可惜。

因此藉此機會，我寫一下幾個印象比較深刻的作品介紹，為自己做個記錄。

(more...)

談DSpace-DLLL系統

布丁布丁吃布丁

5月 28, 2011 17 Comments 日記政大圖檔電腦軟體演講心得 DSpace

談DSpace-DLLL系統

政大圖檔所於2011年5越27日舉辦了「數位檔案加值與教學應用研討會」。早上的場次中，我的指導老師陳志銘教授（真‧教授囉！）參與主講「DSpace-DLLL開放源碼數位典藏系統建置與應用」，講述我們實驗室將DSpace改良開發成DSpace-DLLL，並應用於臺灣百年圖書館史數位圖書館與全國通識網課程資料庫的內容。

以下是演講時的投影片：(SkyDrive下載)

關於DSpace-DLLL

如果常常閱讀這個Blog的人，一定知道這個「DSpace-DLLL」就是我在寫書中做出來的系統。這個演講底下的意義是為了書的出版鋪路，老師也很有良心，不把研討會當廣告臺，所以演講中並沒有提到書的事情，而是私下詢問時才會透漏給有興趣的人知道。

由於之前我在準備博士班的考試，老師並沒有特別告知我要進行這篇的演講，而是在我博士班筆試都考完之後才請我做投影片，所以我是最近才知道這篇文章的內文在講些什麼。儘管作為一個熟悉者，可以看得出學弟妹整理的文章中有很多破綻，不過將自己做的作品分享出去這件事情，還是挺令人驕傲的。而且這篇文章的發表也能幫學弟妹抵免資格考，這對學生來說才是數位典藏系統的「加值應用」啊。

關於DSpace-DLLL的細節，我在書本中已經有詳細地說明。目前書本正在二校中，博士班筆試結束之後，我也比較能夠專心投入這塊。希望能儘快出版呢。

回應項潔館長的問題

在議程結束前的發問期間，項潔館長質疑我們做DSpace-DLLL是否有其必要性，應該是多跟臺大圖書館合作，這樣才是真正的「不必自行重複開發」。王梅玲老師認為小型團體仍有建置獨立數位典藏系統的需求，但項館長則反駁說，那應該是去購買雲端服務即可。而會議議程時間不夠，實際上的主講者陳老師卻沒有參與這個討論，就結束了這段議程。

說實話，我不是很清楚跟臺大合作的方式是如何。感覺上應該是類似企業外包委託案那種方式進行吧？如果真的要做大的話，臺大圖書館也的確可以用雲端運作模式來提供合作服務也說不定。

DSpace-DLLL的「不必重複建置數位典藏系統」，是真的只是在講這個技術平台。在數位典藏計畫裡面，技術平台只是一個環節，無法取代委託整個數位典藏計畫的作法。不過即使如此，對於很多人來說還是很有意義。舉例來說，教師在教數位典藏課程時，就能夠讓學生真的有一個系統平台可以去架設、管理、自行建置，讓他們真的體驗到「如何規劃、建置一個數位典藏計畫」的經驗。這種價值在政大圖檔所中也時常體現，我也從老師們教學使用上的回饋來修正DSpace-DLLL的缺點。另一方面，DSpace-DLLL可以成為想要獨自架設數位典藏系統的單位有一個比原始DSpace更好上手的起點。

尤其是後者，對我來說有著更深遠的含義。DSpace-DLLL是以開放原始碼的模式分享技術，我們站在DSpace這個巨人的肩膀上，往理想的方向踏出了一步，然後再成為其他人的基石，幫助他人更進一步。就像DSpace仍有許多缺點，而我們改善之後以DSpace-DLLL釋出一樣，未來也希望會有人再改進DSpace-DLLL，而釋出更好的開放原始碼數位典藏系統。

以一個系統開發者的角度來說，讓技術在開放原始碼的環境下自由地成長，這是很有意義的貢獻。

未來的方向

作為DSpace-DLLL的開發者，先不論老師在接手之後怎麼繼續改進，我必須補充一下老師在影片中尚未提及的幾個注意事項。

大前提是，這不是企業化、大團隊製作的成品，因此請勿期待不太會成為完美的方案，只能成為備選方案之一。

虛擬機器的限制

DSpace-DLLL封裝在虛擬機器VirtualBox進行安裝。我寫了一個Windows XP的安裝精靈，方便Windowx XP使用者來架設。而VirtualBox是跨平台的虛擬機器，因此熟悉的使用者也可以拿著硬碟檔架設在Linux平台上。

使用虛擬機器封裝的理由很單純：安裝簡易。DSpace的原始安裝方式是以Java Servlet來進行配置，但是技術難度高，而太多外部依賴元件需要額外下載。在DSpace-DLLL中加入的多媒體轉檔功能，也需要依賴非DSpace原始檔中的OpenOffice、FFmpeg、MEncoder套件。為了避免大家光是安裝就弄昏了頭，所以我把它通通打包在虛擬機器中，方便轉移與應用。這種概念可是雲端模式的基礎呢。

虛擬機器的意思是在電腦上再模擬一個電腦，對於效能不佳的電腦來說，虛擬機器的負荷很大，因此穩定度跟服務負荷量有待評估。

理論上，若將DSpace-DLLL裡面的系統移植到實體電腦上，應該是會有比較好的運作效能。不過各元件是否能夠順利搭配這點我就不敢保證，Linux最為人詬病的就是套件相依性太高，要完美地安裝一個系統，我一直都沒有確切的把握。

大量資料的處理

繼承前一點，虛擬機器的DSpace-DLLL在大量資料的存取下是否能夠正常運作，這是需要評估的。除此之外，在系統功能上也還有許多需要改進的地方。

對於數位典藏工作人員來說，最需要的就是批次匯入機制。DSpace有提供後台的匯入，但是批次檔的撰寫對一般人來說並不友善。同樣的，對於大量資料的修改、調整，DSpace也沒有批次修改的功能。因此在大量資料的管理上，還有很多的不便。

這是DSpace尚未達到的境界，而DSpace-DLLL也繼承下來，一樣有這種問題。

但是這並不是做不到：DSpace的批次匯入其實真的很好用，只是不太友善。有心要修改的人，應該是能夠輕易地將他實作成前臺網頁可以直接執行的功能吧。

權限控管與付費機制

這是非常重要的一個未解決問題，如果你的計畫想要以DSpace-DLLL作為起點，那麼權限是不得不考量的一個議題。

DSpace提供以帳號來控管權限功能，可以控制內容層級每一層的新增、遞交、編輯、刪除權限，控管上非常詳盡。但是就跟大量資料管理缺乏批次處理功能一樣，大量的權限設定也就變成一個難題。另一個問題，就是權限控管的需求不只有帳號這一種方式，常見的還有IP、國家等限制，而DSpace還沒考量到這點。

DSpace已經有良好的權限控管基礎，但仍需要有人進一步地改良，這也是DSpace-DLLL未解決的問題。

至於付費機制上，原本是為公開取用的DSpace就離這個功能更是八竿子打不著的關係，請營利公司自行加油吧。

分類與介面

作為一個泛用型典藏系統，DSpace的預設範本很樸實。我在DSpace-DLLL中修改了一些小細節，但是並沒有去調整他的設計，因此介面依然是很單調。

今天研討會時王老師提問說能不能更簡單地調整網頁的樣式，並且建立漂亮的分類架構。這也是她長久以來的一個疑惑。

用簡單的方式來修改網頁介面，例如拖曳、新增網頁元素、套用簡易範本，這在大多數CMS當中都已經是非常成熟的技術，不過DSpace在介面調整支援上，還不能簡單地使用。提示是XMLUI，但至今我仍未參透這個功能就是。

至於分類架構上，這可是一塊非常、非常、非常大的研究議題了。原本作為機構典藏之用的DSpace，將內容層級架構分成community、collection、item等層級，許多國外數位典藏系統也都是依照此架構在使用。但是數位典藏不像檔案管理有一套全宗原則，往往還是以客製化的方式設計分類架構為多。

這個客製化的要求並不是說DSpace的內容層級架構不能實作出來，事實上，像林巧敏老師負責的教育部中綱計畫成果資訊網就是一個很適合的例子。不過系統技術人員眼中的分類架構跟數位典藏人員來說有很大的差別。對於數位典藏人員來說，他們更在意的是對於每一種分類導覽功能的客製化。

以中綱計畫成果資訊網來說，在一個子計畫瀏覽中又可以依照藏品的類型來分類。若以DSpace實作，一個子計畫則是一個community，每一種藏品的類型是各自的collection，而底下每一筆資料則就是一筆item。那麼DSpace在介面呈現上能不能做到像中綱計畫成果資訊網一樣呈現？作為技術人員的我一定會跟你說：可以，但是要自己改。而這對許多不懂技術的人來說來說，其意義就與DSpace無法做到這種分類架構是同樣的答案。

總而言之，到頭來還是介面上的問題。而且這對泛用型典藏系統的DSpace來說，都已經快要是非戰之罪了。

然而，我認為DSpace在介面功能上的強大，對技術人員來說會有直接的感受。受惠於DSpace嚴謹地設計模式、詳盡的註解說明，技術人員可以輕易地利用DSpace的內容層級架構、瀏覽、搜尋功能做出各種客製化的分類架構，就像全國通識網課程資料庫一樣。我看過一些商用軟體的程式碼都還沒DSpace漂亮，這是真的。DSpace的程式非常嚴謹且靈活，不僅是容易使用，也很值得學習。

全文檢索的中文斷詞改善

在全文檢索的功能中，DSpace會依據檔案內文製作倒置索引檔，以此來達到全文檢索的功能。然而MIT與HP為西方人設計的DSpace並沒有很完美地考慮到各國的國情，中文斷詞只用二字詞的方式來切截。這會影響搜尋結果並不是十分漂亮。

中文斷詞全文檢索是一塊門檻不低的議題，DSpace-DLLL也沒有解決這個議題，但是未來仍可以從DSpace提供的plugin機制來進行修改，讓中文斷詞更為漂亮。

PDF的HTML網頁化

儘管現在PDF已經如此盛行，但我們真正要使用的時候，還是會希望他是以HTML網頁的方式呈現。只有網頁，才能讓我們能夠為他加上更多的服務，例如標註功能。

其實這幾乎脫離了DSpace原本的要求，但這也的確是我想做的一個功能。未來有機會的話再來挑戰看看吧。

DSpace-DLLL與我

如果有人欣賞DSpace-DLLL，那我會感到非常欣慰，辛苦努力總算有了代價。而DSpace-DLLL會不會像上述的未來發展一樣繼續改進，我希望會，但我也希望會有人來接手。至於我自己，也希望能有這個機緣能夠繼續改進。

機緣，那是很重要的條件。那就是有沒有繼續做下去的價值。也許很多人會認為「有！」，但那是站在使用者的立場來說的。作為開發者的我來說，有沒有價值，那又是另外一回事。

興趣來做的DSpace-DLLL，是以延畢換來的

我在政大圖檔所念了快要四年才完成學業，不瞞大家說，因為我都在玩──最後玩出這個DSpace-DLLL。

在幫忙百年圖書館史、教育部計畫、甚至是寫書的時候，儘管老師並沒有要求很多，但我卻仍會任性地挑戰自我。於是後設資料編輯功能出來了、虛擬機器出來了、更簡單的系統管理方式出來了、一本介紹DSpace的專書也快要出來了。

這並不是為了錢、也不是為了名聲、也不是為了他人（包括老師或是計畫助理），而是為了自己的興趣。那種「想看看跨越山丘之後的景色」是我持續前進的動力，這也往往讓我沉迷在此、樂在其中而不可自拔。

儘管學習的過程讓我感到開心，但我也知道，這其實並不是什麼值得驕傲的事情。當我每天在實驗室修改程式碼的時候，有些老師則是直接對我嘆氣：「唉，你怎麼都在搞這個，幹嘛還不畢業。」

我大概花了將近兩年的時間專搞DSpace，論文幾乎是寫完計劃書之後就放置不理了。每次陳老師想拿我來當學弟妹借鏡的時候，我內心其實都會為這種不顧學生畢業本分而玩樂於DSpace的行為感到汗顏。

在金錢上，因為幫忙計畫事宜，所以當時老師給的人事費仍可以補足日常生活所需。儘管如此，每學期的學雜住宿費仍得仰賴父母的支援。這對一個當時的年紀是應該在外面工作、養活自己的人來說，我這種為了興趣不顧一切的行為並不可取。

只是為了自我成就

DSpace-DLLL的發展並不像是國科會、教育部計畫一樣，是有實質的經費支援。它也不是我的畢業論文，對我的畢業也沒有實質的助力。這種基礎的系統建設並沒有太多學術上值得一提的研究價值，這也不是我想做的研究題目。

它就真的，只是我的興趣，只是一種自我成就，是幫忙計畫專案之後，學習了Java Servlet、AJAX、Linux、虛擬機器、自動安裝之後的一個成果產出與分享，就只是如此。

不能一直玩下去

人不去面對現實也要有個限度，至少這點我還是知道的。為自己設定一個折返點，做到一個程度就該收手，不能一輩子這樣玩下去。我想，這才是一個社會人應有的常識。

我玩得很開心，但是差不多了。

儘管如此，不會對DSpace-DLLL感到滿足的人總是會期望我或實驗室能夠繼續開發下去。我也希望如此，不過我更希望的是看到有人能接手，基於現在的基礎上，繼續深入開發。所以我寫書，我釋出系統，這是我的願望。

至於我自己能不能繼續做，那麼就要回歸現實問題，有沒有經費支援？對於我未來學業、工作上有沒有幫助？有多少經費做多少事情，這才是一種正常的運作模式。在沒有經費、憑著熱情來開發、供人自由取用的火柴人行為，這是可以拿來自己說笑的故事，但卻不是作為要求別人的條件。

~~所以誰誰誰快來聘我去工作吧，我就能名正言順地繼續玩DSpace了！！~~

結語

原本只是想記錄一下DSpace-DLLL的介紹投影片，沒想到越寫越多，就變成這樣落落長的一篇了。原本是打算花一個小時來寫，不過實際上似乎是寫了快三個小的樣子。都已經半夜兩點了，好睏。

那麼接下來就是努力讓DSpace-DLLL可以順利出版啦，加油～

(more...)

Evenote擷取應用：Add to Evernote書籤

布丁布丁吃布丁

5月 26, 2011 0 Comments 作品程式寫作電腦軟體

Evenote擷取應用：Add to Evernote書籤

Evernote有很多種方式擷取網頁資料，這種是利用Evernote指定網址擷取功能來實作的Add to Evernote書籤。

Add to Evernote書籤

安裝與使用

請將底下的書籤拖曳至您的瀏覽器上，就像上圖一樣的位置Add to Evernote
在你要擷取到Evernote的網頁中，按下Add to Evernote書籤，就像上圖一樣，點下去就對了。
Evernote擷取視窗會另外開啟，並讓你指定要保存此網頁的「記事本」與「標籤」

如果你沒有登入Evernote的話，他才會問你帳號密碼。

使用限制

如果是需要登入才能觀看的網頁，就無法透過Evernote伺服器來擷取。例如Pixiv。
擷取下來的網頁會參雜大量導覽訊息，導致記事太多多餘的內容，如下圖。

因此，此功能適合擷取公開、簡單的頁面，或是先儲存之後再來整理。至少他的擷取方式很簡單，連安裝擴充功能都不需要。

書籤補充擴充功能的不足

Google Chrome的Evernote擴充功能最近十分熱門，我自己也有安裝使用。只是擴充功能麻煩的地方在於Evernote時常會詢問你的登入狀態，Evernote預設7天就要重新登入，對於不常使用的我來說，每次要擷取都要先登入，而且擷取的時候千萬不能操控滑鼠點選其他地方，否則擴充功能會被取消、擷取也會失敗。往往是按下擷取，等待個5分鐘，然後看到Evernote擷取失敗的訊息，實在令人灰心。

儘管Evernote的擴充功能在擷取網頁上的方式上能夠智慧選擇，但對我來說只是要快速地備份這個網頁的內容、之後再修改的時候，在擴充功能操作限制之下，我會比較喜歡用Add to Evernote書籤。這也是我想寫這功能的原因之一。

結語：Bookmarklet練習

最近在看AJAX設計模式，看到Bookmarklet（或稱為favelet）技巧，忽然想到很多人都會在Google Reader加入傳送到Evernote功能，卻很少看到有人把此功能加到書籤去，於是我就自己寫了一個Add to Evernote書籤來用。

當然，現在這個Add to Evernote書籤還不夠漂亮，指定網址給Evernote伺服器去擷取，記事內容多餘的東西實在太多，只能作為記錄、備份之用而已。

不過這個技巧激發出許多我對AJAX應用的靈感。這是一種簡單的Plugin，是有需要才使用的userscript，簡單直覺又跨瀏覽器。（說到跨瀏覽器，在IE上運作時，開新視窗功能倒是一直被IE跟Google Toolbar擋下來，實在很煩耶XD）

之後有機會再用Bookmarklet做點什麼來玩玩吧。

參考資料

Mahemoff, Michael（2006）。Ajax設計模式（楊仁和譯）（初版）。臺北市：歐萊禮。
如何讓Bookmarklet開新網頁執行

(more...)

JSONP跨網域傳送檔案：以POST方法實作

布丁布丁吃布丁

5月 18, 2011 0 Comments 程式寫作碩士畢業論文 JavaScript Programming/JavaScript

JSONP跨網域傳送檔案：以POST方法實作

網頁應用設計中的JSONP技巧可以做到跨網域資料傳送的功能，但它卻只能傳送純文字資料，而我希望能在跨網域的環境下開發AJAX上傳檔案的功能，那麼就需要一些小技巧才能進行。

雖然我想應該也有人提出這個作法了，不過實際上在之前我並沒有找到過。因此我把這個在論文中實作的技巧在此記錄、分享。

這篇用到大量的網頁設計專有名詞，主要是以AJAX設計網頁應用的人為主要對象撰寫的。

範例

這個範例網頁中，你可以上傳一個檔案，並填寫下面的敘述Description，再按下UPLOAD按鈕上傳。伺服器會回傳給你檔案的上傳結果、檔案名稱、檔案大小。檔案上傳最大是1MB，超過1MB的檔案，伺服器會回傳錯誤結果。

原本我是將HTML網頁放在Dropbox空間（http://dl.dropbox.com/），而伺服器則是放在You Hosting的空間（http://pulipuli.co.cc/），想用兩個不同網域來呈現透過POST方式實作JSONP跨網域檔案上傳的範例。但是因為You Hosting放著一陣子就被強制關閉了，所以很遺憾的，在此無法看到線上即時的成果。（2011/9/19更新）

此範例中用了三個檔案，請直接下載研究、並自行配置使用吧：

SkyDrive 下載網頁
client.html （可以開啟，但是不能使用，因為Dropbox並不支援PHP功能）
client.js
server.php

應用背景

使用AJAX開發網頁應用的程式設計師，大多時候都是在同個網域之下處理client（使用者端電腦）與server（伺服器）之間的訊息傳遞。更進一步的，利用jQuery框架，以JSON物件、GET方式傳遞資料的jQuery.getJSON()函數，讓處理AJAX資料傳遞更為簡單。

但是我的論文中需要使用的AJAX跟上述常見情況有個很大的差別。第一個是跨網域，client端呼叫server端資料，這兩者是位於不同的網域，因此普通的GET或POST方式都無法讓client端取得server端的資料，必須仰賴JSONP(JavaScript Object Notation with Padding)技巧；其二，這次要傳送的資料並非純文字或可以用JSON來組織的資料，而是需要上傳二進位的檔案，或是超過GET資料傳送上限的資料量。在這種情況下是不能單純使用JSONP，必須使用POST方式與form表單傳送資料才行。

因此，我將POST的傳送優勢與JSONP的跨網域AJAX特色融合，寫成以POST方式實作的JSONP跨網域檔案傳送。

角色

在此應用中是以前端的瀏覽器與遠端的伺服器進行溝通合作，因此我先簡單敘述這兩種角色。

「C」 client

在這篇文章中，我以「C」表示「client」（客戶端）瀏覽器中執行的程式語言，主要是HTML跟JavaScript，這也是AJAX的基礎。多虧了jQuery框架克服了相容性問題，因此在Chorme、Firefox或IE都可以使用。

在此範例中，「C」是擺在Dropbox的空間，他並不具備伺服器端的功能，不能判斷檔案大小。此外，我將「C」的HTML外觀寫在client.html當中，而JavaScript的邏輯運作寫在client.js當中。稍候會再敘述他們的功用。

「S」 server

另外「S」代表「server」（伺服器），在此範例中我以PHP寫成，擺在You Hosting空間。伺服器端的程式語言具備了處理檔案的能力，可以判斷檔案大小。在此利用AJAX架構，讓「C」能夠與「S」進行溝通。

為了利用POST傳送檔案，並能以JSONP進行跨網域溝通，「S」必須判斷請求方式(request method)是POST還是GET。並以session來暫存狀態。

稍微有點概念之後，接下來就是實際看看這方法要怎麼運作了。

Step1. C1：資料準備

為了讓大家好理解，此範例中的檔案上傳做得跟傳統網頁一樣。這是一個<form>表單，裡面有個可以選擇檔案上傳的input，並限制只能上傳1MB大小的檔案，還有一個可以撰寫「Description」（敘述）的input，最後則是一個submit（遞交）的「UPLOAD」按鈕。

在這個表單前面，引用了大家的好朋友jQuery以及我另外寫的client.js；表單後面則有個<div>容器，負責顯示待會跟伺服器溝通的結果。

原始碼很簡單，寫在client.html中，摘錄如下：

<script src='http://www.google.com/jsapi' type='text/javascript'></script>
<script type='text/javascript'>google.load("jquery","1.2.6");</script>
<script src="client.js" type="text/javascript"></script>
<form id="form" method="post" action="http://pulipuli.co.cc/20110517-jsonp-post/server.php" enctype="multipart/form-data">
    <input type="hidden" name="max_file_size" value="1048576">
    <label>File: <input type="file" name="file" /> * Max File Size: 1MB</label>
    <br />
    <label>Description: <input type="text" name="description" value="The description of this file."></label>
    <br />    
    <button type="submit">UPLOAD</button>
</form>
<div id="output"></div>

另外，為了讓這個form表單能具備AJAX跨網域上傳的功能，我利用JavaScript幫他做了些初始化的調整，讓form的遞交會以AJAX方式進行，並設定回傳資料時所要執行的回呼函數(callback)。

這部份寫在client.js開頭，程式碼如下：

/**
 * Initialize Form
 */
$(function () {
    
    $("#form").submit(function () {
        
        if ($(this).attr("jsonp_by_post") == null)
        {
            $.jsonp_by_post(this, function (_result) {
                //...Step7時再講解... 
            });
            return false;
        }
        
    });
    
});

Step2. C2：AJAX式的POST遞交

當form的UPLOAD按鈕被按下時，就會開始一連串的AJAX式的POST遞交作業。

在此步驟中，JavaScript會做以下事情：

以timestamp作為辨識每次檔案上傳作業的代號。
讀取form的資料，並將timestamp設定到action的網址中，提供伺服器辨識每次檔案上傳作業的代號。
建立一個接收資料的iframe，隱藏之，並設定name。
調整form的action跟name，讓form的遞交會傳送到iframe去，而不是把整個網頁都替換掉。
給form做個記號（此範例用jsonp_by_post屬性），以免跟Step1初始化form的submit事件相衝突。
設定iframe遞交完成之後的後續動作。
form執行遞交作業。

程式碼寫在client.js，摘錄如下，其中6.設定iframe遞交完成之後的動作，我會在下面的Step4詳細敘述，這邊先以略過。

$.jsonp_by_post = function (_form_ele, _callback) {
    
    var _timestamp = (new Date()).getTime();
    
    var _form_obj = $(_form_ele);
    
    var _action = _form_obj.attr("action");
    var _action_post = _action + "?timestamp=" + _timestamp;
    
    //建立接收資料的iframe
    var _iframe_name = _action + _timestamp;
    
    var _iframe_obj = $('<iframe></iframe>')
        .attr('name', _iframe_name)
        .appendTo($('body'));
        
    //隱藏iframe
    _iframe_obj.css('width', '0').css('height', '0')
        .css('position', 'absolute').css('left', '-1000px').css('top', '-1000px');
    
    //調整傳送資料的form
    _form_obj.attr('action', _action_post)
        .attr('target', _iframe_name)
        .attr('method', 'post')
        .attr('enctype', 'multipart/form-data');
    
    //防止重複觸發初始化的事件
    _form_obj.attr('jsonp_by_post', 'true');
        
    //設定iframe讀取完畢之後的動作
    
    _iframe_obj.load(function () {
        
        //...Step4時再講解...
        
    });
    
    //執行遞交
    _form_obj.submit();
};

Step3. S1：伺服器接收POST資料

伺服器端的程式會依照請求方式的不同，決定此程式是要接收檔案上傳，還是要回報檔案上傳的結果。

在Step3中，form以POST方式呼叫了位於另一個伺服器的server.php，並執行以下動作：

接收$timestamp，作為判斷這次作業的辨識代號，並與一個特定的$header組成session使用的$index。
透過透過PHP的$_SERVER['REQUEST_METHOD']來判斷請求方式。
如果是POST，則將檔案的檔名、大小、以及從POST過來的description資料儲存在session當中。
判斷檔案上傳的狀態，失敗就是「error」，成功則是「sussesful」。
顯示一些資料，作為簡單偵錯。但其實可以省略。

以下程式碼寫在server.php中，摘錄如下。請求方式是GET的情況，我會在下面的Step6再來講解。

<?php
$header = "data";
$timestamp = $_GET["timestamp"];
$index = $header . $timestamp;

session_start();

if ($_SERVER['REQUEST_METHOD'] == "POST")
{
    $description = $_POST["description"];
    
    $_SESSION[$index]['name'] = $_FILES['file']['name'];
    $_SESSION[$index]['size'] = $_FILES['file']['size'];
    $_SESSION[$index]['description'] = $description;
    
    if ($_FILES['file']['size'] == 0)
    {
        $_SESSION[$index]['state'] = 'error';
        echo "false";
    }
    else
    {
        $_SESSION[$index]['state'] = "sussesful";
        echo "true";
    }
}
else
{
    // ...Step5時再講解...
}

Step4. C3：以JSONP取得檔案上傳結果

當iframe讀取完畢之後，「C」就可以知道檔案上傳動作已經結束。但是因為POST在跨網域的狀況下是無法取得iframe裡面的資料，所以必須要改用JSONP的方式來跟「S」取得結果。

這些動作寫在Step2中省略的iframe onload事件中，大概動作如下：

設定JSONP的網址，加入jQuery.getJSON()特有的callback=?參數。
執行jQuery.getJSON()，並設定執行完後的回呼函數。

這些程式碼寫在client.js中，摘錄如下。執行完getJSON()的回呼函數會在Step6講解。

    //設定iframe讀取完畢之後的動作
    
    _iframe_obj.load(function () {
        
        //設定get方法JSONP的網址，要注意加入了JSONP特有的callback參數
        var _action_get = _action + "?timestamp=" + _timestamp 
            + "&callback=?";
          
        $.getJSON(_action_get, function (_result) {
            // ...Step6時再講解...
        });
        
    });

Step5. S2：伺服器回傳檔案上傳的結果

以JSONP方式呼叫伺服器時，「S」是以GET方式運作，他會做以下動作：

接收$timestamp，並與$header組成$index。這跟Step3做的事情一樣。
判斷請求方法為GET。
取得回呼函數的代號$callback，這是搭配jQuery.getJSON的作法。
從$index取得session資料，將檔案上傳結果存進$output字串。
刪除session資料，避免後來有心人再利用同樣的timestamp取得資料。
以JSONP方式輸出。

以下程式碼寫在server.php中，摘錄如下：

<?php
$header = "data";
$timestamp = $_GET["timestamp"];
$index = $header . $timestamp;

session_start();

if ($_SERVER['REQUEST_METHOD'] == "POST")
{
    // ...Step3講解...
}
else
{
    $callback = $_GET['callback'];

    $output = '';
    if (isset($_SESSION[$index]))
    {
        $output = $_SESSION[$index]['state'].'; ' 
            .$_SESSION[$index]['name'].'; '
            .$_SESSION[$index]['size'].'; '
            .$_SESSION[$index]['description'];
            
        unset($_SESSION[$index]);
    }

    if (is_null($callback))
        echo $output;
    else
        echo $callback."('".$output."');";    
    
}

Step6. C4：接收資料，復原form，呼叫回呼函數

以jQuery的getJSON取得資料之後，接下來就是復原form、刪除臨時建立的iframe，然後呼叫回呼函數。

這段程式碼也很簡單，寫在client.js中，摘錄如下：

        $.getJSON(_action_get, function (_result) {
            
            //復原form
            _form_obj.attr('action', _action)
                .removeAttr('target')
                .removeAttr('jsonp_by_post');
            
            //移除iframe
            _iframe_obj.remove();
            
            _callback(_result);
        });

Step7. C5：結果輸出

在Step1初始化時設定好的回乎函數會在最後接收資料，然後將結果輸出到div容器中。程式碼寫在client.js的上方，摘錄如下：

            $.jsonp_by_post(this, function (_result) {
                $("#output").html("Message: " + _result);
            });

如果檔案正常上傳，你會看到以下畫面：

如果你上傳超過1MB的檔案，則伺服器會記錄錯誤狀態，於是會看到以下畫面：

這樣就大功告成啦！

變化與應用

範例中的講解很簡單，身為能夠舉一反三的程式設計師，腦袋裡面應該已經呈現出很多不同的應用方式吧。這邊我大略提一下幾個變化的重點，還有最後應該注意的安全性問題。

資料的輸入

在此範例中，我所有資料都是來自於撰寫好的form表單。實作時，我們的原始資料不一定是真的來自form表單，通常會以JSON、陣列、變數形式存在記憶體中，以方便JavaScript進行處理。

如果是以JSON等非form的資料型態，想要進行跨網域的AJAX傳輸，那麼你還是得要自己將這些資料寫成form，這樣才能以POST進行遞交。雖然多了點步驟，但相信對於熟悉jQuery的你來說應該不是什麼問題。

安全性問題

網頁之間有很多跨網域的限制，而本篇旨在於打破這個跨網域限制來做到更多功能，但相對的就會負擔起更多安全性問題。

提供JSONP的服務，很容易就會受到跨網域指令碼（Cross-site Script）的攻擊，而被找漏洞、挖出使用者的資料。我並不是資安專家，對這方面研究還不夠深入，只能提供幾個簡單的安全性加強方向。大致上，我建議搭配身分認證的session、來源IP或網址，來判斷這個C是否有跟S溝通的資格，S再決定是否接受C的POST或GET請求。這樣應該會安全許多吧。

範例程式中為了講解方便，所以並沒有加上這些措施。如果你要將這個方法放到自己的應用程式中，請務必做好安全性的防範措施。

結語

這是我論文系統中實作的一個技巧，但因為論文無法寫出這些細節，所以我以寫blog的方式，記錄這個技巧的細節，供有需要的人參考。實際上這篇從想寫、擬完心智圖、寫了一半覺得不滿意、又改了好多次，到現在才完成。

這只是一個很基礎的AJAX技巧，可以應用到很多地方，可以進一步寫成更漂亮的framework或library。也許已經有人發表過這種方法了也說不定，不過，我另一個目的也只是給未來的自己留下一個參考而已，就作為一篇記錄吧。

(more...)

訂閱：文章 (Atom)

自我介紹

經歷

[2008~ 2011] 陳志銘教授主持的行政院國科會專題研究 計畫助理

[2008~2010] 教育部全國通識教育資源平台建構與永續發展計畫 研究助理

[2009] 國立臺中圖書館獎助博碩士班學生研撰圖書資訊學位論文獲選

[2008] 政大圖檔所數位典藏實務與加值服務研習班工作人員

[2008] 華藝公司GCScholar資料庫測試員

[2007~2008] 政大圖檔所、數位圖書館與數位學習實驗室之伺服器設備管理維護

[2007] 政大圖檔所頂尖大學計畫「臺灣百年圖書館史暨數位圖書館先導計畫」計畫助理

[2007] 中華民國圖書館學會50屆會員大會 舞台表演

[2007] 臺灣圖書館數位典藏現況與展望研討會 工作人員

[2007] 國際學校圖書館事業學會IASL 2007年 年會志工

[2005~2007] 林麗娟教授主持的行政院國科會專題研究 計畫助理

[2006~2007] 國科會95年大專生參與專題研究計畫執行者

[2007] 輔仁大學圖書資訊學系 系友與學生互動網 建置

[2006~2007] 英國語文學系英文卓越教學計畫助理

[2006~2007] 輔大圖資電腦教室工讀生

[2003~2004] 輔仁大學圖書館服務隊

[2004] 輔仁大學圖書資訊學系 班代表

[2004] 全國大學學生議會及議事員研習營 工作人員

著作目錄

專書

期刊論文

研討會論文

報告

作品

網站

Blogger工具

JavaScript程式

其他

課程典藏

文章註解

初次碰觸大型系統

後話

摘要

一、建置目的

二、內容架構

三、系統建置過程

伺服器及系統

版本及各別說明

調整php.ini增加檔案上傳大小上限

安裝XOOPS前，先做過UTF8化

MySQL建立資料庫的校對

XOOPS資料庫連線的編碼

安裝之後再修改XOOPS參數設定

修改CBB論壇

增加FCKeditor，提供較容易上手的Word編輯環境

XOOPS與CBB論壇模組

CBB論壇修改要點

PHP主程式碼

記錄身分資訊

CBB論壇與網站對應

類別

論壇

主題

XOOPS程式移殖注意事項

四、內容維護

管理者登入

發新主題

新增會議記錄

檔案要經過PDF加密

其他功能

五、建置成果

首頁

論壇首頁──最新消息

編輯畫面

會議記錄頁面

研討會說明頁面

六、未來發展

與Dspace整合

需要專職的內容維護人員

基於XOOPS的修改

特製的輪播照片與標語

被捨棄的XOOPS系網站

小結

關於DSpace-DLLL

回應項潔館長的問題

未來的方向

虛擬機器的限制

大量資料的處理

[2008~ 2011] 陳志銘教授主持的行政院國科會專題研究計畫助理

[2008~2010] 教育部全國通識教育資源平台建構與永續發展計畫研究助理

[2007] 中華民國圖書館學會50屆會員大會舞台表演

[2007] 臺灣圖書館數位典藏現況與展望研討會工作人員

[2007] 國際學校圖書館事業學會IASL 2007年年會志工

[2005~2007] 林麗娟教授主持的行政院國科會專題研究計畫助理

[2007] 輔仁大學圖書資訊學系系友與學生互動網建置

[2004] 輔仁大學圖書資訊學系班代表

[2004] 全國大學學生議會及議事員研習營工作人員