lucky-draw 年會抽獎工具:開源無後台,名單照片不出瀏覽器

lucky-draw 是免費開源的年會抽獎工具,實測 12 人抽獎全程,名單與照片都留在瀏覽器本機,沒有後端;開發停在 2021 年 4 月,靜態網頁架構讓它至今可用,隨機來源是 Math.random,公司抽獎夠用、要公證憑證的場合不夠。

用 AI 摘要這篇文章:

實際把 lucky-draw 打開跑了一輪:總人數改成 12、獎項選一等獎、按下立即抽獎,畫面上的號碼球開始滾動,按停止,開出 8 號。整個過程裡,瀏覽器只跟 GitHub Pages 要了 8 個靜態檔案,名單、照片、抽獎結果全部留在本機,沒有後端可以上傳。這是一個 2019 年底就出現、累積超過 2,100 顆星、開發停在 2021 年 4 月的開源工具。它到今天還能用的原因不是有人照顧,而是它根本沒有會壞的伺服器。

辦活動的人對抽獎環節的共同煩惱很一致:買一套抽獎軟體要花錢、用線上服務要註冊還怕名單外流、自己寫一個又沒時間。lucky-draw 卡在這三個痛點的中間:它是網頁,開了就用;它是開源靜態頁,營運成本為零,所以免費這件事不會變;名單與照片從頭到尾不出瀏覽器。代價則是介面只有簡體中文,以及一個停更五年多的專案狀態,這兩點後面會分別算清楚。

直接給判斷:部門抽獎、尾牙抽獎、臨時要上場又不想把員工名單交給第三方網站的場合,它值得開來用,免費、免註冊、按幾下就能抽;需要繁體中文介面、需要具公信力的抽獎憑證、或需要有人負責維修的正式活動,請換別套。

打開三分鐘就能抽,實測一輪完整流程

首頁沒有多餘的東西:一整片漂浮滾動的號碼球(預設 70 顆,對應預設的總人數 70 人),右側一排按鈕。抽獎配置的對話框只有三個欄位要填:抽獎標題、總人數、每個獎項的人數,想要二等獎、三等獎就按增加獎項,不想抽某個獎就把人數設成 0。我把總人數從 70 改成 12,按儲存,畫面立刻變成 12 顆號碼球。

lucky-draw 官網首頁畫面,深色背景上漂浮滾動的號碼球與右側操作按鈕Pin
lucky-draw 首頁:預設 70 顆號碼球對應預設總人數,右側是開始、重置與匯入名單按鈕。

按開始之後會先選兩件事:這次要抽哪個獎項,以及抽取方式。抽取方式有四種:一次抽 1 人、一次抽 5 人、一次抽完該獎項名額,或自訂人數。另外有一個「全員參與」開關,打開後已經中過獎的號碼也會繼續留在池子裡,適合獎品多、希望人人有機會的玩法。按立即抽獎,號碼球開始加速滾動,背景音樂同步播放,按停止,滾動停下來定格在得獎的號碼上,頂端同步顯示獎項結果,我這輪開出的是 8 號。從按下開始到看見結果,整段流程沒有任何需要等待伺服器的地方。

lucky-draw 開獎結果畫面,一等獎中獎號碼 8 以大字顯示Pin
實測開獎結果:12 人抽一等獎 1 名,開出 8 號。
lucky-draw 抽獎滾動進行中的畫面,號碼加速滾動並顯示停止按鈕Pin
按下立即抽獎後號碼球加速滾動,畫面只剩停止按鈕,按下去就開獎。

結果頁有個實用的設計:點任何一個中獎號碼,會跳出確認視窗,確認後該號碼就從得獎名單移除、重新投入未中獎的池子,可以再抽。現場有人棄權、或主管希望「中過就別再中」,兩種情況都處理得了:前者點掉號碼重抽,後者不開全員參與就好。名單也可以不用號碼:匯入名單的文字框支援「號碼加名字」的格式,每行一筆,從 Excel 複製貼上就行,抽獎時畫面就會顯示名字而不是數字。照片模式則把號碼對應到員工大頭照,支援 jpg 與 png,單張限制 150KB,官方建議 20 到 50KB、尺寸 160 乘 160 像素。官方設想的用法是現場報到:每發出一個號碼就匯入一張對應照片,開獎畫面直接顯示人臉,年會氣氛效果比數字好得多,代價是前置作業要多花一點時間。

