专业点的网站制作公司,深圳坪山邮政编码,价格低的英文,网站建设中如何兼容所有浏览器购物车功能
一、购物车模块
1.创建cart服务 我们需要先创建一个cart的微服务#xff0c;然后添加相关的依赖#xff0c;设置配置#xff0c;放开注解。
dependenciesdependencygroupIdcom.msb.mall/groupIdartifactIdmall-commo…购物车功能
一、购物车模块
1.创建cart服务 我们需要先创建一个cart的微服务然后添加相关的依赖设置配置放开注解。
dependenciesdependencygroupIdcom.msb.mall/groupIdartifactIdmall-commons/artifactIdversion0.0.1-SNAPSHOT/version/dependencydependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-thymeleaf/artifactId/dependencydependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-web/artifactId/dependencydependencygroupIdorg.springframework.cloud/groupIdartifactIdspring-cloud-starter-openfeign/artifactId/dependencydependencygroupIdorg.springframework.cloud/groupIdartifactIdspring-cloud-starter-loadbalancer/artifactId/dependencydependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-devtools/artifactIdscoperuntime/scopeoptionaltrue/optional/dependencydependencygroupIdorg.projectlombok/groupIdartifactIdlombok/artifactIdoptionaltrue/optional/dependencydependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-test/artifactIdscopetest/scope/dependency/dependencies然后属性文件中的配置
server.port40000
spring.application.namemall-cartspring.cloud.nacos.discovery.server-addr192.168.56.100:8848
spring.thymeleaf.cachefalse然后再添加配置中心的配置bootstrap.yml文件
spring.application.namemall-cart
spring.cloud.nacos.config.server-addr192.168.56.100:8848放开注册中心的注解 2.Nginx配置 首先在windows中的host指定对应域名 拷贝对应的静态资源到Nginx的static/cart目录中 然后修改Nginx的配置文件 然后重启nginx服务
docker restart nginx3.配置网关服务 Nginx接收了 cart.msb.com这个域名的访问那么会把服务反向代理给网关服务这时网关服务就需要把该请求路由到购物车服务中。我们需要修改网关服务的配置 最后调整下模板页面中的静态资源的路径就可以了 然后启动服务访问即可 二、购物车功能
1.购物车模式处理 讨论购物车中数据的存储方式。我们在购物车中可以有多见商品 然后对应的数据我们可以选择存储在Redis中对应的数据存储结构我们要慎重的考虑因为有多条记录如果用List来存储
[{skuId:1,subTile:华为,price:666},{skuId:1,subTile:华为,price:666},{skuId:1,subTile:华为,price:666}]那么我们后面要对商品做添加删除和修改商品数量的时候就会比较麻烦我们需要取出List中的整个数据然后找到我们要操作的数据然后把所有数据回写到Redis中这种方式显然不可取这时我们可以考虑hash的方式来存储 这样我们就可以一条一条来处理了相比上面会更加的灵活。然后我们在后端服务中存储的结构为
MapString,MapString,CartItemVo2.购物车VO 针对购物车的信息存储我们创建两个对应的VO对象。
package com.msb.mall.vo;import java.math.BigDecimal;
import java.util.List;/*** 购物车中的商品信息*/
public class CartItem {// 商品的编号 SkuIdprivate Long skuId;// 商品的图片private String image;// 商品的标题private String title;// 是否选中private boolean check true;// 商品的销售属性private ListString skuAttr;// 商品的单价private BigDecimal price;// 购买的数量private Integer count;// 商品的总价private BigDecimal totalPrice;public Long getSkuId() {return skuId;}public void setSkuId(Long skuId) {this.skuId skuId;}public String getImage() {return image;}public void setImage(String image) {this.image image;}public String getTitle() {return title;}public void setTitle(String title) {this.title title;}public boolean isCheck() {return check;}public void setCheck(boolean check) {this.check check;}public ListString getSkuAttr() {return skuAttr;}public void setSkuAttr(ListString skuAttr) {this.skuAttr skuAttr;}public BigDecimal getPrice() {return price;}public void setPrice(BigDecimal price) {this.price price;}public Integer getCount() {return count;}public void setCount(Integer count) {this.count count;}public BigDecimal getTotalPrice() {// 商品的总价 price * countreturn price.multiply(new BigDecimal(count));}}
Cart
package com.msb.mall.vo;import java.math.BigDecimal;
import java.math.BigInteger;
import java.util.List;/*** 购物车*/
public class Cart {// 购物车中的商品种类private Integer countType;// 选中的商品数量private Integer checkCountNum;// 选中商品的总价private BigDecimal totalAmount;// 购物中存储的商品信息private ListCartItem items;public Integer getCountType() {return items.size();}public Integer getCheckCountNum() {Integer count 0;for (CartItem item : items) {if (item.isCheck()){count item.getCount();}}return count;}public BigDecimal getTotalAmount() {BigDecimal amount new BigDecimal(0);for (CartItem item : items) {if (item.isCheck()){amount amount.add(item.getTotalPrice());}}return amount;}public ListCartItem getItems() {return items;}public void setItems(ListCartItem items) {this.items items;}
}
3.认证信息 我们需要在购物车服务中根据当前登录用的用户信息去Redis中查询对应的购物车信息。首先我们需要导入Redis的相关依赖同时我们要借助于前面讲解的SpringSession来共享认证的Session信息。 dependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-data-redis/artifactId/dependencydependencygroupIdorg.springframework.session/groupIdartifactIdspring-session-data-redis/artifactId/dependency添加属性文件信息
server.port40000
spring.application.namemall-cartspring.cloud.nacos.discovery.server-addr192.168.56.100:8848
spring.thymeleaf.cachefalsespring.redis.host192.168.56.100
spring.redis.port6379
spring.thymeleaf.enabledfalsespring.session.store-typeredis
server.servlet.session.timeout30m
spring.session.redis.namespacespring:session添加Cookie的配置信息
Configuration
public class MySessionConfig {/*** 自定义Cookie的配置* return*/Beanpublic CookieSerializer cookieSerializer(){DefaultCookieSerializer cookieSerializer new DefaultCookieSerializer();cookieSerializer.setDomainName(msb.com); // 设置session对应的一级域名cookieSerializer.setCookieName(msbsession);return cookieSerializer;}/*** 对存储在Redis中的数据指定序列化的方式* return*/Beanpublic RedisSerializerObject redisSerializer(){return new GenericJackson2JsonRedisSerializer();}
}添加自定义的拦截器
/*** 我们自定义的拦截器帮助我们获取当前登录的用户信息* 通过Session共享获取的*/
public class AuthInterceptor implements HandlerInterceptor {// 本地线程对象 Mapthread,Objectpublic static ThreadLocalMemberVO threadLocal new ThreadLocal();Overridepublic boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {// 通过HttpSession获取当前登录的用户信息HttpSession session request.getSession();Object attribute session.getAttribute(AuthConstant.AUTH_SESSION_REDIS);if(attribute ! null){MemberVO memberVO (MemberVO) attribute;threadLocal.set(memberVO);}return true;}
}注册拦截器
Configuration
public class MyWebInterceptorConfig implements WebMvcConfigurer {Overridepublic void addInterceptors(InterceptorRegistry registry) {registry.addInterceptor(new AuthInterceptor()).addPathPatterns(/**);}
}然后登录后访问controller服务测试 4.页面跳转 从商品详情页面点击添加购物车完成添加购物车的逻辑。 5.添加购物车逻辑 具体完成添加购物车的逻辑也service中我们获取到商品的SKUId和商品数量后我们要实现的逻辑 具体核心代码
/*** 把商品添加到购物车中* param skuId* param num* return*/Overridepublic CartItem addCart(Long skuId, Integer num) throws Exception {BoundHashOperationsString, Object, Object hashOperations getCartKeyOperation();// 如果Redis存储在商品的信息那么我们只需要修改商品的数量就可以了Object o hashOperations.get(skuId.toString());if(o ! null){// 说明已经存在了这个商品那么修改商品的数量即可String json (String) o;CartItem item JSON.parseObject(json, CartItem.class);item.setCount(item.getCount()num);hashOperations.put(skuId.toString(),JSON.toJSONString(item));return item;}CartItem item new CartItem();CompletableFuture future1 CompletableFuture.runAsync(()-{// 1.远程调用获取 商品信息R r productFeignService.info(skuId);String skuInfoJSON (String) r.get(skuInfoJSON);SkuInfoVo vo JSON.parseObject(skuInfoJSON,SkuInfoVo.class);item.setCheck(true);item.setCount(num);item.setPrice(vo.getPrice());item.setImage(vo.getSkuDefaultImg());item.setSkuId(skuId);item.setTitle(vo.getSkuTitle());},executor);CompletableFuture future2 CompletableFuture.runAsync(()-{// 2.获取商品的销售属性ListString skuSaleAttrs productFeignService.getSkuSaleAttrs(skuId);item.setSkuAttr(skuSaleAttrs);},executor);CompletableFuture.allOf(future1,future2).get();// 3.把数据存储在Redis中String json JSON.toJSONString(item);hashOperations.put(skuId.toString(),json);return item;}private BoundHashOperationsString, Object, Object getCartKeyOperation() {// hash key: cart:1 skuId:cartItemMemberVO memberVO AuthInterceptor.threadLocal.get();String cartKey CartConstant.CART_PERFIX memberVO.getId();BoundHashOperationsString, Object, Object hashOperations redisTemplate.boundHashOps(cartKey);return hashOperations;}6.购物车主页 添加商品进入购物车后我们可以点击结算进入购物车页面那么我们需要在后台查询出所有的当前登录用户的购物车商品信息然后在页面中展示 然后在页面中处理数据