千峰商城-springboot项目搭建-72-用户未登录时添加购物车

 

 

1.增加状态码信息

 ResStatus:

public class ResStatus {
    public static final int OK=10000;
    public static final int NO=10001;
    
    public static final int LOGIN_SUCCESS=2000;//认证成功
    public static final int LOGIN_FAIL_NOT=20001;//用户未登录
    public static final int LOGIN_FAIL_OVERDUE=20002;//用户登录失效
    

}

 

 

2.拦截器修改登录的状态:

CheckTokenInterceptor :
@Component
public class CheckTokenInterceptor implements HandlerInterceptor {
    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        String method = request.getMethod();
        if ("OPTIONS".equalsIgnoreCase(method)){
            return true;//收到试探数据则放行(三次握手中的第一次试探)
        }
        String token = request.getHeader("token");

        //System.out.println("---------"+token);
        if (token == null) {
            ResultVO resultVO = new ResultVO(ResStatus.LOGIN_FAIL_NOT, "请先登录", null);
            //提示请先登录
            doResponse(response,resultVO);
            return false;
        } else {
            try {
                //验证token
                JwtParser parser = Jwts.parser();
                parser.setSigningKey("q666");//解析token时的SigningKey必须与设置token时设置的密码一致
                //如果token正确(密码正确,有效期内)则正常执行,否则抛出异常
                Jws<Claims> claimsJwt = parser.parseClaimsJws(token);


                return true;

            } catch (ExpiredJwtException e) {
                ResultVO resultVO = new ResultVO(ResStatus.LOGIN_FAIL_OVERDUE, "登陆过期", null);
                doResponse(response,resultVO);
            } catch (UnsupportedJwtException e) {
                ResultVO resultVO = new ResultVO(ResStatus.NO, "token不合法,自重哈", null);
                doResponse(response,resultVO);
            } catch (Exception e) {
                ResultVO resultVO = new ResultVO(ResStatus.LOGIN_FAIL_NOT, "请先登录", null);
                doResponse(response,resultVO);
            }
            return false;

        }
    }
    private void doResponse(HttpServletResponse response,ResultVO resultVO) throws IOException {
        response.setContentType("application/json");
        response.setCharacterEncoding("utf-8");
        PrintWriter out = response.getWriter();
        String s = new ObjectMapper().writeValueAsString(resultVO);
        out.println(s);
        out.flush();
        out.close();
    }

}

 

 
 
3.在详情页面判断如果用户未登录,则跳转登录页面
              //添加购物车
                        var url5 = baseUrl+"shopcart/add"
                        axios({
                            url:url5,
                            method:"post",
                            headers:{
                                token:token
                            },
                            data: cart
                        }).then((res)=>{
                            console.log(res);
                            //处理添加购物车的回调
                            if(res.data.code == 10000){
                                //添加购物车成功!
                                layer.msg("添加购物车成功!");
                            }else if(res.data.code == 10001){
                                //添加购物车失败!
                                layer.msg("添加购物车失败!");
                            }else{
                                var str = "";
                                if(res.data.code == 20001){
                                    str = "请先登录!";
                                }else if(res.data.code == 20002){
                                    str = "登录过期,请重新登录!";
                                }
                                var params = "tips="+str+"&returnUrl=introduction.html&pid="
                                                +this.productId+"&sid="+this.currentSkuIndex+"&num="+this.num;
                                                
                                var loginUrl = "login.html?"+params;
                                
                                //跳转到登录页面
                                window.location.href= encodeURI(loginUrl);
                            }
                            
                        });
                    

 

 

4.回到详情页时接收参数

data:{
                    isLogin:false,
                    token:null,
                    username:"",
                    productId:"",
                    product:{
                        productName:"",  //让vue进行初次渲染时有数据显示
                        soldNum:0
                    },
                    productImgs:[],
                    productSkus:[],
                    currentSkuIndex:0,   //当前选择的套餐的索引(默认为0)
                    skuProps:{}    ,         //相当于一个map,用于存放当前套餐的属性
                    productParams:{},
                    productCommonts:[],
                    
                    pageNum:1,
                    limit:3,
                    pageCount:0,
                    count:0,
                    
                    commontsCountMap:{},
                    chooseSkuProps:{},        //用于记录选择的套餐属性
                    num:1                    //用于记录用户购买/添加购物车的商品数量
                },
                created:function(){
                    //获取到url传递的商品id
                    this.productId = getUrlParam("pid");
                    this.currentSkuIndex = getUrlParam("sid")!=null ? getUrlParam("sid"):0;
                    this.num = getUrlParam("num")!=null ? getUrlParam("num"):1;
                    this.token = getCookieValue("token");
                    if(this.token!=null && this.token!=""){
                        this.isLogin = true;
                        this.username = getCookieValue("username");
                    }

 

 5.添加购物车成功/失败提示(layui)
 (1)引入layui:
    <!-- 引入 layui.css -->
    <link href="//unpkg.com/layui@2.7.5/dist/css/layui.css" rel="stylesheet">
     
    <!-- 引入 layui.js -->
    <script src="//unpkg.com/layui@2.7.5/dist/layui.js">

 (2)声明弹窗组件

 

 

        var layer;
            layui.use('layer', function(){
                layer = layui.layer;
            }); 

 

 6.添加到购物车成功或失败时,进行提示:

 

 

//添加购物车成功!
layer.msg("添加购物车成功!");

 

 
posted @ 2022-07-23 12:27  临易  阅读(95)  评论(0编辑  收藏  举报