公平性要拆成兩層看:無暗箱可以驗,隨機等級要自己認

抽獎工具最怕暗箱操作。這點 lucky-draw 給的答案很直接:整包原始碼以 MIT 授權公開在 GitHub 上,核心的抽獎函式只有短短幾十行:把 1 到總人數排成陣列,濾掉已經中獎的號碼,用 Math.random 在剩下的號碼裡取一個位置,結束。我把整個專案的原始碼掃過一遍,沒有任何 fetch 或 axios 呼叫,沒有遠端介面,想作弊的人改了程式碼,頁面就不再是大家看到的那一份,而任何會寫程式的人都能對照 repo 自己打包一份來用。更保險的做法是公司自己打包一份、放到內部主機或任何靜態空間,全場用的都是你驗證過的那份檔案,連「官方頁面被動過手腳」這種想像都一併排除。作者甚至在原始碼檔頭貼了 Chrome V8 引擎 Math.random 的實作註解,等於把隨機來源攤在陽光下。README 裡那句「無暗箱操作、無後台、無後門」,以程式碼層面來看成立。

但「沒有暗箱」不等於「隨機不可預測」,這是兩層不同的事。偽隨機的意思是:Math.random 用一條數學公式從內部狀態一路算出數列,並不取自物理雜訊這類不可測的來源;知道內部狀態的人理論上能推出下一個數字。它是程式語言內建的一般用途隨機,不是密碼學等級的隨機。對公司抽獎來說,這個等級綽綽有餘,實務上沒有人會在尾牙現場對瀏覽器的隨機狀態做預測攻擊,抽獎結果對在場每個人都夠公平;但如果你的活動有對獎法規、公證或高價值獎品的憑證需求,這個等級不夠,該找的是公證抽獎程序,不是任何一款網頁工具。我能驗證的是程式碼沒有後門、行為層沒有資料外送;至於隨機數列本身的數學性質,那是瀏覽器引擎的承諾,不是這個工具的。

名單、照片與結果都去哪裡了

實測時我把瀏覽器的全部請求側錄下來:載入加上抽獎全程,只有 8 個請求,內容是頁面本身、兩支 JavaScript、兩份 CSS、背景圖、背景音樂,全部來自 vitozyf.github.io 上的靜態檔案,外加一個載入自阿里雲 CDN 的圖示字型 CSS。這是唯一碰到第三方的連線,用途是按鈕上的小圖示,就算它連不上,也只影響圖示顯示,不影響抽獎。背景音樂的 mp3 打包在網站資源裡,第一次載入就一併抓下來,官方也提醒音樂載入較慢、建議提早開著頁面暖場。

資料的去處同樣清楚:抽獎設定、結果、自訂獎項、名單存在瀏覽器的 localStorage,照片存在 IndexedDB。這兩個都是瀏覽器內建的本機儲存位置,差別在文字類的設定適合放前者、照片這種檔案適合放後者,共同點是都長在你自己的電腦上,不經過任何伺服器。關掉分頁再打開,設定與結果還在,程式碼在載入時會把上次的狀態讀出來;抽完全部重來,重置選單給了五種清法:全部資料、抽獎配置、名單、照片、抽獎結果,可以只清結果保留其他設定。代價也在此:沒有雲端帳號,換一台電腦或清掉瀏覽器資料,一切歸零,也沒有跨裝置同步這種東西。對一次性活動來說這反而乾淨,活動結束清空,名單不留痕跡;對需要留檔的單位,就要自己想辦法造冊。

開發停在 2021 年,為什麼還敢用

這是最多人會猶豫的地方。專案的主要開發分支從 2021 年 4 月更新完 README 之後就沒有動過,超過 2,100 顆星、約 600 個 fork 是六年多累積來的,不是活躍的證據。翻開 issues 會更清楚:2024 年就有人問「不能匯出中獎名單嗎」,始終沒有實作;2024 年底有人反映原始碼在新的 Node 版本上跑不起來,原因是專案依賴的打包工具鏈太舊,2025 年 4 月社群乾脆自己貼出改寫版自救,始終等不到原作者。作者沒有宣布停止維護,但已經很久沒有動靜,把它當成「現狀就是最終版」的專案來評估最務實。

