第四章 雛型系統設計與建置
第二節 系統設計
國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
67
合中的文件，其儲存資料的欄位並不會被限制，也就是說相同文件中的欄位組合 數量不一定都一致，且相同文件中的相同欄位名稱，其儲存的資料形態也可以改 變；另外 MongoDB 中的資料建模(Data Modeling)方式，建立應用程式中物件之 間的關聯性，透過這種方法可以做出類似關聯式資料庫中資料表間相互的關係狀 態。基於 NoSQL 資料庫使用上的彈性，以及可建立類似關聯式資料庫的資料表 關係的方式，本研究選擇使用 MongoDB。
第二節 系統設計
壹、標籤編碼
標籤編碼部分，本研究使用 EPCglobal 標準規範的 GID(General Identifier)；
GID 編碼格式分成四個區塊分別為 EPC 標頭、通用管理者代碼、物件類別，和 序列號，如表 4-5 所示。
EPC 標頭定義 EPC 的長度、識別類型和標籤的編碼結構；通用管理者代碼 為組織代號或公司代碼，需向 EPCglobal 註冊取得；物件類別用來辨識物件的商 品與類型，共有 24 bits；序列號賦予特定物件類別下每個物件一個唯一序列號，
有 36 bits，能讓管理者作編碼的欄位只有物件類別和序列號兩個區塊，以下本研 究針對這兩個欄位編碼。
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
68
表 4-5：GID 的邏輯區塊與位元數
邏輯區塊 EPC 標頭 通用管理者代碼 物件類別 序列號
位元數(bits) 8 28 24 36
資料來源：本研究整理
本研究參考故宮精品網站做基金商品的分類，該網站所販售之基金商品約莫 2500 種上下，假設每年新增 2500 種基金商品，以 18 bits 的編碼空間可以用約 100 年，物件類別區塊有 24 bits，用掉 18 bits 還有 6 bits 可作為未來擴充使用；
該網站商品分類有兩層，第一層商品分類 1(主分類)，其分類項目包括生活風格、
典藏精品、流行趣味、書法繪畫、設計文具、飾品配件、圖書影音，和其他(焦 點活動、暢銷禮品，和促銷總覽)共 8 種，本研究設計以 4 bits 作分類，可有 16 個分類空間，多出來的 8 個可作為未來擴充使用；第二層商品分類 2(子分類)，
經觀察每個主分類下，目前最多 9 個子分類，本研究規劃 4 bits 作分類，多出來 的空間作為未來擴充使用；18 bits 用了 8 bits 還剩下 10 bits，作為每種基金商品 類別的序列號編碼，本研究的物件類別區塊編碼可參考表 4-6 所示。
‧
物件類別(Object Class)0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
‧
序列號(Serial Number)0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 … 0 urn:epc:id:gid.0614141.3.123 為例，原本轉換出來的 FQDN 為
3.0614141.gid.id.onsepc.com，在本研究中需轉換成 123.3.0614141.gid.id.onsepc.com。
參、資料庫設計
資料庫部分設計的實體關係圖(Entity Relationship Diagram，ERD)如圖 4-4 所示。首先參考標籤的編碼，設計分類的資料儲存方式，所用到的實體包括
category、main_category、sub_category、product_category，和 spec_category，category 定義分類會使用到的基本屬性像是 id、name(分類名稱)，和 number(分類號)給剩 下四個分類實體繼承，各分類之間承階層關係如圖所示由上至下。
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
71
圖 4-4：實體關係圖 資料來源：本研究整理
main_category 儲存主分類資訊，包括記錄分類重複使用資訊(reuse_counter)，
一個主分類會有一個到多個子分類；子分類資訊儲存在 sub_category 實體中，記 錄子分類名稱和分類號，每個子分類下面會有一種到多種產品分類；產品分類的 資訊記錄在 product_category 實體中，並有屬性 desc(描述)儲存產品分類的相關 描述，每個產品分類下會有一種到多種產品規格；產品規格資訊儲存在
spec_category 實體中，並記錄產品規格相關資訊於屬性中，像是價格(price)、圖 片名稱(image)，和相關描述(desc)。
接著是 product_category 有關係的實體(antique 和 user_activity)；N 博物館的
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
72
產品皆由相關文物衍生，antique 實體記錄的是文物資訊，包括屬性 id、name(文 物名稱)、image(文物檔案名稱)，和 desc(文物描述)，每種產品會對應到一種或 多種(組合型產品)文物。user_activity 實體記錄系統產生的使用者活動，藉由這些 活動資訊與使用者互動，本研究作簡單的推薦系統作範例，當使用者掃描一個產 品標籤，系統推薦會其他類型的產品並將資訊記錄在 user_activity 中，所以一個 產品類別會有零個到多個使用者活動。
另外還有 digi_resource 實體和 antique 實體之間的關係，digi_resource 意思為 數位資源，負責儲存 N 博物館線上數位資源，並與 antique 有一對多的關係，讓 本研究系統可以藉由基金商品找到對應的文物，再透過文物近一步找到相關的數 位資源，讓這些數位資源能因為本研究的雛形系統而整合。
spec_category 實體有關係的 product 實體；在每個產品規格下會有許多實體 產品，以衣服來說明的話就像是記錄白色 M 號衣服 1 號、2 號、3 號…等以次類 推；這些實體產品的資訊記錄在 product 實體中，相關屬性包括 id、name(產品名 稱)、number(產品序列號)、code(產品 EPC 編碼，在資料存進 product 實體前，
會將 main_category、sub_category、product_category、spec_category，和 product 實體中的號碼也就是 number 和 main_category 中的屬性 reuse_counter，依照本研 究設計的標籤編碼方式進行編碼，並儲存在 code 屬性中)，和 is_public(儲存布林 值 true 或 false，表示是否可以被查詢)。
最後是 product 實體和 query_log 實體之間的關係，每個產品標籤被掃描後
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
73
會向伺服器要產品相關資訊，這時候伺服器會將使用者掃描產品標籤的資訊記錄 下來，query_log 實體相關的 id、user_id(識別使用者的字串)，和 from_view(記錄 使用者是在何種畫面掃描產品)。
肆、移動設備使用者介面
程式被開啟時的畫面是空白的如圖 4-5 左圖所示，使用者掃描基金商品上的 標籤後，程式會更新使用者介面如圖 4-6 右圖所示，並且直接開啟商品的介紹網 頁(商品介紹網頁的頁面設計後面會說明)，接著使用者就可以點擊按鈕(購買商品、
活動，和離開)操作程式，當點擊離開時，程式畫面會再回到圖 4-5 左圖。
圖 4-5：移動設備使用者介面 1 資料來源：本研究整理
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
74
參考圖 4-5 使用者點擊購買商品按鈕時，會開啟圖 4-6 左圖的畫面，跟隨畫 面提示掃描欲購買的基金商品，掃瞄過的商品會顯示在畫面中的清單中，最後點 擊購買商品按鈕進行購買商品；參考圖 4-5 的活動按鈕，括號中的數字代表使用 者尚未閱讀的活動資訊，點擊活動按鈕進入圖 4-6 右圖的活動清單畫面，使用者 讀取過訊息後，系統會在資料庫中將 is_public 欄位更新為 false，代表使用者已 經讀取過，則不在顯示於活動清單之中。
圖 4-6：移動設備使用者介面 2 資料來源：本研究整理
伍、基金商品介紹網頁
使用者用移動式設備掃描基金商品上面的標籤後，程式會開啟基金商品介紹
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
75
網頁如圖 4-7 所示，描述基金商品的相關資訊，如基金商品名稱、圖片、描述，
和規格等資訊，會在網頁的上半部分顯示。
圖 4-7：基金商品介紹網頁 1 資料來源：本研究整理
網頁的下半部分介紹文物資訊，為該基金商品所衍伸的文物，畫面如圖 4-8 所示，介紹文物的相關資訊包括文物名稱、圖片，和描述等，若 N 博物館有製 作該文物相關的數位資源，則在文物描述的下方會顯示與文物相關的故宮數位資 源網頁按鈕連結。基金商品介紹網頁的實作畫面，可以參考雛形系統建置與畫面 呈現章節中的移動設備上的程式部分。
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
76
圖 4-8：基金商品介紹網頁 2 資料來源：本研究整理
陸、標籤管理系統使用者介面
標籤管理系統介面如圖 4-9 所示，管理主分類、子分類、產品分類、規格分 類，以及每個個別實體基金商品的資料維護(增刪改查)，另外還有產生個別實體 基金商品的標籤編碼，和將標籤編碼與服務對應的資訊更新至 ONS 等功能。
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
77
圖 4-9：標籤管理系統使用者介面 資料來源：本研究整理
柒、服務網址格式
服務網址部分本研究使用 REST(Representational State Transfer)表示方式，會 用到服務網址的地方包括標籤管理系統，和移動設備向後端伺服器請求服務，以 下分述。
一、標籤管理系統的服務網址
管理主分類用的 URL 路徑如表 4-8 所示；用 GET 方法請求/admin/categories 網址，會開啟主分類清單網頁，用 POST 方法將新增的主分類資料傳送至
/admin/categories 網址則新增一個主分類；/admin/categories/:id 用 GET 方法請求，
會開啟特定主分類的詳細資訊網頁(查詢)，PUT 方法用於修改特定主分類的資訊，
DELETE 方法用於刪除特定主分類；/admin/categories/new 用 GET 方法請求，為
‧
開啟新增主分類表單網頁，/admin/categories/:id/edit 用 GET 方法請求，為開啟修 改主分類表單網頁。
表 4-8：標籤管理系統的服務網址 1 URL 路徑 HTTP
請求方法 /admin/categories GET
POST /admin/categories/:id
GET PUT DELETE /admin/categories/new GET /admin/categories/:id/edit GET 資料來源：本研究整理
管理特定主分類下面的子分類 URL 路徑如表 4-9 所示；用 GET 方法請求
/admin/categories/:category_id/sub_categories 網址，會開啟特定主分類下面的子分 類清單網頁，用 POST 方法將新增的子分類資料傳送至
/admin/categories/:category_id/sub_categories 網址則新增一個子分類在特定的主 分類之下；/admin/categories/:category_id/sub_categories/:id 用 GET 方法請求，會 開啟特定主分類下面子分類的詳細資訊網頁，PUT 方法用於修改特定主分類下 面子分類的資訊，DELETE 方法用於刪除特定主分類下面的子分類；
/admin/categories/:category_id/sub_categories/new 用 GET 方法請求，為開啟新增 子分類表單網頁，/admin/categories/:category_id/sub_categories/:id/edit 用 GET 方 法請求，為開啟修改子分類表單網頁。
‧ 國
立 政 治 大 學
‧
Na tiona
l Ch engchi University
79
表 4-9：標籤管理系統的服務網址 2
URL 路徑 HTTP
請求方法 /admin/categories/:category_id/sub_categories GET
POST /admin/categories/:category_id/sub_categories/:id
GET PUT DELETE /admin/categories/:category_id/sub_categories/new GET /admin/categories/:category_id/sub_categories/:id/edit GET
資料來源：本研究整理
管理產品分類用的 URL 路徑如表 4-10 所示；用 GET 方法請求
/admin/product_categories 網址，會開啟產品分類清單網頁，用 POST 方法將新增 的產品分類資料傳送至/admin/product_categories 網址則新增一個產品分類；
/admin/product_categories/:id 用 GET 方法請求，會開啟特定產品分類的詳細資訊 網頁，PUT 方法用於修改特定產品分類的資訊，DELETE 方法用於刪除特定產 品分類；/admin/product_categories/new 用 GET 方法請求，為開啟新增產品分類 表單網頁，/admin/product_categories/edit 用 GET 方法請求，為開啟修改產品
/admin/product_categories/:id 用 GET 方法請求，會開啟特定產品分類的詳細資訊 網頁，PUT 方法用於修改特定產品分類的資訊，DELETE 方法用於刪除特定產 品分類；/admin/product_categories/new 用 GET 方法請求，為開啟新增產品分類 表單網頁，/admin/product_categories/edit 用 GET 方法請求，為開啟修改產品