WEB电商项目广告管理与缓存解决方案

概述

本篇将介绍如下几个方面：

完成运营商后台广告类型管理与广告管理、完成前台工程广告轮播图的展示、使用SpringDataRedis操作字符串、set、List、hash等类型缓存、使用SpringDataRedis实现广告数据的缓存。

广告管理

1.后台管理

1.1搭建广告工程

基于高内聚低耦合的原则，我们需要单独搭建广告服务工程。

具体操作和创建pinyougou-sellergoods服务工程差不多，这里给出几点注意事项：

1、我们目前有两个服务工程，当两个工程同时启动时会发生端口冲突，因为连接dubbox注册中心的端口默认是20880。所以我们需要配置一下pinyougou-content-service工程的dubbox端口

2、由于需要用到上传服务，还需要添加common工具包的依赖

1.2广告图片上传

将pinyougou-shop-web有关服务上传的资源拷贝到pinyougou-manager-web

在pinyougou-manager-web 的springmvc.xml中添加配置

<!-- 配置多媒体解析器 -->
<bean id="multipartResolver"
      class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    <property name="defaultEncoding" value="UTF-8"></property>
    <!-- 设定文件上传的最大值 5MB，5*1024*1024 -->
    <property name="maxUploadSize" value="5242880"></property>
</bean>

在contentController.js编写代码(注意引入uploadService)

//上传广告图
$scope.uploadFile=function(){
   
    uploadService.uploadFile().success(
        function(response){
   
            if(response.success){
   
                $scope.entity.pic=response.message;					
            }else{
   
                alert("上传失败！");
            }
        }
    ).error(
        function(){
   
            alert("上传出错！");
        }
    );		
}

修改content.html实现上传功能

<tr>            
    <td>图片</td>
    <td>
        <input type="file" id="file">
        <button ng-click="uploadFile()">上传</button>	                             
        <img alt="" src="{
    {entity.pic}}" height="100px" width="200px">
    </td>
</tr>

1.3广告类目选择

在contentController.js中添加代码

//加载广告分类列表
$scope.findContentCategoryList=function(){
   
    contentCategoryService.findAll().success(
        function(response){
   
            $scope.contentCategoryList=response;				
        }
    );
}

在content.html 初始化调用此方法，将广告分类改为下拉列表

<select  class="form-control" ng-model="entity.categoryId" ng-options="item.id as item.name  for item in contentCategoryList"></select>  

1.4广告状态

修改content.html

<input  type="checkbox" ng-model="entity.status" ng-true-value="1" ng-false-value="0">

修改contentController.js

$scope.status=["无效","有效"];

2.前台展示

修改首页，当其轮播广告图根据后台设置的广告列表动态产生。

2.1搭建门面工程

创建war模块pinyougou-portal-web ，此工程为网站前台的入口，参照其它war模块编写配置文件。不需要添加SpringSecurity框架

pom.xml中配置tomcat启动端口为9103

2.2后端实现

在pinyougou-content-interface工程ContentService接口增加方法定义

/**
	 * 根据广告类型ID查询列表
	 * @param key
	 * @return
	 */
public List<TbContent> findByCategoryId(Long categoryId);

在pinyougou-content-service工程ContentServiceImpl类增加方法

@Override
public List<TbContent> findByCategoryId(Long categoryId) {
   
    TbContentExample example = new TbContentExample();
    Criteria criteria = example.createCriteria();
    criteria.andCategoryIdEqualTo(categoryId);
    criteria.andStatusEqualTo(