高 晴,牟 艷,陸 輝,王靈利
(河海大學物聯網工程學院,常州213022)
基于網絡技術的競賽信息發布系統研究與設計?
高 晴,牟 艷,陸 輝,王靈利
(河海大學物聯網工程學院,常州213022)
根據綜合賽事信息發布的需要,提出了基于網絡技術的競賽信息發布系統解決方案。采用穩定的局域網、專網、公網三級組網模式,B/S(瀏覽器/服務器)網絡結構模式和多種數據通信協議,運用.Net和HTML5等軟件開發技術,將系統的實時性、通用性和跨平臺性作為設計重點,實現了競賽信息的實時采集、存儲、傳輸與多渠道發布。信息發布適用于傳統個人計算機網站和新興移動終端,在此基礎上嘗試了微信客戶端的信息發布,增強了客戶體驗。該方案已應用于“中華人民共和國第十二屆運動會”的競賽信息發布,滿足了競賽實際應用需求,為發布系統領域提供了借鑒。
網絡技術;信息發布;B/S結構模式;.Net技術;跨平臺;多渠道
隨著綜合體育賽事的發展和人們關注方式的增加,采用先進的技術手段,為賽場內外關注體育賽事的人們提供快速、準確、可靠、多渠道的賽事信息發布服務已成為亟待解決的問題。本論文提出一種基于網絡技術的競賽信息發布系統設計方案,構建了競賽信息采集與發布系統網絡架構,實現了競賽信息的實時采集與多渠道發布,用戶能夠方便快捷地查詢綜合體育賽事中各個單項的競賽日程、競賽實時成績、競賽獎牌、競賽總分名次、新紀錄等賽事信息。論文在實時性、通用性和跨平臺性的實現等方面進行了重點闡述。該方案已應用于“中華人民共和國第十二屆運動會”的競賽信息發布,滿足了競賽實際應用需求。該設計方案具有通用性,通過移植可實現不同賽事信息發布的需求,同時也可為其它信息發布應用領域提供借鑒。
2.1 系統結構
競賽信息發布過程分為信息采集、傳輸、處理、發布與展示。競賽信息發布系統的整體架構在設計上分為兩大模塊。第一塊是競賽信息采集與處理模塊,負責為信息發布系統提供信息,而其數據來源于外圍接口模塊中不同場館的現場成績系統;第二塊是競賽信息發布模塊,負責發布信息供用戶查看,采用B/S網絡結構模式,從競賽信息采集與處理模塊接收競賽信息后,經內部核查系統審核,發布給用戶,用戶通過互聯網,以各種渠道去查看發布與展示的競賽相關信息,系統整體架構如圖1所示。

圖1 競賽信息發布系統整體架構圖
2.2 系統組網模式
根據競賽信息發布準確、實時、穩定的需求,系統的組網模式設計為“場館局域網”、“競賽專網”和“公網Internet(互聯網)”三級。每個現場成績系統連接在各自的場館局域網內,為信息發布提供數據來源。外圍接口模塊通過數據交換平臺與整個競賽信息發布系統連接在競賽專網內。競賽信息處理系統、競賽信息發布數據庫、內部核查系統與競賽信息發布服務器共同連接在競賽專網內,信息經核查,通過Internet與各個用戶所用設備進行連接,為現場競賽和公共查詢服務。
競賽信息采集與處理模塊負責競賽數據的實時采集、傳輸與處理,采集并處理從現場發來的競賽數據,存儲在競賽信息數據庫內,為競賽信息發布模塊提供發布所需信息。該模塊包括競賽信息采集和競賽信息處理兩個部分。
3.1 競賽信息采集
競賽信息采集模塊完成競賽數據的采集并存儲。競賽數據來自各個現場成績系統,采集的數據有兩種形式,一種是在某一階段比賽完成后生成的表單文件,通常為PDF報表。另一種是競賽實時數據,一般以XML可標記性語言文件作為數據傳播的橋梁[1]。
以往競賽中普遍發布的只是第一種方式的表單文件,如比賽結束后生成的成績公告表,可用于查詢比分,方法是將采集的表單文件和對應的URL地址分別保存到競賽信息發布服務器和競賽信息發布數據庫。但是來自各個現場成績系統的表單文件,只有某一階段比賽結束后才能完整生成,特點是完整性強而實時性差。
為滿足用戶實時查看比賽信息的需要,系統在每一次競賽信息變化的時間點,采集實時成績并發布,使用XML作傳輸協議,實現現場成績系統與競賽信息發布系統間的信息交互,完成競賽數據實時采集。如十二屆全運會“馬術項目場地障礙團體第一輪”比賽進程中采集到的XML數據格式的實時成績信息,如圖2所示。Message是根節點;Row是一級節點,按出場順序記錄包括上海、北京、新疆等代表團在本輪的實時成績信息;二級節點Row1,展示各代表團所有運動員該輪的實時成績信息。

