????????跟著做了這么久，遲遲沒(méi)有看到效果是不是很不耐煩了，不過(guò)，今天你就能見到光明了，如果你一直跟著來(lái)，那么今天就可以看到原始版的秒殺系統(tǒng)了，如果你沒(méi)有一直跟下來(lái)，沒(méi)關(guān)系，你可以參考下面的鏈接
實(shí)戰(zhàn)篇：基于SSM的秒殺系統(tǒng)之項(xiàng)目介紹
實(shí)戰(zhàn)篇：基于SSM的秒殺系統(tǒng)之項(xiàng)目搭建和數(shù)據(jù)庫(kù)設(shè)計(jì)
實(shí)戰(zhàn)篇：基于SSM的秒殺系統(tǒng)之DAO層搭建
實(shí)戰(zhàn)篇：基于SSM的秒殺系統(tǒng)之Service層搭建
????????今天主要講解WEB層的搭建，有很多知識(shí)都是前端的，所以你在學(xué)習(xí)后臺(tái)的同時(shí)也可以學(xué)習(xí)一下前段。

秒殺前端流程

????????首先來(lái)介紹一下秒殺前端的整個(gè)流程

秒殺流程

????????其中最主要的是詳情頁(yè)的操作，詳情頁(yè)的主要操作為

詳情頁(yè)操作

RESTFUL接口設(shè)計(jì)

????????為了使URL設(shè)計(jì)的更加規(guī)范，采用Restful風(fēng)格的設(shè)計(jì)
，本系統(tǒng)主要的接口有

接口設(shè)計(jì)

SeckillController設(shè)計(jì)

????????SeckillController主要有五個(gè)方法分別是

public String list(Model model)//獲取列表頁(yè)
public String detail(@PathVariable("seckillId") Long seckillId, Model model)//獲取詳情頁(yè)
public SeckillResult<Exposer> exposer(@PathVariable("seckillId") Long seckillId) //暴露秒殺接口
public SeckillResult<SeckillExecution> execute(@PathVariable("seckillId") Long seckillId,
            @PathVariable("md5") String md5, @CookieValue(value = "killPhone", required = false) Long phone) //秒殺結(jié)果
public SeckillResult<Long> time()//獲取系統(tǒng)時(shí)間

頁(yè)面設(shè)計(jì)

頁(yè)面主要采用Bootstrap框架進(jìn)行設(shè)計(jì)，這里不詳細(xì)給出代碼了

頁(yè)面交互

頁(yè)面上主要采用了JQuery的cookie插件和倒計(jì)時(shí)插件，JavaScript采用了模塊化思想，如果你想學(xué)習(xí)一下可以看一下源代碼。
最后給出效果圖

列表頁(yè)

秒殺頁(yè)

秒殺成功頁(yè)

最后給出地址

https://github.com/lctiter/seckill.git

謝謝閱讀