基于RESTful以及Salted Password Hashing算法的模擬試衣間系統(tǒng)

摘? 要：本文主要從系統(tǒng)設(shè)計、功能實現(xiàn)、整體架構(gòu)的角度介紹了基于B/S模式下的模擬試衣間系統(tǒng)。本文還著重地介紹了Salted Password Hashing加密算法與傳統(tǒng)的哈希函數(shù)加密算法之間存在的區(qū)別與聯(lián)系，Salted Password Hashing加密算法在傳統(tǒng)的軟件系統(tǒng)中能夠發(fā)揮重要作用，以及RESTful架構(gòu)下軟件系統(tǒng)的使用設(shè)計、實現(xiàn)方案及REST設(shè)計規(guī)范為實際軟件編程帶來的便利。

關(guān)鍵詞：模擬試衣間系統(tǒng);RESTful;前后端分離;Salted Password Hashing

Abstract：The article mainly investigates into the design，functions and structure of the simulated fitting room system based on the B/S pattern，emphasizing the differences and associations between the Salted Password Hashing and traditional Hashing algorithm，Salted Password Hashing encryption algorithm can play an important role in traditional software systems，and the use design，implementation scheme and REST design specifications of software systems under RESTful architecture bring convenience to actual software programming.

Keywords：simulated fitting room system;RESTful;front-back end decoupling;Salted Password Hashing

0? 引? 言

在這個快速發(fā)展的互聯(lián)網(wǎng)時代，人們的購物活動與以前相比發(fā)生了天翻地覆的改變，而其中十分重要的一部分是衣服的購買。在互聯(lián)網(wǎng)并沒有得到普及的時代，人們購買衣服依靠于實體店，人們需要花大量的時間逛一家又一家的實體店，不斷地嘗試各式各樣的衣服以挑選自己最心儀的那一款。而如今，即使互聯(lián)網(wǎng)得到了普及，人們在網(wǎng)上購買衣服的時候也經(jīng)常出現(xiàn)購買的產(chǎn)品不合身、不滿意的情況。因此需要一款系統(tǒng)允許用戶在網(wǎng)上完成試衣，既能豐富用戶購買衣服的體驗，又能有效地減少用戶衣服退換貨的概率。針對以上需求，我們設(shè)計了一個模擬試衣間系統(tǒng)，幫助用戶模擬真實的試衣環(huán)節(jié)，滿足用戶各類別衣服的挑選、組合搭配等要求。除此之外，本系統(tǒng)還設(shè)有管理員權(quán)限，以進行衣服商品的統(tǒng)一管理。用戶除了進行基本賬號信息登記之外，還能夠選擇角色性別以及角色頭像，滿足不同人群的試衣需求。系統(tǒng)設(shè)有靈活的衣服種類管理功能，能夠簡單地完成衣服種類的添加、刪除和修改操作，并且用戶及系統(tǒng)管理員能夠進行相應(yīng)衣服類別的指向性查詢。在試衣環(huán)節(jié)，用戶可以從不同種類的衣服中進行任意挑選，通過外套、內(nèi)襯、褲子等衣服的層級改變，用戶可以完成任意外搭以及內(nèi)搭需求，滿足了用戶多樣的衣服搭配想法。在完成了心儀衣服的搭配試衣之后，用戶還能進行搭配保存以及與其他用戶之間的交流與分享?；谟脩粜畔⒌陌踩钥紤]，系統(tǒng)為每一位用戶的密碼進行了Salted Password Hashing算法加密，為用戶的個人隱私增添了一道有力的防火墻。

1? 前端

前端的開發(fā)基于HTML+CSS+JQuery這對經(jīng)典組合，在實際的使用當中不乏許多當前流行的HTML5以及CSS3技術(shù)，除此之外，項目之中的JQuery使用了JQuery3版本，對比以往的setTimeout以及setInterval，利用JQuery3中提供的requestAnimationFrame這一新API能夠?qū)崿F(xiàn)anima-tion更流暢地展示，防止發(fā)生動畫阻塞。

