- Purple
- Captive portals: a complete guide
- 如何為您的品牌建立自訂 WiFi 登入頁面
如何為您的品牌建立自訂 WiFi 登入頁面
本指南為 IT 經理、網路架構師和場域營運總監提供全面且可直接實作的參考,介紹如何建立完整品牌化的訪客 WiFi 登入頁面 - 涵蓋 captive portal 架構、HTML/CSS 自訂、GDPR 合規性以及數據收集策略。內容從技術基礎出發,深入到餐旅業和零售業的實際部署場景,並在每個階段提供可衡量的業務成效。對於運行 Purple 訪客 WiFi 平台的企業,本指南可直接對應到該平台的 portal 產生器、分析和同意管理功能。
Video overview
收聽此指南
查看播客逐字稿
核心系列的一部分:Captive Portal 指南 →
Custom WiFi login page architect and ROI planner
Model your visitor footfall, authentication methods, and compliance requirements to project guest onboarding speed, profile capture volume, and walled garden network prerequisites.
Sessions are counted per visit. This divides the year's captures into distinct people, so a returning guest is not counted as a new contact record.
Recommended Retail & shopping centres captive portal specification
Drives repeat visits with localised promotional vouchers on reconnection. Aligning with CRM lead enrichment and loyalty programme enrolments.
Deploy a branded custom WiFi login page across your venues
Turn generic splash screens into high-converting customer acquisition assets with Purple.

執行摘要
訪客 WiFi 登入頁面(通常稱為 captive portal 或歡迎頁面)往往是訪客與您組織的首次品牌數位互動。儘管如此,大多數企業部署仍依賴無品牌識別且無法擷取有用資料的通用、硬體廠商提供之歡迎畫面。本指南將直接解決這一落差。
完整的品牌化 Guest WiFi 登入體驗並非僅是外觀升級。它同時是資料獲取資產、信任訊號與合規工具。正確部署時,它可以將電子郵件擷取率從個位數提升至連線訪客的 30% 到 40%,將第一方資料直接導入您的 CRM,並為每個使用者工作階段提供可稽核的 GDPR 同意記錄。對於在 餐飲旅宿、零售、醫療保健 或 交通運輸 環境中營運的組織而言,其商業價值顯而易見。
本指南涵蓋支援 captive portal 的技術架構、HTML/CSS 自訂層、五階段實作流程、GDPR 規範下的合規要求,以及兩個具有量化成果的詳細案例研究。本指南全程以 Purple 的 WiFi Analytics 平台作為具體的實作範例。
技術深度解析
Captive Portal 的運作原理
Captive portal 運作於網路層,它會攔截訪客裝置的初始 HTTP 請求,並在授予完整網際網路存取權限之前將其重新導向至登入頁面。此機制在所有主要的無線 LAN 廠商中均已標準化,且獨立於所使用的加密標準運作 - 這意味著它與使用對等同時認證 (SAE) 的 WPA3 部署完全相容。
現代 captive portal 架構的核心元件如下圖所示。
其流程如下:當訪客裝置與存取點建立關聯並嘗試載入任何 HTTP URL 時,無線區域網路控制器或閘道器設備會攔截該請求,並向 Captive Portal 控制器發出 302 重新導向。控制器隨後會呈現品牌專屬的 HTML/CSS 登入頁面。一旦使用者完成驗證流程(不論是透過電子郵件表單、社群登入 - 如透過 Facebook、Google 或 Apple 的 OAuth 2.0,或是透過 OpenRoaming 等無縫方式),控制器便會使用 IEEE 802.1X 或 MAC 驗證繞過 (MAB) 與 RADIUS 伺服器通訊,以授權該裝置存取網際網路 VLAN。在驗證期間擷取的資料會同時透過安全 API 呼叫路由至訪客資料平台或 CRM,並將符合 GDPR 規範的同意記錄寫入合規的資料儲存庫。
值得注意的是,Captive Portal 頁面本身是在受限的瀏覽器環境中載入 - 即 iOS 與 Android 上的 Captive Network Assistant (CNA) - 此時裝置尚未取得完整的網際網路存取權限。這對前端開發有著關鍵的影響:所有資產必須自行託管於入口網站控制器上。外部 CDN 資源、Google Fonts 與第三方 JavaScript 程式庫在此環境中將無法載入。每個樣式表、字型檔案和圖片都必須與入口網站頁面打包在一起,並從控制器自身的網頁伺服器提供服務。
HTML/CSS 自訂層
登入頁面本身是一個標準的 HTML5 文件,並附有相關聯的 CSS 樣式表。現代的 Captive Portal 平台(包括 Purple)會提供可產生此程式碼的視覺化編輯器,但對於需要強制執行品牌標準或排查轉譯問題的 IT 團隊而言,瞭解底層結構至關重要。
需要控制的關鍵 CSS 變數如下:
| CSS 屬性 | 品牌元素 | 建議方法 |
|---|---|---|
background-color |
頁面背景 | 使用單色十六進位值或 CSS 漸層;避免使用點陣圖 |
font-family |
字型排版 | 在本機內嵌 WOFF2 字型檔案;不要引用 Google Fonts |
color (標題) |
品牌輔助色 | 必須完全符合品牌指南 |
background-color (CTA 按鈕) |
品牌主色 | 使用品牌指南中的精確十六進位值 |
border-radius |
按鈕與容器形狀 | 容器使用 12px,小型元素使用 6px |
max-width (表單容器) |
行動裝置優先版面 | 最大 480px,以達到最佳行動裝置轉譯效果 |
頁面大小限制是 Captive Portal 部署中最常被違反的技术要求。實際限制為整個頁面(包含所有資產)總計 500 KB。這可確保在驗證前,即使在緩慢或擁擠的連線下也能可靠地轉譯。標誌請使用 SVG 格式(通常為 5 - 20 KB),字型請使用本機內嵌的 WOFF2(每個字重通常為 30 - 80 KB),並使用 CSS 漸層或單色,而非照片背景。

