相信現在每個人都需要在網路上查尋資料 字典、捷運、網路拍賣、火車時刻表 但是每查一個東西都需要開一個網頁 穿越過一大堆廣告、不必要的文字或圖片 這時候如果有同樣功能的Gadget用就方便多了 在這裡分享一下我將一些查尋網站轉成gadget的一些程式設計上的心得 ____________________________________________________ 1.適不適合轉成gadget使用? 並不是所有的網站都適合轉成gadget，第一個考慮到的就是版面的問題 因為在iGoogle的用意就是將不同的工具濃縮放在一起 若是某些網站功能，像拍賣網、購物網這種需要很大的版面來顯示圖片 而又沒有辦法精簡，就算精簡了，使用者也用起來綁手綁腳 2.該網頁資料截取的難易度? 將網頁轉成gadget的目的必定是要將我們需要的資料從龐大的HTML中截取出來 然而最困難的步驟，就是在於你必須寫一個程式去讀取別人網頁的source code 若是該source code產生沒有規律性，亂七八糟，這時就要寫一大堆判斷去避開 不需要的資料 3.主要技術 (API部份請參照Gadget Javascript程式庫http://tinyurl.com/yownhp) content type選擇: Gadget的內容有三種類型 html 、 html-inline、URL 將網站放到gadget上最簡單的方法就是使用URL，但是這樣一來我們就沒有辦法把 source code抓出來精簡後再呈現，所以URL只適用於原本就設計成很小的網頁 而這篇文章的重點是要將大版面的網頁轉成小gadget， 因此建議content type使用 html 類型 設計步驟: 如果某些網站若沒有用到特殊的技術，只有簡單的HTML，不用cookie,session 例如 : yahoo字典、縮網址 等等 ，那麼處理起來都是大同小異 不外乎以下這幾個步驟 ------------------------------------------------------------------ A.設計你的Gadget版面 -> B.抓取該原始網頁原始碼 -> C.截取需要的資料 -> D呈現版面 ------------------------------------------------------------------ 最困難的應該在於A和C的步驟 至於B步驟: iGoogle提供的Javascript API中有個function 叫 _IG_FetchContent() 只需要將網站URL丟進去這個function 會幫你把原始碼抓出來 D步驟: 只需要在資料處理完時 用_gel()改掉HTML，show 出結果就好 舉例: yahoo字典 這裡舉一個yahoo字典的例子 當我輸入要查的單字 例如"test" 再按送出 會傳到這個網頁 http://tw.dictionary.yahoo.com/search?ei=UTF-8&p=test 而網址後的test即是我要查的單字 因此這裡可以設個變數去存使用者要查尋的 單字然後再把它和"http://tw.dictionary.yahoo.com/search?ei=UTF-8&p=" 接起來之後再丟進IG_FetchContent()就可以得到查尋結果的source code了 抓到source code後就要做精簡 運用.indexOf() .substring() 取出需要的地方 整理好後再show出來 4.版權問題 小弟在發表這篇文章前想了很久，因為我不清楚這種直接用HTTP get、post截取對方 的web算不算侵權，還是像crawler、搜尋引擎一樣，憑良心看要不要遵守對方的 robot.txt，不過我想無論如何繼然是要用人家的東西，所以千萬還是要尊重一下版權 最少還是要註明一下所有權才是... -- --

※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 59.121.14.35