1.1? 注冊登錄界面

在注冊登錄界面，左側(cè)的“FittingRoom.”標志添加了動態(tài)切換效果，界面下方是注冊登錄界面的導(dǎo)航欄。注冊登錄界面如圖1所示。

1.2? 主頁面

主界面采用居家背景，以及白色、淡墨綠色為主色調(diào)，營造舒適、安逸的環(huán)境氛圍。試衣間界面如圖2所示。

1.3? 功能詳細介紹

1.3.1? 注冊功能

在注冊登錄界面的下方菜單欄，點擊“切換”，頁面右側(cè)的登錄框?qū)陆?，隨之注冊框?qū)弦?，通過登錄框與注冊框之間的動態(tài)切換將登錄與注冊放置在同一個界面中。在注冊框中用戶可以進行用戶名、密碼、性別、頭像等個人信息填寫。

1.3.2? 登錄功能

在注冊登錄界面，默認展示登錄框。用戶在登錄框輸入自己的用戶名以及密碼，系統(tǒng)會自動將密碼通過Salted Password Hashing算法進行密碼驗證。最終會有動態(tài)彈框進行登錄結(jié)果的提示。

1.3.3 用戶管理功能

用戶通過快捷鍵調(diào)出功能菜單，并從中選擇“用戶管理”，伴隨著展開動畫，功能模塊將會出現(xiàn)。“用戶管理”只有管理員才能夠進行訪問，普通用戶訪問將會彈出權(quán)限不足提示框。在用戶管理模塊，管理員能夠進行用戶賬號信息的管理。

1.3.4? 服飾類型管理功能

用戶通過快捷鍵調(diào)出功能菜單，并從中選擇“服飾類型管理”，伴隨著展開動畫，功能模塊將會出現(xiàn)?！胺楊愋凸芾怼敝挥泄芾韱T才能夠進行訪問，普通用戶訪問將會彈出權(quán)限不足提示框。在服飾類型管理模塊，管理員能夠?qū)σ延械姆楊愋瓦M行修改與刪除，還能進行新服飾類型的添加操作。

1.3.5? 服飾管理功能

用戶通過快捷鍵能夠調(diào)出功能菜單，并從中選擇“服飾管理”，伴隨著展開動畫，功能模塊將會出現(xiàn)?！胺椆芾怼敝挥泄芾韱T才能夠進行訪問，普通用戶訪問將會彈出權(quán)限不足提示框。在服飾管理模塊，管理員對已有的服飾名稱、服飾所屬類型、價格、圖片進行修改與刪除，還能進行新服飾的添加。

1.3.6? 試衣間功能

用戶通過快捷鍵調(diào)出功能菜單，并選擇“試衣間”，伴隨著展開動畫，功能模塊將會出現(xiàn)?！霸囈麻g”功能允許所有用戶訪問，用戶能夠進行服飾類型的選擇，然后系統(tǒng)將會自動顯示該服飾類型下的所有衣服，通過鼠標點擊操作，用戶能將所選的衣服“穿上身”，對多種服飾類型以及服飾的選擇完成試衣搭配。在此期間，用戶還能夠進行衣服層級的調(diào)整，以進行不同內(nèi)搭、外搭的選擇。通過對購物車中衣服的價格計算，計算出當前用戶穿在身上的衣服價格總和。

當用戶選擇不同的服飾類型，即觸發(fā)以上代碼。事先在option中插入的value屬性保存該服飾類型的編號，當用戶選擇服飾類型時，獲取用戶選擇的服飾類型編號以及當前用戶的角色性別，然后將這兩個信息傳至后端，后端通過服飾類型編號以及角色性別將相應(yīng)的服飾以JSONArray的形式發(fā)送至前端以進行展示。

1.3.7? 保存搭配功能

