前台系统开发

本是古典何须时尚 2022-06-15 10:16 231阅读 0赞

## 商城前台页面系统 ##

### 1、技术选型 ###

后台技术： Spring+SpringMVC  
前台技术：html+CSS+JS  
商品数据的获取途径：从后台系统的接口获取数据。

### 2、建立Maven工程 ###

*  pom.xml文件内容如下：

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
        <modelVersion>4.0.0</modelVersion>
        <parent>
            <groupId>com.enjoyshop.parent</groupId>
            <artifactId>enjoyshop-parent</artifactId>
            <version>0.0.1-SNAPSHOT</version>
        </parent>
        <groupId>com.enjoyshop.web</groupId>
        <artifactId>enjoyshop-web</artifactId>
        <version>1.0.0-SNAPSHOT</version>
        <packaging>war</packaging>
    
        <dependencies>
            <dependency>
                <groupId>com.enjoyshop.common</groupId>
                <artifactId>enjoyshop-common</artifactId>
                <version>1.0.0-SNAPSHOT</version>
            </dependency>
            <dependency>
                <groupId>com.enjoyshop.manage</groupId>
                <artifactId>enjoyshop-manage-pojo</artifactId>
                <version>1.0.0-SNAPSHOT</version>
            </dependency>
            
            <dependency>
                <groupId>junit</groupId>
                <artifactId>junit</artifactId>
                <scope>test</scope>
            </dependency>
    
            <dependency>
                <groupId>org.springframework</groupId>
                <artifactId>spring-webmvc</artifactId>
            </dependency>
    
            <dependency>
                <groupId>org.slf4j</groupId>
                <artifactId>slf4j-log4j12</artifactId>
            </dependency>
    
            
            <dependency>
                <groupId>com.fasterxml.jackson.core</groupId>
                <artifactId>jackson-databind</artifactId>
            </dependency>
    
            
            <dependency>
                <groupId>jstl</groupId>
                <artifactId>jstl</artifactId>
            </dependency>
            <dependency>
                <groupId>javax.servlet</groupId>
                <artifactId>servlet-api</artifactId>
                <scope>provided</scope>
            </dependency>
            <dependency>
                <groupId>javax.servlet</groupId>
                <artifactId>jsp-api</artifactId>
                <scope>provided</scope>
            </dependency>
            <dependency>
                <groupId>taglibs</groupId>
                <artifactId>standard</artifactId>
                <version>1.1.2</version>
            </dependency>
    
            
            <dependency>
                <groupId>org.apache.commons</groupId>
                <artifactId>commons-lang3</artifactId>
            </dependency>
            <dependency>
                <groupId>org.apache.commons</groupId>
                <artifactId>commons-io</artifactId>
            </dependency>
            
            <dependency>
                <groupId>org.apache.httpcomponents</groupId>
                <artifactId>httpclient</artifactId>
            </dependency>
            <dependency>
                <groupId>redis.clients</groupId>
                <artifactId>jedis</artifactId>
                <version>2.6.0</version>
            </dependency>
            
            <dependency>
                <groupId>joda-time</groupId>
                <artifactId>joda-time</artifactId>
            </dependency>
    
            <dependency>
                <groupId>org.springframework.amqp</groupId>
                <artifactId>spring-rabbit</artifactId>
                <version>1.4.0.RELEASE</version>
            </dependency>
        </dependencies>
        <build>
            <plugins>
                <plugin>
                    <groupId>org.apache.tomcat.maven</groupId>
                    <artifactId>tomcat7-maven-plugin</artifactId>
                    <configuration>
                        <port>8082</port>
                        <path>/</path>
                    </configuration>
                </plugin>
            </plugins>
        </build>
    
    </project>

*  web.xml内容如下