驗證方式
驗證方式的選擇會直接影響資料收集率與合規狀態。
| 方式 | 收集的資料 | 轉換率 | 合規注意事項 |
|---|---|---|---|
| 電子郵件表單 | 電子郵件、姓名、自訂欄位 | 中(25 - 40%) | 完整的 GDPR 控制;推薦使用 |
| 社群登入 (OAuth) | 電子郵件、姓名、個人檔案資料 | 高(35 - 55%) | 需要與社群平台提供商簽署 DPA |
| 簡訊 / OTP | 行動電話號碼 | 中(20 - 35%) | 需要簡訊網關;適用 PECR |
| 點擊直接上網(不收集資料) | 無 | 極高(70 - 90%) | 無資料價值;僅在必要時使用 |
| OpenRoaming / Passpoint | 電信業者驗證的身份 | 無縫 | Eduroam/WBA 生態系統;企業級用途 |
對於大多數商業部署而言,結合電子郵件表單與社群登入 - 並搭配清晰呈現的 GDPR 同意勾選框 - 能在轉換率與資料品質之間取得最佳平衡。
對於您的特定設置有任何疑問嗎?
我們的團隊與超過 80,000 個場域的場域營運商、IT 經理和網路工程師合作。立即預約 20 分鐘的通話,我們將向您展示其他與您相似的用戶是如何解決此問題的。
實作指南
成功的 Captive Portal 部署遵循五個不同的階段。跳過或壓縮任何階段是導致部署後出現問題的主要原因。
階段 1 - 需求收集。 召集跨部門工作小組,包括行銷(品牌資產、文案、同意書用語)、法務(GDPR 審查、隱私權政策)與網路工程(VLAN 架構、RADIUS 設定、DNS 白名單)。明確定義要收集的資料欄位、驗證後的重導向 URL 以及行銷同意勾選用語。在開始開發之前,取得法務部門對同意機制的書面簽准。
階段 2 - 設計與開發。 將入口網頁建構為獨立的 HTML/CSS 文件。強制執行 500 KB 的網頁大小限制。測試在 iOS Safari (CNA)、Android Chrome (CNA) 及桌上型電腦瀏覽器上的轉譯效果。驗證 SSL 憑證鏈 - 入口網頁網域必須擁有受信任的憑證,因為不受信任的憑證警告會導致大多數使用者放棄登入。確保表單完全符合無障礙規範(至少達到 WCAG 2.1 AA 標準)。
階段 3 - 整合。 透過平台的 API 將入口網頁連接到您的顧客資料平台或 CRM。設定 RADIUS 伺服器(或使用平台代管的 RADIUS 服務)。設定驗證後的重導向。設定 VLAN 分割,以將驗證前的網路區段與內部資源隔離。在接觸生產環境之前,先在測試網路上測試完整的端到端流程 - 裝置關聯、入口網頁重導向、驗證、RADIUS 授權、CRM 資料寫入以及驗證後重導向。 階段 4 - 試行部署。 推廣至單一場域或指定的試行群組。在最初的 30 天內監控四項關鍵指標:驗證成功率(目標 >95%)、平均網頁載入時間(目標 <3 秒)、資料擷取率(基準測量)以及 RADIUS 授權失敗率(目標 <1%)。在進行全面推廣之前解決所有問題。
階段 5 - 最佳化與治理。 每月審查資料擷取率。測試標題文案與 CTA 按鈕文字變體。當品牌指南變更時,更新傳送門設計。每當資料處理活動變更時,審查 GDPR 同意書用語。每年對傳送門基礎架構進行安全審查,包括 SSL 憑證更新、RADIUS 伺服器修補以及 DNS 白名單審查。
最佳實踐
品牌忠實度
傳送門在部署前必須通過五點品牌忠實度檢查:最小尺寸(30px 數位)的正確標誌變體;主按鈕顏色與品牌精確的 Hex 值相符;字型系列與數位品牌指南一致;標題語氣與品牌形象一致;以及與品牌網站及應用程式的視覺一致性。任何未通過此檢查的傳送門都應退回設計階段。
GDPR 合規架構
根據 UK GDPR 與 EU GDPR,同意機制必須是明確、未捆綁且細緻的。服務條款的接受與行銷傳播的訂閱必須呈現為獨立且未勾選的核取方塊。將它們捆綁到單個核取方塊中是不合規的。每個同意事件都必須記錄時間戳記、呈現的確切同意文字以及使用者識別碼。Purple 的平台將這些記錄儲存在可稽核的同意儲存區中,並可匯出供監管審查使用。
安全態勢
驗證前的網路區段必須透過 VLAN 區隔與所有內部資源隔離。在驗證之前,只有傳送門運作所需的 DNS 白名單條目 - 包括傳送門控制器網域、社群登入 OAuth 端點,以及用於自我代管資產的任何 CDN 網域 - 應該是可存取的。驗證後,訪客應被安置在僅能存取網際網路的專用訪客 VLAN 上,且沒有通往內部子網路的路由。此架構符合網路區隔的 PCI DSS 需求 1.3。
如需傳送門網頁類型的詳細比較,請參閱 WiFi Landing Page vs. Splash Page: What's the Difference?。
真實案例研究
案例研究 1:英國連鎖飯店 - 餐旅業
一家在英國營運 45 家物業的中型飯店集團,原本使用其無線 LAN 廠商提供的預設 splash page。該網頁未套用品牌識別、在行動裝置上載入緩慢,且未提供資料擷取表單。電子郵件擷取率:約佔連線訪客的 8%。
IT 團隊在所有 45 家酒店部署了 Purple 的 Guest WiFi 平台,將供應商的歡迎頁面替換為完全符合品牌形象的 Captive Portal。新的門戶網站完全採用了該酒店集團的品牌色彩、Poppins 字體,以及包含電子郵件欄位、名字欄位和符合 GDPR 規範的行銷同意勾選框的單畫面佈局。網頁總大小優化至 380 KB。驗證後的重新導向設定為酒店的會員計劃登陸頁面。
90 天後的成效:電子郵件收集率從連線房客的 8% 提高到 38%。收集到的數據已整合至該酒店集團的 CRM 中,從而能夠針對先前的房客進行精準的重新互動電子郵件行銷活動。在試點酒店中,歸功於電子郵件行銷活動的直接預訂收入同比增長了 14%。GDPR 同意儲存庫為所有 45 個場所提供了完整的稽核追蹤。
案例研究 2:歐洲時尚零售商 - 零售
一家在五個歐洲市場營運 120 家門市的時尚零售商,正將部署 Guest WiFi 作為其數位轉型計劃的一部分。其需求是建立一個單一、集中管理的品牌門戶網站,並具備針對各個市場的語言在地化功能(英文、法文、德文、西班牙文、義大利文),以及與 Salesforce 的單一 CRM 整合。
該零售商部署了一個具有集中式門戶配置的雲端管理 Guest WiFi 平台。品牌資產和 CSS 透過單一管理主控台進行管理,並針對語言和在地化同意條款套用了各場所和各區域的覆蓋設定。Salesforce 整合則使用了該平台的原生 CRM 連接器。
六個月後的成效:在所有 120 家門市中,建立了一個包含超過 400,000 個選擇加入的顧客檔案之第一方數據資產。針對這群受眾的電子郵件行銷活動達到了 28% 的平均開啟率,而零售業的行業基準則為 12%。根據 CRM 歸因模型,該零售商將部署後六個月內實體店面重複造訪率 9% 的提升歸功於此。請參閱 Purple 的 WiFi Analytics 平台,以了解此部署中所使用的分析與歸因功能。
疑難排解與風險緩釋
iOS 上未顯示門戶網站。 iOS 使用 Captive Network Assistant (CNA) 在受限的 WebKit 檢視中轉譯門戶網站。請確保門戶網站網域不在 Apple 的已知網路清單中、門戶網站能正確回應 Apple 的 Captive Portal 偵測探測(/hotspot-detect.html),且在初始重新導向時所有資產均透過 HTTP(而非 HTTPS)提供 - CNA 在首次請求時不會遵循 HTTPS 重新導向。
驗證失敗率高。 檢查 RADIUS 伺服器記錄以尋找特定的錯誤代碼。常見原因包括 RADIUS 伺服器與存取點之間的時鐘偏差(需要 NTP 同步)、RADIUS 伺服器上的憑證過期,以及存取點與 RADIUS 伺服器之間的 MAC 地址格式不相符。儘管連線量很高,但資料收集率卻很低。 請檢視表單欄位數量 - 每增加一個欄位都會使轉換率降低大約 5-10%。請檢視頁面載入時間 - 如果 portal 頁面載入時間超過 3 秒,流失率將急劇上升。請檢視同意條款的文字 - 過於冗長且流於法條形式的同意條款會降低選擇訂閱(opt-in)的機率。
GDPR 稽核請求。 Purple 的平台可根據需求,針對任何指定的電子郵件地址或日期範圍匯出完整的同意記錄。請確保您的資料保留政策已正確設定 - 根據 UK GDPR 的規定,個人資料的保留時間不應超過實現聲明目的所需的時間。
各場域品牌形象不一致。 請集中管理 portal 頁面的設定。任何場域層級的客製化內容應僅限於在地化的文案與語言;品牌色彩、字型和標誌必須在全域設定層級進行鎖定。
投資報酬率與商業影響
自訂 Captive Portal 的投資報酬率(ROI)可從三個維度進行衡量:資料資產價值、直接營收歸因以及營運效率。
資料資產價值。 佈署 Captive Portal 的主要產出是第一方資料資產 - 一個包含已驗證電子郵件地址且已選擇訂閱的顧客檔案資料庫。此資產的價值取決於收集率、選擇訂閱率(opt-in rate)以及資料品質。一個每日有 500 次連線、35% 收集率和 70% 選擇訂閱率的場域,每年將建立一個包含大約 44,000 個已選擇訂閱檔案的資料庫。以電子郵件行銷每投入 £1 獲得 £42 投資報酬率的產業標準計算,此資產的商業價值極為顯著。
直接營收歸因。 Purple 的 WiFi Analytics 平台提供 CRM 層級的歸因報告,將特定的電子郵件行銷活動與場域內的造訪和交易相連結。這使得計算歸功於 Captive Portal 資料收集計劃的營收變得可以直接衡量。
營運效率。 當品牌指引變更時,集中管理的 portal 平台可免除各場域 IT 人員進行設定的工作。單一的 CSS 更新可同時傳播到所有場域,從而降低大規模維持品牌一致性時的營運開銷。
| 指標 | 典型無品牌 Portal | 品牌化 Portal (Purple) | 提升幅度 |
|---|---|---|---|
| 電子郵件收集率 | 5-10% | 30-40% | 3-4 倍 |
| 行銷選擇訂閱率 | 不適用 | 收集數量的 60-75% | - |
| 驗證後互動 | 無 | 會員專區頁面 / 優惠 | 直接相關 |
| GDPR 稽核準備度 | 手動 | 自動化匯出 | 顯著 |
| 品牌一致性 | 無 | 集中強制執行 | 完全一致 |
如需瞭解與多站點部署相關的網路架構背景資訊,請參閱 The Core SD-WAN Benefits for Modern Businesses,該文介紹了 SD-WAN 如何為分散式 Captive Portal 部署簡化底層網路。
關鍵定義
Captive Portal
一種網路機制,在授予完整的網際網路存取權限之前,會攔截訪客裝置的 HTTP 請求,並將其重導向至登入或驗證頁面。在網路層運行,獨立於所使用的無線加密標準。
IT 團隊在配置無線區域網路控制器、雲端 WiFi 管理平台或閘道設備時會遇到此術語。它是終端使用者所體驗之「WiFi 登入頁面」的技術名稱。
Captive Network Assistant (CNA)
內建於 iOS 和 Android 中的受限瀏覽器環境,當作業系統偵測到 Captive Portal 時會自動開啟。它在一個沙盒化的 WebKit 檢視中轉譯 Portal 頁面,無法存取 Cookie、本機儲存空間或外部 CDN 資源。
對建置 Portal 頁面的前端開發人員至關重要。任何無法從 Portal 控制器本身載入的資產都無法在 CNA 中轉譯,進而導致視覺破壞或頁面載入失敗。
RADIUS (Remote Authentication Dial-In User Service)
一種網路協定,為網路存取提供集中化的驗證、授權和計帳 (AAA)。在 Captive Portal 部署中,在使用者完成驗證流程後,Portal 控制器會與 RADIUS 伺服器進行通訊以允許或拒絕網路存取。
網路工程師會配置 RADIUS 伺服器(或使用 Portal 平台提供的託管 RADIUS 服務)作為 Captive Portal 後端的一部分。IEEE 802.1X 使用 RADIUS 作為其驗證協定。
IEEE 802.1X
一個用於基於連接埠的網路存取控制的 IEEE 標準,為連接到 LAN 或 WLAN 的裝置提供驗證機制。在企業訪客 WiFi 部署中,它與 RADIUS 伺服器協同使用,以便在授予網路存取權限之前對使用者進行驗證。
在配置企業級 Captive Portal 時非常有用,特別是在 MAC 驗證繞過 (MAB) 不足且需要更強身分驗證之環境中。
MAC Authentication Bypass (MAB)
一種驗證方法,其中裝置的 MAC 位址被用作其網路存取的憑證。存取點將 MAC 位址傳送到 RADIUS 伺服器,伺服器根據預先配置的允許清單批准或拒絕存取。
用於 Captive Portal 部署中,以針對返回的裝置啟用自動重新驗證,而無需使用者重新輸入憑證。通常用於已知的企業裝置或返回的訪客。
GDPR 同意記錄
使用者明確同意資料處理的時間戳記記錄,包括呈現的確切同意文字、同意的日期與時間,以及使用者的識別碼(通常為電子郵件地址)。根據 UK GDPR 和歐盟 GDPR 第 7(1) 條的要求,作為已獲得同意的證據。
Captive Portal 平台必須為每位選擇接受行銷資訊的使用者產生並儲存同意記錄。此記錄必須可以匯出以用於監管審計目的。
DNS 白名單
在訪客裝置完成 Captive Portal 驗證之前可以存取的網域名稱清單。該白名單必須包括 Portal 控制器網域、任何社群媒體登入 OAuth 端點,以及用於自我裝載 Portal 資產的任何 CDN 網域。
網路工程師在無線 LAN 控制器或閘道器裝置上配置 DNS 白名單。設定錯誤的白名單是 Portal 轉譯失敗的常見原因,特別是對於社群媒體登入流程。
驗證後重新導向
使用者成功完成 Captive Portal 驗證流程後,訪客裝置的瀏覽器立即被重新導向到的 URL。這是使用者在獲得完整網際網路存取權限後看到的第一個頁面。
驗證後重新導向是一個高價值的商業接觸點。它應該設定到一個能夠推動特定行動(如會員計劃註冊、應用程式下載、當前促銷)的到達頁面,而不是預設為使用者最初請求的 URL。
WPA3-SAE (Simultaneous Authentication of Equals)
用於 WPA3 個人模式的安全驗證協定,取代了 WPA2 中使用的預共用金鑰 (PSK) 握手。SAE 對離線字典攻擊提供了更強的防禦力,並支援向前保密。它完全相容於 Captive Portal 部署。
評估網路安全升級的 IT 團隊應該注意,從 WPA2 遷移到 WPA3 不需要對 Captive Portal 架構進行變更。Portal 機制在網路層運作,位於加密層之上。
OpenRoaming
由無線寬頻聯盟 (WBA) 開發的 WiFi 漫遊標準,允許使用者使用其現有的憑證(電信業者、企業或身分識別提供者)自動連線到參與該計劃的網路。為註冊使用者省去了手動進行 Captive Portal 驗證的步驟。
適用於將無縫連線視為首要任務的企業和交通部署。Purple 在其 Connect 授權下,於 OpenRoaming 生態系統中扮演身分識別提供者的角色,使場所能為註冊使用者提供自動連線。
範例
一家位於倫敦市中心、擁有 200 間客房的飯店希望將供應商提供的預設畫面更換為完整品牌化的 captive portal。該飯店的品牌指南指定使用深藍色為主色 (#011638)、金色為輔助色 (#C9A84C),並使用 Playfair Display 襯線字體。IT 經理擔心 iOS 相容性和 GDPR 合規性。應如何處理此問題?
首先召集 IT、行銷和法務部門召開需求工作會議。確認正確的品牌資產:SVG 標誌檔案、十六進位顏色值和字型檔案(適用於 Playfair Display 的 WOFF2 格式)。為了確保 iOS 相容性,請設定無線區域網路控制器,使其能正確回應 Apple 在 /hotspot-detect.html 上的 captive portal 偵測探測,並確保初始重導向為 HTTP(而非 HTTPS) - iOS 上的 CNA 在首次請求時不會遵循 HTTPS 重導向。一旦 CNA 載入後,portal 頁面本身應透過 HTTPS 提供服務。針對 GDPR,請提供兩個獨立且未勾選的核取方塊:一個用於接受服務條款(連線必填),另一個用於行銷傳播(選填)。記錄每次同意事件的時間戳記和確切的同意文字版本。透過在本機嵌入 Playfair Display WOFF2 檔案(不要引用 Google Fonts)、使用 SVG 標誌以及使用 CSS 漸層作為背景而非照片圖像,將網頁大小最佳化至 500 KB 以下。將驗證後的重導向設定為飯店的會員計劃或目前的促銷活動網頁。先部署到單一樓層進行試點,監控驗證成功率和網頁載入時間 14 天,然後推廣至整個物業。
一家擁有 85 家門市的連鎖零售商希望在所有地點部署一致的品牌 captive portal。每家門市都有不同的無線區域網路供應商(因歷史收購而混用了 Cisco、Aruba 和 Ruckus 硬體)。行銷團隊希望能夠集中更新 portal 設計,而不需要每個據點的 IT 人員參與。架構應如何設計?
部署雲端託管的 Captive Portal 平台 - 例如 Purple - 作為與廠商無關的覆蓋層運行,獨立於底層的無線硬體。該平台透過 RADIUS 代理或雲端 RADIUS 服務與每個存取點進行通訊,這意味著 Portal 控制器與硬體廠商完全解耦。Portal 頁面託管在平台的 CDN 上(所有資產均在平台上自行託管,而非在外部 CDN 上),且平台的管理主控台允許集中管理品牌資產、CSS 和文案。每家分店的自訂內容(標題中的分店名稱、在地化促銷活動)則透過平台範本引擎中的場地級變數進行管理。當行銷團隊更新品牌 CSS 時,變更會在幾分鐘內套用到所有 85 家分店,無需各個站點的 IT 人員介入。CRM 整合在平台層級配置一次,即可套用到所有場地。每個站點的 VLAN 配置是一次性的設定任務,由本地 IT 團隊或平台的上線服務處理。
一家每年舉辦 50 場活動的會議中心希望在每場活動期間,為活動贊助商提供聯名品牌的 WiFi 登入體驗 - 也就是在會場自身的品牌旁顯示贊助商的標誌。IT 團隊需要能夠在不同活動之間切換 Portal 配置,且只需極少的手動工作。這該如何實施?
為 Captive Portal 平台配置一個 Portal 範本庫 - 每種活動類型(會議、展覽、晚宴)一個主範本 - 其中包含可透過管理主控台或 API 更新的贊助商標誌和色彩變數。針對每場活動,活動營運團隊只需在管理主控台中更新贊助商標誌的 URL 和主要輔助色,Portal 就會即時更新。如果平台支援,請配置 SSID 與 Portal 的對應關係,以便贊助商專屬的 SSID(例如「EventName-WiFi」)提供聯名品牌的 Portal,而會場的永久 SSID 則提供標準的會場 Portal。設定 Portal 在活動結束後的預定時間自動恢復為標準會場範本。確保贊助商標誌以 SVG 格式提供,並預先獲得會場品牌團隊的批准,以確保符合頁面大小和品質標準。活動 Portal 驗證後的重導向應指向活動自身的登入頁面或贊助商的活動網址,並帶有 UTM 參數以進行成效歸因追蹤。
練習題
Q1. 您的行銷總監向您發送了新品牌 Captive Portal 的 Figma 設計原型。其中包含一張全螢幕照片背景影像(匯出為 4.2 MB 的 JPEG)、從 Google Fonts 載入的品牌自訂襯線字型,以及一個 Facebook 登入按鈕。您需要實作此設計。在開始開發之前,您必須做出哪些修改,原因為何?
提示:請考量 Captive Network Assistant 環境的技術限制以及頁面大小上限。
查看標準答案
需要進行三項修改。第一,背景影像必須替換為 CSS 漸層,或小於 100 KB 且經過高度壓縮的 WebP/SVG 替代方案 - 在慢速連線下,4.2 MB 的 JPEG 會導致入口網站在轉譯前就發生逾時。第二,Google Fonts 的引用必須替換為從入口網站控制器提供的本地內嵌 WOFF2 字型檔案 - CNA 環境在驗證前無法存取網際網路,因此外部字型 CDN 將無法載入。第三,Facebook 登入的 OAuth 流程需要將 Facebook OAuth 端點網域加入無線區域網路控制器上的 DNS 白名單,以便在授權完全存取網際網路之前完成 OAuth 重新導向。此外,請確保為沒有 Facebook 帳戶的使用者提供基於電子郵件的備用選項,並與您的法務團隊確認已簽署 Facebook 資料處理協議。
Q2. 您是一家在三個院區部署訪客 WiFi 的醫療機構 IT 經理。您的法務團隊告知您,目前入口網站上的同意機制不符合 UK GDPR。您審查了該入口網站,發現只有一個核取方塊,寫著:「我同意服務條款並同意接收行銷資訊。」這有什麼問題,您該如何解決?
提示:請考量 GDPR 對於同意必須是自由給予、具體且細緻的要求。
查看標準答案
此同意機制在兩方面不合規。首先,它將接受服務條款(使用網路服務的契約要求)與行銷資訊同意(非強制的資料處理活動)綁定在單一核取方塊中。根據 UK GDPR 第 7 條和第 43 條敘言,如果同意與使用者在不提供同意就無法存取的服務綁定在一起,則該同意並非自由給予。其次,該核取方塊似乎是預先勾選或強制勾選的 - 行銷同意必須呈現為未勾選、可選的核取方塊。解決方法是將兩者拆分為獨立的核取方塊:一個為接受服務條款的必要核取方塊(字樣為「我同意服務條款和隱私權政策」),另一個為接收行銷資訊的獨立、未勾選且可選的核取方塊(字樣為「我想透過電子郵件接收來自 [組織名稱] 的新聞和優惠」)。為每位使用者儲存的同意記錄必須記錄勾選了哪些核取方塊、每個同意聲明的確切文字,以及同意事件的時間戳記。在醫療保健環境中,必須特別注意確保隱私權政策準確描述所有資料處理活動,包括與第三方分析平台的任何共享行為。
Q3. 體育場營運商希望在比賽日為 40,000 名同時在線的使用者佈署品牌 Captive Portal。他們目前的無線基礎架構支援每秒最多 500 個並行 RADIUS 驗證請求。比賽於 15:00 開始,大多數球迷會在開賽前 30 分鐘內抵達。關鍵的基礎架構風險為何?應如何緩解?
提示:請考量驗證負載分佈,以及 RADIUS 伺服器容量對使用者體驗的影響。
查看標準答案
主要風險是賽前驗證激增期間的 RADIUS 伺服器超載。如果 40,000 名使用者嘗試在 30 分鐘的窗口內進行驗證,平均每秒約為 22 個驗證請求 - 遠在 500 rps 的容量範圍內。然而,抵達模式不會是均勻的:在開賽前最後 5 分鐘的尖峰激增可能會產生平均速率的 5 到 10 倍,可能超過 200 rps。緩解措施包括:(1) 佈署具備自動容錯移轉且負載平衡的 RADIUS 叢集,而非單一伺服器;(2) 為返回的裝置設定 MAC 驗證繞過 (MAB),這會繞過完整的驗證流程,並顯著減少重複訪客的 RADIUS 負載;(3) 在無線區域網路控制器上預先快取 Portal 頁面,以減輕 Portal 控制器的負載;(4) 設定較短的會話逾時(例如 8 小時),使在上一次比賽中驗證過的裝置不會無謂地消耗 RADIUS 會話;以及 (5) 在第一個比賽日之前進行模擬尖峰驗證速率的負載測試。此外,Portal 頁面必須針對最大效能進行最佳化 - 在激增期間載入緩慢的 Portal 會導致使用者放棄登入,從而降低資料擷取率並增加支援電話。
常見問題
What are the essential elements of a high-converting custom WiFi login page?
A high-converting custom WiFi login page requires clear brand identity (logo, brand typography, and responsive hero imagery), low-friction authentication options (1-click, social sign-on, or SMS OTP), mobile-optimized responsive layout, an explicit GDPR and CCPA compliant consent mechanism with unbundled marketing opt-in checkboxes, and a terms of service link. The interface should load in under 1.5 seconds on captive network browsers.
How do WiFi captive portals interact with Apple Captive Network Assistant (CNA) and Android mini-browsers?
When an iOS or Android device connects to an open or captive WiFi SSID, the operating system sends an unencrypted HTTP probe to vendor detection endpoints (such as captive.apple.com or connectivitycheck.gstatic.com). The wireless access point intercepts this port 80 request and returns an HTTP 302 redirect to the custom portal URL. The device OS then automatically displays its native mini-browser sheet without requiring the guest to open Safari or Chrome.
What walled garden domains must be whitelisted for custom branded WiFi portals?
The wireless controller or cloud access point must permit pre-authentication DNS and HTTP/HTTPS access to all external resources needed by the custom WiFi login page before the guest authenticates. This includes your captive portal hosting domain (*.purpleportal.net), CDN asset endpoints (*.cloudfront.net), web fonts (fonts.googleapis.com, fonts.gstatic.com), OS detection probes (captive.apple.com), and any third-party social OAuth identity providers (accounts.google.com, appleid.apple.com, *.facebook.com).
How do you ensure GDPR and CCPA privacy compliance on a guest WiFi splash page?
Compliance requires explicit, granular, and freely given consent. Marketing communications opt-ins must not be pre-checked, and access to basic internet connectivity must not be conditional on consenting to promotional newsletters. Guest WiFi splash pages must provide direct links to an up-to-date privacy policy, clearly articulate what data is collected (MAC address, email, timestamps), define data retention schedules, and store auditable timestamped consent records.
Can custom WiFi login pages sync guest data directly with enterprise CRM and marketing platforms?
Yes. Modern cloud-managed WiFi captive portal platforms like Purple integrate via REST APIs and real-time webhooks with systems like Salesforce, HubSpot, Mailchimp, and Microsoft Dynamics. When a visitor completes authentication, their sanitized contact record, visit timestamp, venue identifier, and consent status are automatically synchronized to trigger welcome workflows or loyalty segmentation.
繼續閱讀本系列
Ubiquiti UniFi 訪客入口網站未重定向:原因與解決方法
本指南循序追蹤訪客狀態、重新導向、預先授權路由及控制器授權,藉此釐清 UniFi guest portal 重新導向失敗的原因。它為場域 IT 團隊提供了一套經過實證的方法,用以解決訪客網路與 Hotspot 之間的混淆、外部 portal 轉接、目前的 UniFi OS 帳戶要求,以及 DNS 隔離測試。
Cisco Meraki splash page 無法正常工作:疑難排解流程圖
這份實用的後期維運指南,旨在隔離 Cisco Meraki splash 流程失敗的環節:用戶端授權、HTTP 重新導向啟動、walled-garden 可達性或 RADIUS 登入。它為場域 IT 團隊提供了一條受控的實證路徑,以便在不對營運中系統進行大範圍變更的情況下恢復 Guest WiFi。
企業級 Guest WiFi 設定指南:VLAN 分段、安全性與 Captive Portal
本技術指南向 IT 團隊展示如何將 Guest WiFi 設定為受控的網際網路存取服務,利用 VLAN 分段、防火牆策略及 Captive Portal 進行管理。同時也說明了 Purple 的註冊表單與上網流程控制如何支援適度的訪客體驗,且不削弱員工、支付和營運系統周邊的安全邊界。
對於您的特定設置有任何疑問嗎?
我們的團隊與超過 80,000 個場域的場域營運商、IT 經理和網路工程師合作。立即預約 20 分鐘的通話,我們將向您展示其他與您相似的用戶是如何解決此問題的。