LV. 43
GP 36k

【插件】改造巴哈的信箱,變成像通知一樣的插件

樓主 解凍豬腳 johnny860726
257 -

作者標示-非商業性

本授權條款允許使用者重製、散布、傳輸以及修改著作,但不得為商業目的之使用。使用時必須按照著作人指定的方式表彰其姓名。

 

雖然只有不到 300 行 code,但也費了很大的功夫才寫好

會有這樣的靈感發想,是因為右上角的按鈕幾乎都是展開式通知、選單

頭像不計的話,唯獨信箱要另開頁面才能看最近的信,讓人覺得很煩躁

不只如此,五年半以前我也曾經去站務中心建議過

站方的結果似乎是不太希望改成這樣,所以想想乾脆自己來寫還比較快




功能就是讓收信匣和寄件備份匣變得跟左邊三顆展開式通知列表一樣(可切換)

如果有未讀信件的話,也會像其他通知一樣顯示未讀數在上面

因為是直接讀信件匣,所以這裡的未讀信件會顯示得比左方推播通知還快



安裝方法:
  1. 在這之前你必須安裝 Greasemonkey、Tampermonkey 之類的擴充元件
  2. 進入這個網址,點選安裝



說明/聲明:
  1. 為了避免造成站方負擔,腳本只讀取該信件匣的第一頁,所以第二頁(及以後)頁數的信件都不會顯示(第二頁開始的未讀信件也會被忽略)。
  2. 同上理由,亦為了避免造成站方負擔,本腳本不會像左邊的通知一樣每 60 秒重新讀取一次,寫這個腳本的初衷只是想做成列表方便點開看。
  3. 因為站方沒有提供單獨瀏覽寄件備份信的 PHP 頁面,所以寄件備份匣的信會以轉寄頁面開啟。
  4. 因為站方在 mailbox.gamer.com.tw 網域下沒有提供「取得巴友暱稱」的 API,所以轉寄信件匣只會顯示收件者帳號而非暱稱。
  5. 本插件並沒有違反 CORS(跨域資源共用)原則,故安全無虞。
  6. 截圖信件標題純屬虛構,未違反站規 24。



開發誌/原理:

  原本靈感來了,很興奮地打開 Tampermonkey 就是一股腦地開始動手 coding,當下只是很單純地想:「只要用個 AJAX 抓資料就可以了吧?」

  結果我錯了,不管怎樣就是會遇上跨網域存取的問題(註 1),這讓我頭痛很久。

  後來我想到可以生出一個 iframe 再把 mailbox.gamer.com.tw 嵌進去,就真的嵌了。接著我很天真地直接 getElementById(iframe).innerHTML 就想要把 iframe 的資料抓出來,結果還是一樣被瀏覽器提醒違反 cross domain 原則(所以資料是看得到抓不到)。

  後來靈機一動,就把這個腳本分成不同網域來執行,讓腳本去判斷並分別處理 iframe 以外(通知外框、按鈕)跟以內(信件列表)的資料。因為我是用站方的架構把樣式重建起來,所以它看起來跟一般的通知沒有什麼兩樣。

  安裝這插件以後,網頁會另外插 3 個 iframe 元素進去,分別用來顯示信件匣、寄件備份匣和未讀信件數,只是因為我特別調整過樣式,所以看起來真的就像是在切換,只是調整「顯示或不顯示」的狀態而已,其實在點開信件欄的時候,就等於正在同時瀏覽兩個網頁。

  至於信件的收發時間,是直接讀取信件匣裡的時間資料,跟現在時間互減得出的,例如 2018-10-16 19:40:47 會被轉換成 1539690047(註 2),然後假設現在時間是 2018-10-16 21:04:07,就會被轉換成 1539695047,兩者互減就可以知道差了 5000 秒,再拿去交給 JavaScript 判斷,因為 5000 秒在 3600 以上、未滿 86400,所以除以 3600 得到它介在 1 小時到 2 小時之間,就顯示為「1 小時前」。我的設定是,如果是已經滿 30 天(2592000 秒)的信件,就直接讓它顯示絕對時間了。

  坐在電腦前面連續 coding 將近 12 個小時的感覺真ㄎㄧㄤ,我以後不要當工程師了。

註 1:我們平常瀏覽的頁面都是 home.gamer.com.tw、forum.gamer.com.tw 等等網域,若這個時候想要用 JavaScript 讀取 mail.gamer.com.tw 的內容,就會被瀏覽器基於安全性的理由阻擋。

註 2:timestamp,通常是跟 1970-01-01 00:00:00 互減得出的總秒數。



更新:
v20181101.1735:可設定是否顯示信件備份匣、切換鈕(腳本內)



巴哈相關插件:
 
257
-
未登入的勇者,要加入討論嗎?
板務人員:

7536 筆精華,前天 更新
一個月內新增 22
歡迎加入共同維護。


face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準,可能無法使用新的應用程式來呈現網站內容,在瀏覽器支援度及網站安全性的雙重考量下,為了讓巴友們有更好的使用體驗,巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特:
。Google Chrome(推薦)
。Mozilla Firefox
。Microsoft Edge(Windows10以上的作業系統版本才可使用)

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營,請將 gamer.com.tw 加入廣告阻擋工具的白名單中,謝謝 !【教學】