秒殺系統Web層設計的實現方法

一、Restful接口設計

使用資源+名詞的方式來為url鏈接命名。例如：

訪問詳情頁的鏈接可以是： seckill/{seckillId}/detail

二、SpringMVC配置

1、首先要在web.xml中配置中央控制器。

<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
   http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
  version="3.1" metadata-complete="true">

  <!-- 修改servlet版本為3.1 -->
  <!-- 配置中央控制器DispatcherServlet -->
  <servlet>
    <servlet-name>seckill-dispatcher</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <!-- 配置springMVC需要加載的配置文件
      spring-dao.xml，spring-service.xml，spring-web.xml
      mybatis -> spring -> springMVC-->
    <init-param>
      <param-name>contextConfigLocation</param-name>
      <param-value>classpath:spring/spring-*.xml</param-value>
    </init-param>
  </servlet>

  <servlet-mapping>
    <servlet-name>seckill-dispatcher</servlet-name>
    <!-- 默認匹配所有的請求 -->
    <url-pattern>/</url-pattern>
  </servlet-mapping>
</web-app>

2、為了讓Spring管理Controller層的bean，需要新建一個spring-web.xml配置文件，

<beans xmlns="http://www.springframework.org/schema/beans"
   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xmlns:mvc="http://www.springframework.org/schema/mvc"
   xmlns:conext="http://www.springframework.org/schema/context"
   xsi:schemaLocation="http://www.springframework.org/schema/beans
   http://www.springframework.org/schema/beans/spring-beans-3.1.xsd
   http://www.springframework.org/schema/mvc
   http://www.springframework.org/schema/mvc/spring-mvc-3.1.xsd
   http://www.springframework.org/schema/context
   http://www.springframework.org/schema/context/spring-context-3.1.xsd">
   <!--配置Spring MVC-->
   <!--開啟SpringMVC注解模式-->
   <!--簡化配置
   1、自動注冊DefaultAnnotationHandlerMapping,AnnotationMethodHandlerAdapter
   2、提供一系列功能：數據綁定，數字和日期的轉化@NumberFormat,@DataTimeFormat
     xml,json默認讀寫支持
   -->
   <mvc:annotation-driven/>

   <!--servlet-mapping映射路徑-->
   <!--靜態資源默認servlet配置
     1、加入對靜態資源的處理：js，css，img
     2、允許使用/做整體映射
   -->
   <mvc:default-servlet-handler/>

   <!--配置jsp顯示viewResolver-->
   <bean>
     <property name="viewClass" value="org.springframework.web.servlet.view.JstlView"/>
     <property name="prefix" value="/WEB-INF/jsp/"/>
     <property name="suffix" value=".jsp"/>
   </bean>

   <!--掃描web相關的bean-->
   <conext:component-scan base-package="org.seckill.web"/>

</beans>

三、Controller層開發

項目中的每一個url都剛好對應著Controller層的一個方法。我們有兩種返回值類型。一種是讓頁面跳轉到某個網頁，在model中帶上從service層中獲得的數據。在下例中，前端的detail.jsp就能夠以${seckill.name}取得放在model中的sekill實體的名字。

  /**
   * 秒殺詳情頁
   * 
   * @param seckillId
   * @param model
   * @return
   */
  @RequestMapping(value = "/{seckillId}/detail", method = RequestMethod.GET)
  public String detail(@PathVariable("seckillId") Long seckillId, Model model) {
    if (seckillId == null) {
      return "redirect:/seckill/list";
    }
    Seckill seckill = seckillService.getById(seckillId);
    if (seckill == null) {
      return "forward:/seckill/list";
    }
    model.addAttribute("seckill", seckill);
    return "detail";
  }

另外一種是jsp頁面中點擊某個按鈕，通過ajax來刷新頁面的某部分，需要后端給前端一個json格式的數據。使用@ResponseBody告訴SpringMVC返回一個json類型的數據SeckillResult。由jsp頁面在JQeury的回調函數內拿到該json數據，并進行對應的操作。

@RequestMapping(value = "/{seckillId}/exposer", 
      method = RequestMethod.POST, 
      produces = {"application/json;charset=utf-8" })
  @ResponseBody
  public SeckillResult<Exposer> exposer(@PathVariable Long seckillId) {
    SeckillResult<Exposer> result;
    try {
      Exposer exposer = seckillService.exportSeckillUrl(seckillId);
      result = new SeckillResult<Exposer>(true, exposer);
    } catch (Exception e) {
      logger.error(e.getMessage(), e);
      result = new SeckillResult<Exposer>(false, e.getMessage());
    }

    return result;
  }

js代碼中回調函數的處理方式：

$.post(seckill.URL.exposer(seckillId),{},function(result){
      //在回調函數中，執行交互流程
      if(result && result["success"]){
var exposer = result["data"];
if(exposer["exposed"]){
  //開啟秒殺
  //獲取秒殺地址
  var md5 = exposer["md5"];  
  //綁定一次點擊事件，防止連續點擊
  var killUrl = seckill.URL.execution(seckillId,md5);
  console.log("秒殺地址："+killUrl);
}); 

四、請求方法的細節處理

1、請求參數的綁定

@RequestMapping(value = “/{seckillId}/exposer” 
public SeckillResult exposer(@PathVariable Long seckillId) 

2、請求方式的限制

@RequestMapping(method = RequestMethod.POST, 

3、請求轉發、請求重定向

return “redirect:/seckill/list”;（發送兩次請求，瀏覽器地址改變） 
return “forward:/seckill/list”;（發送一次請求，瀏覽器地址不變） 

4、數據模型賦值

model.addAttribute(“seckill”, seckill); 

5、返回json數據

@RequestMapping(value = “/{seckillId}/exposer”, 
method = RequestMethod.POST, 
produces = {“application/json;charset=utf-8” }) 
@ResponseBody 

6、cookies訪問

@RequestMapping(value = "/{seckillId}/{md5}/execution",
      method = RequestMethod.POST,
      produces = {"application/json;charset=UTF-8"})
  @ResponseBody
  public SeckillResult<SeckillExecution> execute(@PathVariable("seckillId") Long seckillId,
  @PathVariable("md5") String md5,
  @CookieValue(value = "killPhone", required = false) Long phone) {...}

@CookieValue(value = “killPhone”, required = false) Long phone)

(1)value(default “”):參數名例如: JSESSIONID

(2)required(default true):是否請求路頭中必須帶value指定的參數。如果沒有設置cookies我們這個業務也要能夠訪問并讓用戶填寫相應信息，所以設為false即可。

五、其他

其實課程的這一部分在前端js交互中有很多值得學習的地方，比如JQuery的使用，js模塊化開發，js交互設計等內容。因為時間關系以及復習側重點不在js部分的原因，我就暫時不去做總結。

如有疑問請留言或者到本站社區交流討論，感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！