javaweb商城秒杀系统--页面级高并发秒杀优化Redis缓存+静态化分离(四)

因为并发的瓶颈最大就是出现在数据库上,所以我们最有效的方式就是缓存
一、页面缓存
1.取缓存
2.手动渲染模版
3.结果输出

//商品列表
@RequestMapping(value = "/to_list",produces = "text/html")
@ResponseBody
public String toLogin(HttpServletRequest request,HttpServletResponse response
                                        , Model model, MiaoshaUser user ){
    //return "goods_list";
    //先从缓存中去页面代码
    String html=redisService.get(GoodsKey.getGoodsList,"",String.class);
    //如果不是空就把取出来的页面直接返回去
    if(!StringUtils.isEmpty(html)){
        return html;
    }
    //第一步查询商品列表
    List<GoodsVo> goodsVoList=goodsService.getGoodsVoList();
    model.addAttribute("goodsList",goodsVoList);
    SpringWebContext swc=new SpringWebContext(request,response
           ,request.getServletContext(),request.getLocale(),model.asMap(),applicationContext);
    //手动渲染
    html=thymeleafViewResolver.getTemplateEngine().process("goods_list",swc);
    if(!StringUtils.isEmpty(html)){
        redisService.set(GoodsKey.getGoodsList,"",html);
    }
    return html;
}

//使用了缓存的详情页
//使用了缓存的详情页
   /* @RequestMapping(value = "/to_detail/{goodsId}",produces = "text/html")
    @ResponseBody
    public String toDetail(HttpServletRequest request,HttpServletResponse response
                  ,Model model, MiaoshaUser user, @PathVariable("goodsId") Long goodsId){
    //首先取缓存
        String html=redisService.get(GoodsKey.getGoodsList,""+goodsId,String.class);
        if(!StringUtils.isEmpty(html)){
            return html;
        }
        //手动渲染
        model.addAttribute("user",user);
        //得到商品id然后通过id获取商品的详情
        GoodsVo goodsVo=goodsService.getGoosVoByGoodsId(goodsId);
        model.addAttribute("goods",goodsVo);
        //获取一个秒杀开始时间
         long startAt=goodsVo.getStartDate().getTime();
        //获取一个秒杀结束时间
        long endAt=goodsVo.getEndDate().getTime();
        //获取当前时间
        long now=System.currentTimeMillis();
        int miaoshaStatus=0;//设置一个状态
        int remainSeconds=0;//还剩多少时间
        if(now<startAt){
            //秒杀还没有开始
            miaoshaStatus=0;
            remainSeconds= (int) ((startAt-now)/1000);
        }else if(now>endAt){
            //秒杀结束
            miaoshaStatus=2;
            remainSeconds=-1;
        }else {
            //秒杀进行时
            miaoshaStatus=1;
            remainSeconds=0;
        }

        //秒杀时的状态和时间传入到前端页面
        model.addAttribute("miaoshaStatus",miaoshaStatus);
        model.addAttribute("remainSeconds",remainSeconds);
        SpringWebContext swc=new SpringWebContext(request,response
                ,request.getServletContext(),request.getLocale(),model.asMap(),applicationContext);

        //手动渲染
        html=thymeleafViewResolver.getTemplateEngine().process("goods_detail",swc);
        if(!StringUtils.isEmpty(html)){
            redisService.set(GoodsKey.getGoodsDetail,""+goodsId,html);
        }
    return html;
       // return "goods_detail";
    }

二、对象缓存
失效:应用程序先从缓存中取数据,没有得到,则从数据库中取,成功后,放到缓存中;

命中:应用程序从缓存中取数据,取得后返回;

更新:先将数据存到数据库中,成功后,再让缓存失效;

对象缓存之后,若有数据更新,一定要更新缓存,否则会出现缓存不一致的情况
三、页面静态化
简单来说,就是使用html进行页面展示,ajax进行前后端交互,流行的框架有Vue、Angular。静态化可以使html代码在客户端缓存,不需要去请求服务器。

<!DOCTYPE HTML>
<html>
<head>
    <title>订单详情</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <!-- jquery -->
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <!-- bootstrap -->
    <link rel="stylesheet" type="text/css" href="/bootstrap/css/bootstrap.min.css" />
    <script type="text/javascript" src="/bootstrap/js/bootstrap.min.js"></script>
    <!-- jquery-validator -->
    <script type="text/javascript" src="/jquery-validation/jquery.validate.min.js"></script>
    <script type="text/javascript" src="/jquery-validation/localization/messages_zh.min.js"></script>
    <!-- layer -->
    <script type="text/javascript" src="/layer/layer.js"></script>
    <!-- md5.js -->
    <script type="text/javascript" src="/js/md5.min.js"></script>
    <!-- common.js -->
    <script type="text/javascript" src="/js/common.js"></script>
</head>
<body>
<div class="panel panel-default">
  <div class="panel-heading">秒杀订单详情</div>
  <table class="table" id="goodslist">
        <tr>  
        <td>商品名称</td>  
        <td colspan="3" id="goodsName"></td> 
     </tr>  
     <tr>  
        <td>商品图片</td>  
        <td colspan="2"><img  id="goodsImg" width="200" height="200" /></td>  
     </tr>
      <tr>  
        <td>订单价格</td>  
        <td colspan="2"  id="orderPrice"></td>  
     </tr>
     <tr>
     		<td>下单时间</td>  
        	<td id="createDate" colspan="2"></td>  
     </tr>
     <tr>
     	<td>订单状态</td>  
        <td id="orderStatus">
        </td>  
        <td>
        	<button class="btn btn-primary btn-block" type="submit" id="payButton">立即支付</button>
        </td>
     </tr>
      <tr>
     		<td>收货人</td>  
        	<td colspan="2">小张  1735342429</td>
     </tr>
     <tr>
     		<td>收货地址</td>  
        	<td colspan="2">杭州市滨江区</td>
     </tr>
  </table>
</div>
</body>
</html>
<script>
function render(detail){
	var goods = detail.goods;
	var order = detail.order;
	$("#goodsName").text(goods.goodsName);
	$("#goodsImg").attr("src", goods.goodsImg);
	$("#orderPrice").text(order.goodsPrice);
	$("#createDate").text(new Date(order.createDate).format("yyyy-MM-dd hh:mm:ss"));
	var status = "";
	if(order.status == 0){
		status = "未支付"
	}else if(order.status == 1){
		status = "待发货";
	}
	$("#orderStatus").text(status);
	
}

$(function(){
	getOrderDetail();
})

function getOrderDetail(){
	var orderId = g_getQueryString("orderId");
	$.ajax({
		url:"/order/detail",
		type:"GET",
		data:{
			orderId:orderId
		},
		success:function(data){
			if(data.code == 0){
				render(data.data);
			}else{
				layer.msg(data.msg);
			}
		},
		error:function(){
			layer.msg("客户端请求有误");
		}
	});
}
///
// 获取url参数
function g_getQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if(r != null) return unescape(r[2]);
    return null;
};
//设定时间格式化函数,使用new Date().format("yyyyMMddhhmmss");
Date.prototype.format = function (format) {
    var args = {
        "M+": this.getMonth() + 1,
        "d+": this.getDate(),
        "h+": this.getHours(),
        "m+": this.getMinutes(),
        "s+": this.getSeconds(),
    };
    if (/(y+)/.test(format))
        format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    for (var i in args) {
        var n = args[i];
        if (new RegExp("(" + i + ")").test(format))
            format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? n : ("00" + n).substr(("" + n).length));
    }
    return format;
};
///


</script>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值