Page Keygen 防止使用者同時開啟多視窗瀏覽同一個頁面

在現有維護的專案中，其中一個教學系統提供影片單元，

可以讓學生觀看教學影片，並且紀錄學生在各單元影片的學習進度及完成度。

卻發現有部分學生透過開啟多個瀏覽器，或者跨不同裝置來同時播放教學影片的方式快速累積完成度。

為了防止這種狀況，針對這個問題，設計了 Page keygen 的方式來進行處理：

（本文內容後續有修正，請對照修正相關註解）

首先，在系統資料庫新增 table 用來儲存 keygen, active, updated_time, created_time

取得請求時，會依照以下幾個因素來進行判斷

(1) keygen是否存在

(2) 有效(active=1)

(3) 尚未過期 (updated_time <=30 ) （修正，後續棄用）

在學生訪問學習網頁時，

系統會偵測該學生 Key 是否存在，若已經存在，就會警示該學生不可同時開多分頁或跨裝置觀看影片

若不存在，則開始生成第一組 Key ，儲存於資料庫並且傳送到客戶端進行儲存

在客戶端瀏覽器，需要留意 Key 必須儲存於公用變數，而不能存在 cookie或localstorage

才能達成同瀏覽器且不同分頁，能成功產生不同得key

在學習過程中，需要將學習紀錄傳給後端，記錄在資料庫中

這時，前端透過 Ajax 將 Page key 傳到後端，後端檢查此組 Keygen 是否與資料庫有效的 Key相同，（修正，後續調整為前端每隔 5秒透過 Ajax 與後端進行檢查）

相同的話，就將紀錄學習狀況，並且更新該組key的updated_time （修正，若 key 是有效的，則持續進行動作，若 active 為 0，則跳出確認視窗，說明另一裝置已有在觀看，請問是否切回本裝置繼續觀看）

（修正，若使用者點選確認切回本裝置繼續觀看，會透過 upate_page_keygen ，會將目前 key 回傳至後端進行更新，以此key為主）

另外，若學生在同一個頁面，可能中途離開超過30分鐘，導致 key 超時失效（修正，後續棄用）

這時，不重載入的情況繼續學習時，仍會透過 Ajax 傳輸學習狀況到後端時，後端會知道目前所有key都失效，就會產生新key記錄於資料庫，再回傳給前端進行更新（修正，後續棄用）

若沒有 key，檢查目前無有效key存在，則同樣產生新 key紀錄在資料庫，再傳送給前端進行更新（修正，後續棄用）

當學生觀看影片結束後，前往其他單元或關閉瀏覽器時

將會呼叫 page_close() 並且透過 Api 通知後端要將這組 key 註銷，設定為 disable

此外，三十分鐘有效時間，可避免在一些邊際情況（修正，三十分鐘有效時間後續已棄用）

例如，網頁突然當掉，會引發資料庫中的key的 active狀態不會被disabled，會造成 key 被鎖死的問題

因此，透過 updated_time 30 分鐘的有效限制，就可防止這種問題，超過時間就會自動將 key 進行註銷

版本 2019-01-09 00:14 2019-01-29