<?xml version="1.0" encoding="UTF-8"?>
    <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xmlns="http://java.sun.com/xml/ns/javaee"
        xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
        id="WebApp_ID" version="2.5">
        <display-name>enjoyshop-web</display-name>
    
        <context-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:spring/applicationContext*.xml</param-value>
        </context-param>
    
        
        <listener>
            <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
        </listener>
    
        
        <filter>
            <filter-name>encodingFilter</filter-name>
            <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
            <init-param>
                <param-name>encoding</param-name>
                <param-value>UTF8</param-value>
            </init-param>
        </filter>
        <filter-mapping>
            <filter-name>encodingFilter</filter-name>
            <url-pattern>/*</url-pattern>
        </filter-mapping>
    
        
        <servlet>
            <servlet-name>enjoyshop-web</servlet-name>
            <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
            <init-param>
                <param-name>contextConfigLocation</param-name>
                <param-value>classpath:spring/enjoyshop-web-servlet.xml</param-value>
            </init-param>
            <load-on-startup>1</load-on-startup>
        </servlet>
    
        <servlet-mapping>
            <servlet-name>enjoyshop-web</servlet-name>
            
            <url-pattern>*.html</url-pattern>
        </servlet-mapping>
    
        <servlet-mapping>
            <servlet-name>enjoyshop-web</servlet-name>
            <url-pattern>/service/*</url-pattern>
        </servlet-mapping>
    
        <welcome-file-list>
            <welcome-file>index.html</welcome-file>
        </welcome-file-list>
    
    </web-app>

*  Spring和SpringMVC配置文件

这部分配置和后台系统配置类似，不做具体描述。

### 3、编写通用控制类 ###

package com.enjoyshop.web.controller;
    
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RequestMethod;
    import org.springframework.web.servlet.ModelAndView;
    
    import com.enjoyshop.web.service.IndexService;
    
    @Controller
    public class IndexController {
    
        @Autowired
        private IndexService indexService;
    
        @RequestMapping(value = "index", method = { RequestMethod.GET, RequestMethod.POST })
        public ModelAndView index() {
            ModelAndView mv = new ModelAndView("index");
            // 获取大广告位数据
            String indexAD1 = this.indexService.queryIndexAD1();
            //将数据放入request请求中
            mv.addObject("indexAD1", indexAD1);
            // 右上角广告位数据
            String indexAD2 = this.indexService.queryIndexAD2();
            mv.addObject("indexAD2", indexAD2);
            return mv;
        }
    }

*  封装HttpClient的接口服务

@Service
    public class ApiService implements BeanFactoryAware {
        
    
        private BeanFactory beanFactory;
    
        @Autowired(required=false)
        private RequestConfig requestConfig;
    
        /**
         * 执行GET请求，响应200返回内容，404返回null
         * 
         * @param url
         * @return
         * @throws ClientProtocolException
         * @throws IOException
         */
        public String doGet(String url) throws ClientProtocolException, IOException {
            // 创建http GET请求
            HttpGet httpGet = new HttpGet(url);
            httpGet.setConfig(requestConfig);
            CloseableHttpResponse response = null;
            try {
                // 执行请求
                response = getHttpClient().execute(httpGet);
                // 判断返回状态是否为200
                if (response.getStatusLine().getStatusCode() == 200) {
                    return EntityUtils.toString(response.getEntity(), "UTF-8");
                }
            } finally {
                if (response != null) {
                    response.close();
                }
            }
            return null;
        }
    
        /**
         * 带有参数的GET请求，响应200返回内容，404返回null
         * 
         * @param url
         * @param params
         * @return
         * @throws ClientProtocolException
         * @throws IOException
         * @throws URISyntaxException
         */
        public String doGet(String url, Map<String, String> params)
                throws ClientProtocolException, IOException, URISyntaxException {
            URIBuilder builder = new URIBuilder(url);
            for (Map.Entry<String, String> entry : params.entrySet()) {
                builder.setParameter(entry.getKey(), entry.getValue());
            }
            return doGet(builder.build().toString());
        }
    
        /**
         * 执行post请求
         * 
         * @param url
         * @param params
         * @return
         * @throws IOException
         */
        public HttpResult doPost(String url, Map<String, String> params) throws IOException {
            // 创建http POST请求
            HttpPost httpPost = new HttpPost(url);
            httpPost.setConfig(requestConfig);
            if (null != params) {
                List<NameValuePair> parameters = new ArrayList<NameValuePair>(0);
                for (Map.Entry<String, String> entry : params.entrySet()) {
                    parameters.add(new BasicNameValuePair(entry.getKey(), entry.getValue()));
                }
                // 构造一个form表单式的实体
                UrlEncodedFormEntity formEntity = new UrlEncodedFormEntity(parameters, "UTF-8");
                // 将请求实体设置到httpPost对象中
                httpPost.setEntity(formEntity);
            }
    
            CloseableHttpResponse response = null;
            try {
                // 执行请求
                response = getHttpClient().execute(httpPost);
                return new HttpResult(response.getStatusLine().getStatusCode(),
                        EntityUtils.toString(response.getEntity(), "UTF-8"));
            } finally {
                if (response != null) {
                    response.close();
                }
            }
        }
    
        public HttpResult doPostJson(String url, String json) throws IOException {
            // 创建http POST请求
            HttpPost httpPost = new HttpPost(url);
            httpPost.setConfig(requestConfig);
            if (null != json) {
                // 构造一个字符串式的实体
                StringEntity stringEntity = new StringEntity(json, ContentType.APPLICATION_JSON);
                // 将请求实体设置到httpPost对象中
                httpPost.setEntity(stringEntity);
            }
    
            CloseableHttpResponse response = null;
            try {
                // 执行请求
                response = getHttpClient().execute(httpPost);
                return new HttpResult(response.getStatusLine().getStatusCode(),
                        EntityUtils.toString(response.getEntity(), "UTF-8"));
            } finally {
                if (response != null) {
                    response.close();
                }
            }
        }
    
        //每次都从工厂中获取一个bean，实现httpclient的多例
        private CloseableHttpClient getHttpClient() {
            return this.beanFactory.getBean(CloseableHttpClient.class);
        }
    
        //用于spring初始化时设置BeanFactory，否则spring无法初始化这个service
        @Override
        public void setBeanFactory(BeanFactory beanFactory) throws BeansException {
            this.beanFactory = beanFactory;
        }
    }