它還能用,靠的是架構。整個工具是編譯好的靜態網頁,託管在 GitHub Pages 上,抽獎運算全部在使用者的瀏覽器裡完成。常見的免費網頁工具死去,多半是後端伺服器關閉、資料庫搬家或改收費,使用者開啟頁面只剩一行錯誤訊息;一個沒有後端的靜態頁,壞掉的方式只剩下 GitHub 平台本身出問題,這在可預見的未來機率極低。所以判斷標準不該是「停更就棄用」,該問的是「壞了誰修、架構會不會爛」:這個工具沒有維護者可指望,但架構上也幾乎沒有會爛的零件。它建立在 Vue 2 與 Element UI 上,Vue 2 的官方維護已在 2023 年 12 月終止,對這種純前端工具來說資安風險很低(它不收資料、無帳號可偷),真正的風險是「以後不會有人修」。想要完全離線的場合,repo 的 releases 頁還留著 Windows 版安裝檔(從檔名與體積看是 Electron 打包),可以裝在本機不連網使用,官方 README 也建議擔心現場網路的人走這條路;只是那份安裝檔停在 2020 年 3 月,版本比網頁版更舊,下載前自己衡量。

介面、人數與留檔,上場前先想清楚

介面只有簡體中文。所有按鈕、欄位、提示都是簡體字,投影到大螢幕之前,先確認公司場合能不能接受。折衷方式是把抽獎標題改成自己的活動名稱,看起來會不那麼突兀,但其餘介面文字改不了。

人數很多的場合要照官方建議調整做法。README 的說法是理論上支援到百萬人數,超過十萬人時初始化會比較慢,人多時建議改用號碼抽獎,不要匯入名單或照片。這是作者的宣稱,我實測的規模只有 12 人,千人以上的場子建議先用實際人數預演一輪再上場。

中獎名單沒有匯出功能。結果只存在瀏覽器裡,要留檔就自己截圖或抄下來,社群裡已經有人提出這個需求但一直沒有實作。活動要造冊存證的單位,把這個當成流程的一部分先想好。

最後是上場演練的建議:活動前一天,用實際的總人數與獎項設定,在要上場的那台電腦、那個瀏覽器上完整跑一輪,確認音樂播得出來、投影解析度下號碼球看得清楚,跑完用重置功能只清抽獎結果,設定留下來,隔天上場就開抽。這不是這個工具特別的要求,任何把抽獎放在倒數第二個環節的活動都該這麼做,差別只在它連伺服器臨時維修這種風險都不存在。

公司抽獎直接開來用,公證級活動請繞道

適合的場景很明確:幾十人到幾百人的公司抽獎、不想註冊帳號、不想把員工姓名或大頭照上傳到陌生伺服器、活動結束希望資料自然消失,這些需求它全部命中,而且原始碼公開在 GitHub 上,技術同事可以自己檢查。會自己打包的團隊還可以 fork 一份,改掉標題配色就變成自家活動頁。

不適合的場景也一樣清楚:需要繁體中文介面的正式場合、需要抽獎憑證或公證程序的對外活動、需要長期維護與客服的單位、以及需要串接其他系統的整合需求。同類型的選擇裡,想要視覺化轉盤可以看 Lubulu 開源決策轉盤 與 WheelPage 線上轉盤,抽獎以外的現場工具像是 MinuteTimers 免費線上計時器、Teleprompter Online 線上提詞器 也都是同樣不把資料送出去的類型,湊一套網頁工具就能撐起整場活動。

MIT 授權隨你改,要留意的只有號碼球引擎

授權採 MIT,商用修改都沒有問題,不過有個分層細節值得知道:首頁那個漂浮號碼球的視覺效果,用的是打包進專案的 tagcanvas 函式庫,它以 LGPL(較寬鬆的公共授權)發布。自己內部使用沒有任何疑慮,要把改過的版本對外發布時,再花點時間讀一下它的條款就好。專案本身沒有封存,issues 也還開著,只是等不到原作者的新 commit。對一個活動用的免費小工具來說,這種狀態反而誠實:它從來沒有答應過要陪你走很久,但公開的原始碼與靜態網頁的架構,讓你今天用它與三年後用它,看到的都是同一份不會偷偷改變的東西。

Sliven 褚崇名
Sliven 褚崇名

每日分享科技新知、免費資源以及 WordPress、虛擬主機相關主題,任何問題歡迎在科技月球下方留言,或是發送 Email 至 [email protected] 與我聯繫。

文章: 1614

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *


Share to...