圖2 馬術項目XML數據格式實時成績內容
3.2 競賽信息處理
競賽信息處理模塊主要負責對采集到的XML數據進行解析、計算、歸納與存儲,并將處理所得信息提供給競賽信息發布模塊。根據競賽規程將解析后所得數據進行如積分計算、個人名次排名、團體名次排名、獎牌統計等處理并存儲,用于綜合信息的發布。
競賽信息發布模塊負責將競賽信息發布數據庫中的信息,發布到用戶使用的設備上,供用戶查看。該模塊面臨著發布渠道多樣、用戶終端多樣和操作系統平臺多樣的問題,為達到構建通用的競賽信息發布方案的目的,系統采用B/S結構模式[2],將發布系統中相對穩定的公共業務放在服務端,負責發布數據與頁面的構建和對客戶請求的響應;客戶端則采用瀏覽器模式,通過與發布終端配套的信息發布HTML頁面模版完成競賽信息的瀏覽,競賽信息發布模塊原理如圖3所示??蛻舳瞬捎肏TTP通信協議發送請求,服務端針對不同的請求參數完成響應,并將數據或頁面返回給客戶端,兩者之間數據交換的信息載體主要采用URL地址和XML、JSON類型文件。

圖3 競賽信息發布模塊原理圖
4.1 客戶端
客戶端完成信息的請求、接收、完整頁面的生成與展示??蛻舳说脑O計重點在于進行多渠道發布。針對發布渠道單一性,在傳統PC設備的基礎上增加移動設備,解決的關鍵問題是跨平臺,跨平臺是指開發的應用可以在不同操作系統平臺下運行。
(1)設計原理
客戶端使用JS模板引擎BaiduTemplate[3],它將頁面模板和傳入數據進行綁定,生成完整的展示頁面。信息請求接收的工作流程則隨發布渠道的不同而各有特點。
對于PC端或移動App端,當用戶首次瀏覽PC端網頁或安裝App應用程序時,實時請求服務端的頁面資源。各客戶端在運行期間,如果下載到本地的資源與服務端保持一致,則訪問本地文件,如果服務端資源有所更新,則對比時間參數,重新請求時間參數不一致的資源文件。由于現場數據是實時更新的,客戶端需實時發送HTTP請求數據資源。請求的數據有兩種,第一種是表單文件,展示的是URL地址對應的表單文件內容。另一種是競賽實時數據,展示的是實時信息頁面。
對于微信公眾平臺客戶端,客戶端關注微信公眾號后,可請求兩種數據。一種是普通消息,以XML格式進行數據請求,微信公眾平臺進行消息轉發,客戶端接收從服務端返回的XML格式數據。另一種是鏈接消息,無需通過微信公眾平臺進行消息轉發,由客戶端直接向服務端請求。
(2)跨平臺解決途徑
客戶端設計面臨的最大問題是客戶端平臺多樣化。針對PC端,目前已有多種移植方案,本系統采用ASP.NET[4],因為ASP.NET是基于通用語言編譯運行的程序,其實現完全依賴于虛擬機,所以它擁有跨平臺性,ASP.NET構建的應用程序可以運行在幾乎全部平臺上。
移動App端設計借助移動終端瀏覽器的跨平臺性處理業務邏輯。系統運行時,保存在競賽信息發布服務器的資源文件會被打包下載到客戶端,由瀏覽器解析數據并運行程序,由于大部分移動客戶端的瀏覽器都能運行HTML5、CSS和JavaScript,是跨平臺信息發布的基礎。運用核心庫jQuery Mobile提供的統一的移動UI框架,自適應于各類尺寸規格的移動設備,實現頁面隨設備大小不同予以自適應展示的功能。
微信公眾平臺客戶端,則利用微信平臺開放的接口本身的跨平臺服務實現二次開發[5]。
4.2 服務端
(1)設計原理
服務端主要負責頁面模板和URL等資源文件的存儲、數據庫操作、數據響應包括數據解析和數據構造等。存儲過程中,服務端的競賽信息發布數據庫存儲全部滿足業務需求的頁面模板及從競賽信息采集與處理模塊接收的資源文件。
數據響應過程中,服務端接收不同渠道的客戶端發來的請求參數。若請求參數請求的是表單文件,將URL地址所在表單類文件發送至客戶端,由于現場成績系統生成表單文件信息量較多,頁面較大,不適于在屏幕相對較小的移動客戶端直接展示。若請求參數請求的是競賽實時數據,根據參數找到相應的方法及路徑,訪問競賽信息發布數據庫,將數據反饋給客戶端。系統后臺選擇ASP.Net開發環境,采用競賽信息發布服務器IIS及開發工具Visual Studio 2012[4]。
(2)公共業務的提取與設計
為提高服務端的開發效率,對信息發布系統服務端進行功能劃分,模塊間遵循高內聚低耦合的基本原則,將具體業務操作與抽象訪問邏輯進行分離,將業務邏輯抽象成為類的方法,數據訪問、對請求消息的解析、對數據的構造等公共業務,可抽象為公共業務對象,只需調用公共接口函數即可實現相關功能[6]??梢栽诓煌椖恐兄赜霉矘I務部分的設計模塊,無需重復編寫大量代碼。
主要的通用公共類有如下幾種:
對數據進行訪問的類,主要包括數據表的增加、刪除、修改、查詢等功能,實現從數據庫或競賽信息發布服務器資源文件中獲取數據值的功能;
對請求消息進行解析的類,主要功能是解析客戶端請求,獲取請求參數,根據請求參數調用數據訪問類中的相應方法;
對數據進行構造的類,主要是以客戶端和服務端之間統一的數據結構為標準,將數據訪問類中獲取的數據創建成客戶端所需的類或XML文件,也可將獲取到的數據格式轉化成JSON類型文件。
4.3 數據通信
(1)多平臺的數據共享
由于數據來源及數據去向的未知性,系統還需解決數據在不同平臺的共享問題?;诰W絡通信協議,需要設計多個專用接口向多個模塊進行通信,把競賽信息發布服務器當成一個接口,該系統數據通信示意圖如圖4所示?,F場成績系統與競賽信息發布數據庫傳輸XML文件采用SOAP協議,傳輸PDF文件采用FTP協議;競賽信息處理系統與競賽信息發布數據庫采用UDP協議;競賽信息發布服務器與各種客戶端之間采用HTTP協議[7];競賽信息發布服務器與競賽信息發布數據庫之間采用CGI通用網關接口及各公司提供的專用接口API。

