Pixmicat!2 : AJAX Based Pixmicat! (暫定)
本條目記載的內容為尚未完成的版本之設計概念和草稿,並有可能隨時間或成品釋出而有更改架構的情形,將不另行告知。

概述

Pixmicat!2 (暫稱) 為 Pixmicat! PIO 版的進階延伸版本。主要以此版本加上 AJAX 的概念實現使用者介面,藉以讓使用者獲得全新且快速的體驗。

計畫於 PIO 版完成後再以 PIO / FileIO 函式庫為基礎作出新版,因此支援的資料來源跟 PIO 版相同。擺脫舊有的 pixmicat.php 程式碼而重新開發,這樣一來也可以擺脫 GazouBBS / futaba 的私有條款包裹。

核心架構

REST (Representational State Transfer)

構思來自於 Ruby on Rails。將各個執行部份拆開 (也就是微核模式),不似以往版本龐大的單檔。其他功能部分開成檔案供需要時再引入使用。一個 index.php 會接收參數並依照參數的要求來引入適當的檔案完成所要的工作。

例如:

  • GET pixmicat.php/comic/show/1 : 取得 comic 版面第 1 頁
  • GET pixmicat.php/comic/threads/486/2 : 取得討論串 No.486 第 2 頁內容
  • POST pixmicat.php/comic/posts : 投稿 comic 版面新文章
  • DELETE pixmicat.php/comic/posts/589 : 刪除 comic 版面 No.589 文章
  • GET pixmicat.php/comic/action/status : 顯示系統狀態
  • GET pixmicat.php/comic/action/remake : 重新生成快取
  • GET pixmicat.php/comic/search : 搜尋功能
  • GET pixmicat.php/comic/admin : 顯示登入頁面
  • POST pixmicat.php/comic/admin : 認證頁面
  • GET pixmicat.php/comic/admin/show/2 : 後端管理第二頁
  • PUT pixmicat.php/comic/posts/589 : 修改 No.589 文章屬性
  • GET pixmicat.php/comic/module/mod_XXX : 使用 mod_XXX 模組

AJAX

Asynchronous JavaScript and XML (非同步 JavaScript 和 XML)1

雖然不是新技術了 (事實上是數個舊技術的結合),但是其嶄新的體驗讓使用者感受到 Web Application 的概念而不再只是單純的網頁。主要使用瀏覽器原生 XMLHttpRequest 物件 、 JSON 和 DOM 來完成。以 XMLHttpRequest 物件要求遠端物件,並以 JSON 格式回傳解析,再以 DOM 方式改變網頁內容,同時也可以做到送出資料而不必重新整理頁面。

JSON

RFC 4627 標準的 JSON2 ,全名為 JavaScript Object Notation。因其與 JavaScript 的高度配合、架構簡單且易讀、檔案又較滿是標籤的 XML 來的小,近期有取代 XML 而成為 AJAX 的搭配的趨勢。

http://www.json.org 為其官方網站,有介紹其格式。

PIO

請參照 PIO 條目。

利用 PIO 函式庫一統所有資料來源,不必為各來源的操作煩心。

FileIO

同上,懶的再寫了。

PTE Client Version

利用 XMLHttpRequest 要求 JSON 資料並解析後,利用 DOM 更改網頁內容。而將這些資料排版成討論串版面架構則要靠 PTE Client Version。不同於 PTE,這是運作在瀏覽器端而非伺服器端。因此可預期伺服器的負載應該會減輕,但相對的瀏覽器端的負載會加重不少。

版本目標

  • AJAX 化,將大多數的工作交給當今各使用者擁有之強大電腦的瀏覽器執行
  • 希望一改 Pixmicat! 目前各檔案混雜狀況,看要是全部整合,要不就是重新分類
  • 希望能將程式和介面分的更開,讓使用者完全自訂顯示的樣式,功能則不變
  • 舊有架構太亂,維護不易,且受限於 GazouBBS / futaba 私有條款。以全新框架來解決問題

設計要點

  • XHTML 1.0 Transitional 化 (1.1 太嚴格不合用)
  • 從原本的 PHP 小程式變成 Web Application 的概念
  • 瀏覽版面導入 AJAX, JSON,文章使用動態要求並輸出,當然可以快取
  • JavaScript + CSS + XHTML + 圖片資源
  • 上傳使用隱藏 iframe 處理
  • 將各個架構以資料夾分明便於分辨及維護
  • 本體直接支援多設定檔、多版面設定
  • 頁面從 1 開始,不再從 0
  • 導入 REST (Representational State Transfer) 架構風格
  • 活用 $_SERVER['PATH_INFO'], $_SERVER['HTTP_METHOD'], $_SERVER['HTTP_ACCEPT']
  • 將各動作控制區塊分開,取代以往的巨型框架。需要時再取用

受限於 Wiki 語法及排版,原始文字檔將放於readme.txt

預定設計流程

  1. 完成 Pixmicat!-PIO 第一次釋出
  2. 撰寫 index.php ,這是新的頁面主體,可以作為樣版修改
  3. 定義討論串資料輸出的 JSON 格式及其他參數(比方說總共頁數/目前頁數)之讀取
  4. 完成 xmlHttpRequest 物件包裝,並試讀取靜態快取 (其內為討論串資料及參數之 JSON 格式)
  5. 完成 PTE Client Version 的撰寫,輸出排版過的討論串並印在 index.htm 上
  6. 完成 PHP 頁面要求討論串資料的 JSON
  7. 完成分頁功能
  8. 完成發文介面
  9. 完成搜尋功能
  10. 完成後端管理介面,預定以 mod_pmcadmin 模式為主體
  11. 完成 AJAX 的瀏覽歷史破壞問題及討論串的回應頁面靜態 URL
  12. 雛型完成,細部修改後準備內部測試
  13. 本體完成,除錯後準備進行公開測試
  14. 公測完成,最後檢查後準備進行包裝及釋出
  15. 正式定名,釋出問世

可能問題

  • 瀏覽者的經驗: 需要重新適應
  • 瀏覽器相容性不一: PC 主流瀏覽器的支援還好,可攜式裝置的瀏覽器是個問題
  • 需要開啟 JavaScript: 特別注意需防範跨網站指令碼 (Cross-Site Scripting, XSS) 攻擊
  • 瀏覽器瀏覽歷史錯亂問題: 主流的 AJAX Framework 皆已解決,可以參考
  • 搜尋引擎、代理伺服器快取問題: 幾乎無法快取內容,這方面就得犧牲
除非特別註明,本頁內容採用以下授權方式: Creative Commons Attribution-Noncommercial-Share Alike 2.5 License.