秒杀模块碎碎念笔记(3)-WEB层

---

转发是服务器行为，重定向是客户端行为

使用情景：两个页面有数据传递则转发，否则可以用重定向
重定向：发生了两次请求，信息不会丢失，浏览器地址发生了改变
转发：只有一次请求，信息不会丢失，浏览器地址没有发生改变，没有ｒｅｑｕｅｓｔ传递的概念
流程
重定向：　发送请求 –>服务器运行–>响应请求，返回给浏览器一个新的地址以及３０２响应码，浏览器响应，发送一个新的请求
转发：发送请求 –>服务器运行–>进行请求的重新设置，例如通过request.setAttribute(name,value)–>根据转发的地址，获取该地址的网页–>响应请求给浏览器

---

Restful接口:

更加人性化的URL
原来的URL:
user/delete/{id}
使用Restful之后的URL:
user/{id}/delete

Restful规范
- GET 查询
- POST 添加/修改
- PUT 修改
- DELETE 删除操作
如果在方法头method没有对应上的话,则不会响应请求
@PathVariable:参数绑定

   @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";    }

---

SpringMVC运行流程

1. 用户发送HTTP请求,请求将有dispatcherServlet受理(其实是拦截所有请求,一般都这样写)
2. 在DefaultAnnotationHandlerMapper去寻找映射的URL,寻找handler
3. DefaultAnnotationHandlerAdapter进行寻找handler的适配
4. 最终会找到我们自己写的controller
5. DefaultAnnotationHandlerAdapter将返回一个ModelAndView给DispatcherServlet
6. DispatcherServlet寻找视图解析器,InternalResourceViewResolver
7. 然后将解析后的视图与model结合返回jsp给用户
   

   ---

RequestiMapping支持三种方式URL:

• 标准
• Ant 风格
• 带{XXX}占位符
  例子:
  /company/{companyID}/user/{userID}/detail
  

  ---

返回JSON数据:

produces 限制编码以及告诉浏览器这是一个json

  @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 = "userPhone",required = false) Long userPhone)    {        return result;    }

传入ｃｏｏｋｉｅＶａｌｕｅ
@CookieValue(value = "userPhone",required = false) Long userPhone

---

整合顺序，mybatis整合到spring，springmvc与spring基本不需要整合
所以在springmvc中配置文件

 <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            Mybites -> spring -> springMvc        -->        <init-param>            <param-name>contextConfigLocation</param-name>            <param-value>classpath:spring/spring-*.xml</param-value>        </init-param>    </servlet>

---

<mvc:annotation-driven/>
作用:自动注册运行流程中两大组件,提供数据绑定,以及对xml,json的读写支持,包括数字与日期类型的转换
<mvc:default-servlet-handler/>
可以使用/做路径映射,并且支持静态资源的处理,后缀为静态资源格式的话,不会去找mapper
不同配置文件配置扫描不同的包

---

---

controller中建议直接返回string
最好在controller包含一个log
写在controller中的方法中的参数可能为null,所以如果要用到话要判断一下
用cookice一定要用false

---

返回Json中的数据,使用泛型

public class SeckillResult<T> {    //请求是否成功    private boolean success;    private T data;    private String error;    public SeckillResult(boolean success, T data) {        this.success = success;        this.data = data;    }    public SeckillResult(boolean success, String error) {        this.success = success;        this.error = error;    }}

T在本项目中主要包装两种类型,一种是秒杀接口是否开放,一种是秒杀成功的信息.
JQ声明要先于bookstrap

---

静态包含,jsp内容直接合并
动态包含,先独立转换为servlet

---

时间进行格式:

<c:forEach items="${list}" var="sk">  <fmt:formatDate value="${sk.startTime}" pattern="yyyy-MM-dd HH:mm:ss" /> </c:forEach>

---

一般要将几个常用的头部放在一起(根据jsp所需要的位置):

<%@include file="common/tag.jsp"%>...<%@include file="common/head.jsp" %>

tag.jsp:

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %><%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

head.jsp:

<meta name="viewport" content="width=device-width, initial-scale=1.0"><meta charset="utf-8"><!-- 新 Bootstrap 核心 CSS 文件 --><link href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet"><!-- 可选的Bootstrap主题文件（一般不使用） --><link href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap-theme.min.css" rel="stylesheet"><!-- HTML5 Shim 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 --><!-- 注意： 如果通过 file://  引入 Respond.js 文件，则该文件无法起效果 --><!--[if lt IE 9]><script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script><script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script><![endif]-->

---

js要做到模块化
js文件也要引入

一个对象里面有很多对象,这些对象相当于方法var some={    封装URL    URL:{}    detail:{        init:function(params){                            var startTime = params['startTime'];            var endTime = params['endTime'];            var seckillId = params['seckillId'];        }    }}$(function{    some.detail.init({              seckillId:${seckill.seckillId},            startTime:${seckill.startTime.time},//毫秒            endTime:${seckill.endTime.time}    });});

---

bookstrap的model不一般,可以用js进行调用,如:

         //绑定手机 控制输出                var killPhoneModal = $('#killPhoneModal');                killPhoneModal.modal({                    show: true,//显示弹出层                    backdrop: 'static',//禁止位置关闭                    keyboard: false//关闭键盘事件                });

---

   $.cookie('userPhone', inputPhone, {expires: 7, path: '/seckill'});

尽量缩小cookie的范围
七天有效期,生效路径,路径越少,越节省流量

---

写一个带动画的span错误:

$('#killPhoneMessage').hide().html('<label class="label label-danger">手机号错误!</label>').show(300);

---

模拟界面登录（不登录不能进行秒杀）
先在cookie中寻找手机号,然后进行验证(是否符合格式,是否为空)
如果没有通过的话,弹出一个窗口强行让用户输入,输入后并提交后,先检查是否符合格式,如果符合格式,则登录进去,如果不符合则提示信息.
如果通过的话直接进去界面

---

提取ＵＲＬ
写在some．ＵＲＬ中，方便维护，而不用到代码中去找ＵＲＬ
写法，其实对象里面是一个方法，所以some.URL.now

---

使用Jquery的倒计时:

    <h2 class="text-danger">                <%--显示time图标--%>                <span class="glyphicon glyphicon-time"></span>                <%--展示倒计时--%>                <span class="glyphicon" id="seckill-box"></span>    </h2>

JS代码:
//放入的是开始时间

var seckillBox = $('#seckill-box');var killTime = new Date(startTime + 1000);//todo 防止时间偏移 seckillBox.countdown(killTime, function (event) {                //时间格式                var format = event.strftime('秒杀倒计时: %D天 %H时 %M分 %S秒 ');                seckillBox.html(format);            }).on('finish.countdown', function () {                //时间完成后回调事件                //获取秒杀地址,控制现实逻辑,执行秒杀                console.log('______fininsh.countdown');                seckill.handlerSeckill(seckillId, seckillBox);            });

---

发送post请求

 $.post(killUrl, {}, function (result) {} ( url, [data], [callback], [type] ) data (Map) : (可选) 要发送给服务器的数据，以 Key/value 的键值对形式表示。 type (String) : (可选)官方的说明是：Type of data to be sent。其实应该为客户端请求的类型(JSON,XML,等等)

---

one绑定一次,click一直绑定

---