圖4 數據通信示意圖
(2)實時性通信解決方案
信息發布系統最基本的要求是確保其高效性和實時性。系統使用jQuery、jQuery Mobile分別作為PC端和移動終端的前端開發框架[8]。用此框架,一方面利用HTML5和CSS3快速開發移動網頁,HTML5的LocalStorage可以對頁面資源進行緩存,以此減少HTTP請求數,避免頻繁訪問網絡資源,犧牲空間來換時間,提高發布效率。另一方面可以提供異步請求的關鍵技術Ajax。Ajax技術可以按需通過競賽信息發布服務器去競賽發布系統數據庫請求業務數據,最大程度地減少冗余請求,減少數據下載總量,減少帶寬消耗。前端頁面可快速實時的更新下載數據,實現客戶端與服務端之間的實時通信。
中華人民共和國第十二屆運動會共有40個單項,可分別在PC端網頁和移動終端上發布競賽信息。圖5、圖6所示分別為馬術項目競賽信息發布系統的PC端、移動App端的發布頁面圖。用戶通過PC端,按比賽名稱下的項目輪次,查看實時比賽結果,下載報表下的秩序單、成績公告等查看賽事報表;通過移動App端,查看各個運動員的比賽成績,整個競賽信息發布系統提供了友好服務。