在用戶完成服飾搭配之后，點擊“橙色”的保存按鍵，系統(tǒng)將會為用戶進行當前試穿衣服的保存。當用戶再次進行系統(tǒng)登錄時，系統(tǒng)會自動為用戶顯示已保存的搭配，以便于用戶進行搭配的修改。

以上代碼用以完成用戶搭配服飾的保存，當用戶點擊保存按鈕時觸發(fā)保存操作，將當前所有衣服的編號、層級保存至數(shù)組當中，最終將數(shù)組發(fā)送至后端，經(jīng)過處理后得以保存。

2? Salted Password Hashing算法

大多數(shù)軟件系統(tǒng)都需要與賬號產(chǎn)生聯(lián)系，有效保證賬號密碼的安全性是一個艱巨的任務(wù)。Salted Password Hashing通常是被用來給用戶的個人賬號密碼提升安全性的一把鎖。哈希算法本身是一種單向（Uni-Directional）的函數(shù)，它能夠?qū)⑷我忾L度的Plain text轉(zhuǎn)換成一段固定長度的Cipher，這個特性十分適用于賬號密碼加密。因此在本項目中，采用了Salted Password Hashing進行密碼的加密。Salted顧名思義“鹽化的”，即是指在整個哈希加密過程中給最終的Cipher中添加一段隨機的字符串，而這段隨機的字符串即被稱為鹽值。由于這一段隨機字符串的存在，同一段密碼在經(jīng)過兩次Salted Password Hashing之后得到的Cipher將會是不同的兩段字符串，使得密碼被破解的可能性大大減小。

3? RESTful架構(gòu)

REST的全稱是Representational State Transfer，是一套完善的API設(shè)計規(guī)范，而符合如此設(shè)計規(guī)范的架構(gòu)則被稱為RESTful架構(gòu)。RESTful架構(gòu)有著許多優(yōu)勢，例如同一個URI能夠同時供給GET、POST、PUT、DELETE方法進行不同操作。除了其輕量以及數(shù)據(jù)描述簡單之外，其優(yōu)勢還在于實現(xiàn)了項目的前后端分離，何為前后端分離？舉個例子，當沒有實現(xiàn)項目的前后端分離，前端與后端工作通常是串行的，即前端等著后端的數(shù)據(jù)接口完成后才能進行前端的進一步開發(fā)以及測試工作，當以小組完成項目時，這無疑拖慢了整個項目的進度。然而因為項目的前后端分離，不再需要相互等待，前端與后端的開發(fā)工作實現(xiàn)并行，從而實現(xiàn)將整個項目的開發(fā)周期縮短。

4? 結(jié)? 論

在這個全民互聯(lián)網(wǎng)時代，網(wǎng)上購物的普及為模擬試衣間系統(tǒng)的開發(fā)提供了很好的需求契機。基于B/S模式的模擬試衣間系統(tǒng)，利用RESTful架構(gòu)實現(xiàn)了項目開發(fā)的前后端分離，有利于團隊開發(fā)。在下一步的系統(tǒng)完善中，將會陸續(xù)增加添加好友以及分享服飾搭配等功能，為用戶提供一個更具趣味性、功能更加豐富的軟件系統(tǒng)。

參考文獻：

[1] 祝彥斌，王春玲.一種Hash特征隱藏的加鹽信息摘要模型 [J].計算機技術(shù)與發(fā)展，2013，23（3）：134-138.

[2] 陳佳康.密碼學(xué)算法的優(yōu)化與應(yīng)用 [D].北京：北京郵電大學(xué)，2013.

[3] 肖德芳，劉卓.基于Javaweb的科研項目管理系統(tǒng)的設(shè)計與實現(xiàn) [J].電腦知識與技術(shù)，2017，13（27）：69-70.

作者簡介：夏禹（1995.09-），男，漢族，江西南昌人，本科，主要研究方向：軟件工程理論與方法。