当前位置 博文首页 > 秒杀系统Web层设计的实现方法

    秒杀系统Web层设计的实现方法

    作者:旭旭同学 时间:2021-08-28 19:00

    秒杀系统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 class="org.springframework.web.servlet.view.InternalResourceViewResolver">
         <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部分的原因,我就暂时不去做总结。

    如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

    jsjbwy
    下一篇:没有了