*  获取首页大广告位的数据

通过访问后台系统接口获取数据

@Autowired
        private ApiService apiService;
        private static final ObjectMapper MAPPER = new ObjectMapper();
        @Value("${ENJOYSHOP_MANAGE_URL}")
        private String ENJOYSHOP_MANAGE_URL;
    
        @Value("${INDEX_AD1_URL}")
        private String INDEX_AD1_URL;
    
        @Value("${INDEX_AD2_URL}")
        private String INDEX_AD2_URL;
    
        public String queryIndexAD1() {
            try {
                String url = ENJOYSHOP_MANAGE_URL + INDEX_AD1_URL;
                String jsonData = this.apiService.doGet(url);
                if (StringUtils.isEmpty(jsonData)) {
                    return null;
                }
                // 解析json，生成相应的json数据
                JsonNode jsonNode = MAPPER.readTree(jsonData);
                ArrayNode rows = (ArrayNode) jsonNode.get("rows");
                List<Map<String, Object>> result = new ArrayList<Map<String, Object>>();
                for (JsonNode row : rows) {
                    Map<String, Object> map = new LinkedHashMap<String, Object>();
                    map.put("srcB", row.get("pic").asText());
                    map.put("height", 240);
                    map.put("alt", row.get("title").asText());
                    map.put("width", 670);
                    map.put("src", row.get("pic").asText());
                    map.put("widthB", 550);
                    map.put("href", row.get("url").asText());
                    map.put("heightB", 240);
                    result.add(map);
                }
                return MAPPER.writeValueAsString(result);
            } catch (Exception e) {
                e.printStackTrace();
    
            }
            return null;
        }