圖5 PC端競賽信息發布頁面

圖6 移動App端競賽信息發布圖
結合競賽信息發布系統的需求,基于網絡技術進行了本課題研究與設計,實現了競賽信息的采集與發布,對軟件通用、軟件架構等進行分析,適應目前移動終端等多平臺多渠道發布形式。該方案已應用于“中華人民共和國第十二屆運動會”的競賽信息發布,滿足了競賽實際應用的需求,驗證了系統設計方案的可行性。該設計方案具有通用性,通過移植可實現不同賽事信息發布的需求,同時也具有可擴展性,隨著平臺終端類型的發展,還可支持發布渠道的擴展,該設計思路也可用于其它信息發布應用領域。
[1] 華銓平,張玉寶.XML語言及應用[M].北京:清華大學出版社,2005.
HUA Quan-Ping,ZHANG Yu-Bao.XML language and application[M].Beijing:Tsinghua University press,2005.
[2] 查修齊,吳榮泉,高元鈞.C/S到B/S模式轉換的技術研究[J].計算機工程,2014(1):263-267.
CHA Xiu-Qi,WU Rong-Quan,GAO Yuan-Jun.Technology research of C/S to B/Smode conversion[J].Computer engineering,2014(1):263-367.
[3] 澤卡斯(Zakas.Nicholas C.).JavaScript高級程序設計(第3版)[M].北京:人民郵電出版社,2012.
Zakas.Nicholas C.JavaScript advanced programming(third edition)[M].Beijing:PT press,2012.
[4] 陳長春.Asp.net程序設計基礎教程[M].北京:清華大學出版社,2011.
CHEN ChangChun.Asp.net advanced programming basic course[M].Beijing:Tsinghua University press,2011.
[5] 夏凌云,韓立峰,王長慶.利用微信公眾平臺打造校園信息移動發布平臺[J].信息技術,2014(2):183-185,190.
XIA Ling-Yun,HAN Li-Feng,WANG Chang-Qing.Using WeChat public platform to create university information mobile release platform[J].Information technology,2014(2):183-185,190.
[6] 鄧桂騫,趙躍龍,黃永峰.提高程序代碼通用性和易維護性問題的研究[J].興義民族師范學院學報,2010(1):93-98.
DENG Gui-Qian,ZHAO Yue-Long,HUANG Yong-Feng.Research of improving universal and easy maintenance of program code[J].XingYi Race Teacher college journal,2014(1):93-98.
[7] 葉強.超文本傳輸協議:HTTP/1.0[J].科技情報開發與經濟,2004(8):66-68.
YE Qiang.Hypertext transfer protocol HTTP/1.0[J].Development of scientific and technological information and economy,2014(8):66-68.
[8] 李海峰.基于HTML5+jQuery Mobile的移動學習平臺Web App研究與實現[J].信息通信,2014(5):84-85.
LIHai-Feng.Research and design of mobile learning platform about Web App based on HTML5+jQuery Mobile[J].Information communication,2014(5):84-85.
Research and Design of the Com petition Information Release System Based on Network Technology
Gao Qing,Mu Yan,Lu Hui,Wang Lingli
(College of Internet of Things Engineering,Hohai University,Changzhou 213022,China)
According to the requirement of the comprehensive competition information release,a solution of the competition information release system based on network technology is presented.The real-time acquisition,transmission,storage and multimedia release of information have been achieved,the network modes such as the three-tier network mode including Local area network,Private network and Public network are used,the protocols of the B/S(Browser/Server)structure mode and multiple communication and the software development technology of.Net and HTML5 are used as well to take real-time,universality and cross-platform as the priority.On the basis of traditional computer and developingmobile phone,the information release is conducted to combine WeChat to improve customer experience.Actually the system has met the requirements of practical application in the information release of the 12th national games and will provide reference for area of releasing system.
Network technology;Information release;B/S structuremode;.Net technology;Crossplatform;Multiple channel
10.3969/j.issn.1002-2279.2015.05.006
TP31
A
1002-2279(2015)05-0018-05
國家體育總局體育信息中心委托項目—中華人民共和國第十二屆運動會的競賽信息發布系統
高晴(1991-),女,湖南省醴陵市人,碩士研究生,主研方向:智能信息處理理論與技術。
2015-02-07