*  获取右侧小广告位的数据

public String queryIndexAD2() {
            try {
                String url = ENJOYSHOP_MANAGE_URL + INDEX_AD2_URL;
                String jsonData = this.apiService.doGet(url);
                if (StringUtils.isEmpty(jsonData)) {
                    return null;
                }
                // 解析json，生成前端所需要的json数据
                JsonNode jsonNode = MAPPER.readTree(jsonData);
                ArrayNode rows = (ArrayNode) jsonNode.get("rows");
    
                List<Map<String, Object>> result = new ArrayList<Map<String, Object>>();
    
                for (JsonNode row : rows) {
                    Map<String, Object> map = new LinkedHashMap<String, Object>();
                    map.put("width", 310);
                    map.put("height", 70);
                    map.put("src", row.get("pic").asText());
                    map.put("href", row.get("url").asText());
                    map.put("alt", row.get("title").asText());
                    map.put("widthB", 210);
                    map.put("heightB", 70);
                    map.put("srcB", row.get("pic").asText());
                    result.add(map);
                }
                return MAPPER.writeValueAsString(result);
            } catch (Exception e) {
                e.printStackTrace();
            }
            return null;
        }

### 4、首页左侧商品类目的显示 ###

*  跨域请求问题

因为商品类目的数据接口在后台系统中，所以前台系统可以直接通过接口服务获取数据。但是后台系统的URL为manage.enjoyshop.com，而前台系统的URL为www.enjoyshop.com。这里涉及到了跨域请求的问题。浏览器对ajax请求的限制，不允许跨域请求资源。  
[http://www.a.com][http_www.a.com]请求[http://www.b.com][http_www.b.com]下的资源是跨域。  
[http://www.a.com][http_www.a.com]请求[http://www.a.com:8080][http_www.a.com_8080]下的资源是跨域。  
[http://a.a.com][http_a.a.com]请求[http://b.a.com][http_b.a.com]下的资源是跨域。  
[http://www.a.com][http_www.a.com]  [http://www.a.com/api][http_www.a.com_api]下的资源不是跨域。  
不同的域名或不同的端口都是跨域请求。

*  跨域请求解决方案

可以使用jsonp技术来解决这个问题。具体关于jsonp的介绍请参考这里。[点我][Link 1]

*  前端页面请求后台接口

var category = {OBJ: $("#_JD_ALLSORT"),
            URL_Serv: "http://manage.enjoyshop.com/rest/api/item/cat?callback=category.getDataService",
        ·······
        }

*  乱码问题解决  
    虽然jsonp解决了跨域请求的问题，成功的请求到了数据。但是展示出来时却是乱码。这是SpringMVC消息转化器引起的。如果使用默认的消息转化器，其对于字符串的编码采用的是ISO-8859-1。如下所示：

public class StringHttpMessageConverter extends AbstractHttpMessageConverter<String> {
        
    
        public static final Charset DEFAULT_CHARSET = Charset.forName("ISO-8859-1");
    
        private final Charset defaultCharset;
        ······
    }

这里来自定义一个消息转化器来处理json

package com.enjoyshop.common.spring.exetend.converter.json;
    
    import java.io.IOException;
    
    import javax.servlet.http.HttpServletRequest;
    
    import org.apache.commons.io.IOUtils;
    import org.apache.commons.lang3.StringUtils;
    import org.springframework.http.HttpOutputMessage;
    import org.springframework.http.converter.HttpMessageNotWritableException;
    import org.springframework.http.converter.json.MappingJackson2HttpMessageConverter;
    import org.springframework.web.context.request.RequestContextHolder;
    import org.springframework.web.context.request.ServletRequestAttributes;
    
    import com.fasterxml.jackson.core.JsonEncoding;
    import com.fasterxml.jackson.core.JsonProcessingException;
    
    //继承自MappingJackson2HttpMessageConverter，自定义消息转化器
    public class CallbackMappingJackson2HttpMessageConverter extends MappingJackson2HttpMessageConverter {
    
        // 做jsonp的支持的标识，在请求参数中加该参数
        private String callbackName;
    
        @Override
        protected void writeInternal(Object object, HttpOutputMessage outputMessage) throws IOException, HttpMessageNotWritableException {
            // 从threadLocal中获取当前的Request对象
            HttpServletRequest request = ((ServletRequestAttributes) RequestContextHolder.currentRequestAttributes()).getRequest();
            String callbackParam = request.getParameter(callbackName);
            if(StringUtils.isEmpty(callbackParam)){
                // 没有找到callback参数，直接返回json数据
                super.writeInternal(object, outputMessage);
            }else{
                JsonEncoding encoding = getJsonEncoding(outputMessage.getHeaders().getContentType());
                try {
                    String result =callbackParam+"("+super.getObjectMapper().writeValueAsString(object)+");";
                    IOUtils.write(result, outputMessage.getBody(),encoding.getJavaName());
                }
                catch (JsonProcessingException ex) {
                    throw new HttpMessageNotWritableException("Could not write JSON: " + ex.getMessage(), ex);
                }
            }
    
        }
    
        public String getCallbackName() {
            return callbackName;
        }
    
        public void setCallbackName(String callbackName) {
            this.callbackName = callbackName;
        }
    
    }

需要在SpringMVC的配置文件中来加载该消息转化器。

<mvc:annotation-driven>
          <mvc:message-converters register-defaults="true">
             
            
            <bean class="com.enjoyshop.common.spring.exetend.converter.json.CallbackMappingJackson2HttpMessageConverter">
               <property name="callbackName" value="callback"></property>
            </bean>
          </mvc:message-converters>
        </mvc:annotation-driven>

### 5、商品详情信息的显示 ###

商品详情页面的URL形式为[http://www.enjoyshop.com/item/][http_www.enjoyshop.com_item]\{itemId\}.html。

*  相应的controller层代码如下：

@RequestMapping("item")
    @Controller
    public class ItemController {
        
    
        @Autowired
        private ItemService itemService;
    
        @RequestMapping(value="{itemId}",method=RequestMethod.GET)
        public ModelAndView showDetail(@PathVariable("itemId") Long itemId){
            ModelAndView mv=new ModelAndView("item");
            //添加商品基本数据
            Item item=this.itemService.queryItemById(itemId);
            mv.addObject("item",item);
            //添加商品描述数据
            ItemDesc itemDesc=this.itemService.queryItemDescByItemId(itemId);
            mv.addObject("itemDesc", itemDesc);
            //添加商品规格参数
            String itemParam=this.itemService.queryItemParamByItemId(itemId);
            mv.addObject("itemParam", itemParam);
            return mv;
        }
    }

*  对应的service层关键代码如下：这里通过apiService向后台系统请求数据，并且为商品信息加入了缓存功能

@Service
    public class ItemService {
    
        @Autowired
        private ApiService apiService;
        @Value("${ENJOYSHOP_MANAGE_URL}")
        private String ENJOYSHOP_MANAGE_URL;
    
        private static final ObjectMapper MAPPER = new ObjectMapper();
        public static final String REDIS_KEY="ENJOYSHOP_WEB_ITEM_DETAIL_";
        private static final Integer REDIS_TIME=60*60*24;
    
        @Autowired
        private RedisService redisService;
    
        //获取商品基本信息
        public Item queryItemById(Long itemId) {
            String key=REDIS_KEY+itemId;
            try {
                //先从缓存中命中
                String cacheData=this.redisService.get(key);
                if(StringUtils.isNotEmpty(cacheData)){
                    return MAPPER.readValue(cacheData, Item.class);
                }
            } catch (Exception e1) {
                e1.printStackTrace();
            }
            try {
                String url = ENJOYSHOP_MANAGE_URL + "/rest/item/" + itemId;
                String jsonData = this.apiService.doGet(url);
                if (StringUtils.isEmpty(jsonData)) {
                    return null;
                }
                try {
       //需要加try catch防止影响原逻辑
                    //写入缓存
                    this.redisService.set(key, jsonData, REDIS_TIME);
                } catch (Exception e) {
                    // TODO Auto-generated catch block
                    e.printStackTrace();
                }
                return MAPPER.readValue(jsonData, Item.class);
            } catch (Exception e) {
                e.printStackTrace();
            }
            return null;
        }
    
        //获取商品描述信息
        public ItemDesc queryItemDescByItemId(Long itemId) {
            try {
                String url = ENJOYSHOP_MANAGE_URL + "/rest/item/desc/" + itemId;
                String jsonData = this.apiService.doGet(url);
                if (StringUtils.isEmpty(jsonData)) {
                    return null;
                }
                return MAPPER.readValue(jsonData, ItemDesc.class);
            } catch (Exception e) {
                e.printStackTrace();
            }
            return null;
        }
    
        //获取商品规格参数信息
        public String queryItemParamByItemId(Long itemId) {
            try {
                String url = ENJOYSHOP_MANAGE_URL + "/rest/item/param/item/" + itemId;
                String jsonData = this.apiService.doGet(url);
                // 解析JSON
                JsonNode jsonNode = MAPPER.readTree(jsonData);
                ArrayNode paramData = (ArrayNode) MAPPER.readTree(jsonNode.get("paramData").asText());
                StringBuilder sb = new StringBuilder();
                sb.append(
                        "<table cellpadding=\"0\" cellspacing=\"1\" width=\"100%\" border=\"0\" class=\"Ptable\"><tbody>");
                for (JsonNode param : paramData) {
                    sb.append("<tr><th class=\"tdTitle\" colspan=\"2\">" + param.get("group").asText() + "</th></tr>");
                    ArrayNode params = (ArrayNode) param.get("params");
                    for (JsonNode p : params) {
                        sb.append("<tr><td class=\"tdTitle\">" + p.get("k").asText() + "</td><td>" + p.get("v").asText()
                                + "</td></tr>");
                    }
                }
                sb.append("</tbody></table>");
                return sb.toString();
            } catch (Exception e) {
                e.printStackTrace();
            }
            return null;
        }
    
    }

*  后台系统提供的接口如下：  
    查询商品基本信息

@RequestMapping(value = "{itemId}", method = RequestMethod.GET)
        public ResponseEntity<Item> queryById(@PathVariable("itemId") Long itemId) {
            try {
                Item item = this.itemService.queryById(itemId);
                if (null == item) {
                    return ResponseEntity.status(HttpStatus.NOT_FOUND).body(null);
                }
                return ResponseEntity.ok(item);
            } catch (Exception e) {
                e.printStackTrace();
            }
            // 出错 500
            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null);
        }

查询商品描述信息

@RequestMapping(value = "{itemId}", method = RequestMethod.GET)
        public ResponseEntity<ItemDesc> queryByItemId(@PathVariable("itemId") Long itemId) {
            try {
                ItemDesc itemDesc = this.itemDescService.queryById(itemId);
    
                if (null == itemDesc) {
                    // 资源不存在，404
                    return ResponseEntity.status(HttpStatus.NOT_FOUND).body(null);
                }
                // 200
                return ResponseEntity.ok(itemDesc);
            } catch (Exception e) {
                e.printStackTrace();
            }
            // 错误，500
            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null);
        }

查询商品规格参数信息

@RequestMapping(method = RequestMethod.GET)
        public ResponseEntity<EasyUIResult> queryItemParamList(@RequestParam(value = "page", defaultValue = "1") Integer page,
                @RequestParam(value = "rows", defaultValue = "30") Integer rows) {
            try {
                PageInfo<ItemParam> pageInfo = this.itemParamService.queryPageList(page, rows);
                EasyUIResult easyUIResult = new EasyUIResult(pageInfo.getTotal(), pageInfo.getList());
                return ResponseEntity.ok(easyUIResult);
            } catch (Exception e) {
                e.printStackTrace();
            }
            // 出错 500
            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(null);
        }

### 6、解决系统间的数据同步问题 ###

*  面临的问题：

后台系统中如果将商品修改，前台系统没有进行数据的同步，仍然从Redis的缓存中获取数据，导致前端系统不能够实时显示最新的数据。

*  解决方案一：手动实现系统间的更新通知

基本思路：如果在后台系统中商品修改后向其他系统发送通知，其他系统做出对应的处理（清理Redis中的缓存），就可以实现同步。  
首先在前台系统中开发一个接口，用于后台系统调用该接口来删除缓存。

@RequestMapping("item/cache")
    @Controller
    public class ItemCacheController {
        
    
        @Autowired
        private RedisService redisService;
    
        //删除缓存数据
        @RequestMapping(value="{itemId}",method=RequestMethod.POST)
        public ResponseEntity<Void> deleteCache(@PathVariable("itemId") Long itemId){
            try {
                String key=ItemService.REDIS_KEY+itemId;
                this.redisService.del(key);
                return ResponseEntity.status(HttpStatus.NO_CONTENT).build();
            } catch (Exception e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).build();
        }
    
    }

在后台系统更新商品数据的逻辑中，加入调用前台接口的方法。

public void updateItem(Item item, String desc, String itemParams) {
            // 强制设置不能修改的字段为null
            item.setStatus(null);
            item.setCreated(null);
            super.updateSelective(item);
    
            // 修改商品描述数据
            ItemDesc itemDesc = new ItemDesc();
            itemDesc.setItemId(item.getId());
            itemDesc.setItemDesc(desc);
            this.itemDescService.updateSelective(itemDesc);
    
            // 修改商品规格参数
            this.itemParamItemService.updateItemParamItem(item.getId(), itemParams);
    
            try {
            // 需要通知其他系统进行数据更新
            String url = ENJOYSHOP_WEB_URL + "/item/cache/" + item.getId() +".html";
            this.apiService.doPost(url, null);
            } catch (Exception e) {
            e.printStackTrace();
          }
        }

*  解决方案二：使用消息队列RabbitMQ

RabbitMQ是一个开源的AMQP实现，服务器端用Erlang语言编写，支持多种客户端，如：Python、Ruby、.NET、Java、JMS、C、PHP、ActionScript、XMPP、STOMP等，支持AJAX。用于在分布式系统中存储转发消息，在易用性、扩展性、高可用性等方面表现不俗。  
关于RabbitMQ的更多介绍请参考这里。[点我][Link 2]

### 7、使用RabbitMQ解决据同步问题 ###

*  选用队列模式

这里采用通配符模式，这种模式更具有扩展性。

*  队列和交换机的绑定方法

有两种方法:  
1、 在配置文件中将队列和交换机完成绑定。  
2、 在RabbitMQ的管理界面中手动完成绑定。  
这里采用手动绑定的方式，优点如下：  
1、 若使用配置文件绑定的方式，如果绑定关系发生变化，需要修改配置文件，并且服务需要重启。  
2、 采用手动绑定，管理更加灵活，更容易对绑定关系进行权限管理，流程管理。

*  发送的消息内容

1、 将Item对象做json序列化发送  
a) 数据大  
b) 有些数据其他人是可能用不到的  
2、 发送商品的id、操作类型。  
这里采用第二种方式。

*  在后台系统中添加Spring和RabbitMQ的整合文件

*  后台系统中在新增和修改商品时发送消息

@Autowired
        private RabbitTemplate rabbitTemplate;
    
        private static final ObjectMapper MAPPER = new ObjectMapper();
    
        public void saveItem(Item item, String desc, String itemParams) {
            // 默认为上架状态
            item.setStatus(1);
            // 防止前端恶意添加id值
            item.setId(null);
            //保存商品信息
            super.save(item);
            //构建ItemDesc数据并保存
            ItemDesc itemDesc = new ItemDesc();
            itemDesc.setItemId(item.getId());
            itemDesc.setItemDesc(desc);
            this.itemDescService.save(itemDesc);
                    //构建ItemParamItem数据并保存
            ItemParamItem itemParamItem = new ItemParamItem();
            itemParamItem.setItemId(item.getId());
            itemParamItem.setParamData(itemParams);
            this.itemParamItemService.save(itemParamItem);
            //发送mq消息
            sendMsg(item.getId(), "insert");
        }
        public void updateItem(Item item, String desc, String itemParams) {
            // 强制设置不能修改的字段为null
            item.setStatus(null);
            item.setCreated(null);
            super.updateSelective(item);
    
            // 修改商品描述数据
            ItemDesc itemDesc = new ItemDesc();
            itemDesc.setItemId(item.getId());
            itemDesc.setItemDesc(desc);
            this.itemDescService.updateSelective(itemDesc);
    
            // 修改商品规格参数
            this.itemParamItemService.updateItemParamItem(item.getId(), itemParams);
    
            // try {
        
            // // 需要通知其他系统进行数据更新
            // String url = ENJOYSHOP_WEB_URL + "/item/cache/" + item.getId() +
            // ".html";
            // this.apiService.doPost(url, null);
            // } catch (Exception e) {
        
            // e.printStackTrace();
            // }
    
            //发送mq消息
            sendMsg(item.getId(), "update");
        }
    
        private void sendMsg(long itemId,String type){
            try {
                //发送mq详细通知其他系统进行数据更新
                Map<String, Object> msg = new HashMap<String, Object>();
                msg.put("itemId", itemId);
                msg.put("type", type);
                msg.put("date", System.currentTimeMillis());
                this.rabbitTemplate.convertAndSend("item."+type, MAPPER.writeValueAsString(msg));
            } catch (Exception e) {
                e.printStackTrace();
            }
        }

*  前台系统接收消息

Spring和RabbitMQ整合文件

接收消息，清理缓存

package com.enjoyshop.web.mq.handler;
    
    import org.springframework.beans.factory.annotation.Autowired;
    
    import com.enjoyshop.common.service.RedisService;
    import com.enjoyshop.web.service.ItemService;
    import com.fasterxml.jackson.databind.JsonNode;
    import com.fasterxml.jackson.databind.ObjectMapper;
    
    public class ItemMQHandler {
    
        private static final ObjectMapper MAPPER = new ObjectMapper();
    
        @Autowired
        private RedisService redisService;
        //拿到商品id，删除redis缓存
        public void execute(String msg) {
            try {
                JsonNode jsonNode = MAPPER.readTree(msg);
                Long itemId = jsonNode.get("itemId").asLong();
                String key = ItemService.REDIS_KEY + itemId;
                this.redisService.del(key);
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
    
    }

[http_www.a.com]: http://www.a.com
[http_www.b.com]: http://www.b.com
[http_www.a.com_8080]: http://www.a.com:8080
[http_a.a.com]: http://a.a.com
[http_b.a.com]: http://b.a.com
[http_www.a.com_api]: http://www.a.com/api
[Link 1]: http://blog.csdn.net/xiaokang123456kao/article/details/72758724
[http_www.enjoyshop.com_item]: http://www.enjoyshop.com/item/
[Link 2]: http://blog.csdn.net/xiaokang123456kao/article/details/72782138