搭建基於SSM的分佈式電子商城的框架開源方便你們二次開發（已解決跨域問題）

GitHub地址：https://github.com/leebingbin/Framework.Blade

 

搭建基於SSM的分佈式電子商城的框架開源方便你們二次開發

 

1.   聊聊電商行業

1.1.   電商行業發展

 

    近年來，中國的電子商務快速發展，交易額連創新高，電子商務在各領域的應用不斷拓展和深化、相關服務業蓬勃發展、支撐體系不斷健全完善、創新的動力和能力 不斷加強。電子商務正在與實體經濟深度融合，進入規模性發展階段，對經濟社會生活的影響不斷增大，正成爲我國經濟發展的新引擎。

    中國電子商務研究中心數據顯示，截止到2012年末，中國電子商務市場交易規模達7.85萬億人民幣，同比增加30.83%。其中，B2B電子商務交易額 達6.25萬億，同比增加27%。而2011年整年，中國電子商務市場交易額達6萬億人民幣，同比增加33%，佔GDP比重上升到13%；2012年，電 子商務佔GDP的比重已經高達15%。預計將來我國電子商務規模突破十萬億大關也不是個問題。

   

1.1.   11.11

 

1.2.   電商行業技術特色

Ø  技術新

Ø  技術範圍廣

Ø  分佈式

Ø  高併發、集羣、負載均衡、高可用

Ø  海量數據

Ø  業務複雜

Ø  系統安全

 

2.   電子商城

2.1.   電子商城簡介

        電子網上商城是一個綜合性的B2C平臺，相似京東商城、天貓商城。會員能夠在商城瀏覽商品、下訂單，以及參加各類活動。

        管理員、運營能夠在平臺後臺管理系統中管理商品、訂單、會員等。

        客服能夠在後臺管理系統中處理用戶的詢問以及投訴。

2.2.   功能架構

2.2.1.    系統功能圖

2.2.2.    功能描述

後臺管理系統：管理商品、訂單、類目、商品規格屬性、用戶管理以及內容發佈等功能。

前臺系統：用戶能夠在前臺系統中進行註冊、登陸、瀏覽商品、首頁、下單等操做。

會員系統：用戶能夠在該系統中查詢已下的訂單、收藏的商品、個人優惠券、團購等信息。

訂單系統：提供下單、查詢訂單、修改訂單狀態、定時處理訂單。

搜索系統：提供商品的搜索功能。

單點登陸系統：爲多個系統之間提供用戶登陸憑證以及查詢登陸用戶的信息。

2.3.   技術架構

2.3.2.  傳統架構

 

思考：有什麼問題？

一、  模塊之間耦合度過高，其中一個升級其餘都得升級

二、  開發困難，各個團隊開發最後都要整合一塊兒

三、  系統的擴展性差

四、不能靈活的進行分佈式部署。

2.3.2.    分佈式系統架構

分佈式架構：

把系統按照模塊拆分紅多個子系統。

優勢：

一、把模塊拆分，使用接口通訊，下降模塊之間的耦合度。

二、把項目拆分紅若干個子項目，不一樣的團隊負責不一樣的子項目。

三、增長功能時只須要再增長一個子項目，調用其餘系統的接口就能夠。

四、能夠靈活的進行分佈式部署。

缺點：

系統之間交互須要使用遠程通訊，接口開發增長工做量。

2.3.3.    技術選型（主要技術）

l  Spring、SpringMVC、Mybatis

l  JSP、JSTL、jQuery、jQuery plugin、EasyUI、KindEditor（富文本編輯器）、CSS+DIV

l  Redis（緩存服務器）

l  Solr（搜索）

l  httpclient（調用系統服務）

l  Mysql

|  Nginx（web服務器）

l   

2.4.   開發工具和環境

IntelliJ IDEA 2016.3 

Maven 3.3.9

Tomcat 8.0（Maven Tomcat Plugin）

JDK 1.8

Mysql 5.7

Nginx 1.8.0

Redis 3.0.0

Mac OS Yosemite操做系統

Git（版本管理）

 

3.   後臺管理系統工程結構

3.1.   maven管理的好處

一、項目構建。Maven定義了軟件開發的整套流程體系，並進行了封裝，開發人員只須要指定項目的構建流程，無需針對每一個流程編寫本身的構建腳本。

二、依賴管理。除了項目構建，Maven最核心的功能是軟件包的依賴管理，可以自動分析項目所須要的依賴軟件包，併到Maven中心倉庫去下載。

A)管理依賴的jar包

B)管理工程之間的依賴關係。

 

3.2.   Maven本地倉庫

    關於Maven配置和使用詳見個人博客：

    一、http://www.javashuo.com/article/p-ztuzjomn-db.html

    二、http://www.javashuo.com/article/p-zfzixqwr-cr.html

3.3.   依賴管理

Maven管理的工程結構：

不使用maven：工程部署時須要手動複製jar包。完成工程構建。很是繁瑣。

使用maven進行工程構建：

使用maven能夠實現一步構建。

3.3.1.    後臺管理系統的工程結構

3.4.   建立數據庫

一、安裝mysql數據庫

二、在mysql中建立一個blade數據庫

三、導入數據庫腳本。

3.4.1.   Mybatis逆向工程

    執行逆向工程:

    使用官方網站的mapper自動生成工具mybatis-generator-core-1.3.2來生成po類和mapper映射文件。

3.4.2.   整合思路

一、Dao層：

    mybatis整合spring，經過spring管理SqlSessionFactory、mapper代理對象。須要mybatis和spring的整合包。

二、Service層：

全部的實現類都放到spring容器中管理。由spring建立數據庫鏈接池，並有spring管理事務。

三、表現層：

Springmvc整合spring框架，由springmvc管理controller。

3.5.  分頁處理

3.5.1.   Mybatis分頁插件 - PageHelper說明

    若是你也在用Mybatis，建議嘗試該分頁插件，這個必定是最方便使用的分頁插件。

該插件目前支持Oracle,Mysql,MariaDB,SQLite,Hsqldb,PostgreSQL六種數據庫分頁。

3.5.2.    使用方法

第一步：在Mybatis配置xml中配置攔截器插件:

<plugins>

    <!-- com.github.pagehelper爲PageHelper類所在包名 -->

    <plugin interceptor="com.github.pagehelper.PageHelper">

        <!-- 設置數據庫類型 Oracle,Mysql,MariaDB,SQLite,Hsqldb,PostgreSQL六種數據庫-->       

        <property name="dialect" value="mysql"/>

    </plugin>

</plugins>

第二步：在代碼中使用

一、設置分頁信息：

    //獲取第1頁，10條內容，默認查詢總數count

    PageHelper.startPage(1, 10);



    //緊跟着的第一個select方法會被分頁

List<Country> list = countryMapper.selectIf(1);

二、取分頁信息

//分頁後，實際返回的結果list類型是Page<E>，若是想取出分頁信息，須要強制轉換爲Page<E>，

Page<Country> listCountry = (Page<Country>)list;

listCountry.getTotal();

三、取分頁信息的第二種方法

//獲取第1頁，10條內容，默認查詢總數count

PageHelper.startPage(1, 10);

List<Country> list = countryMapper.selectAll();

//用PageInfo對結果進行包裝

PageInfo page = new PageInfo(list);

//測試PageInfo所有屬性

//PageInfo包含了很是全面的分頁屬性

assertEquals(1, page.getPageNum());

assertEquals(10, page.getPageSize());

assertEquals(1, page.getStartRow());

assertEquals(10, page.getEndRow());

assertEquals(183, page.getTotal());

assertEquals(19, page.getPages());

assertEquals(1, page.getFirstPage());

assertEquals(8, page.getLastPage());

assertEquals(true, page.isFirstPage());

assertEquals(false, page.isLastPage());

assertEquals(false, page.isHasPreviousPage());

assertEquals(true, page.isHasNextPage());

 

3.5.3.   Mapper

使用逆向工程生成的mapper文件。

 

3.5.4.   Service

@Service public class ItemServiceImpl implements ItemService {        @Autowired      private TbItemMapper itemMapper;      @Override      public EasyUIResult getItemList(Integer page, Integer rows) throws Exception {            TbItemExample example = new TbItemExample();            //設置分頁            PageHelper.startPage(page, rows);            List<TbItem> list = itemMapper.selectByExample(example);            //取分頁信息            PageInfo<TbItem> pageInfo = new PageInfo<>(list);            long total = pageInfo.getTotal();            EasyUIResult result = new EasyUIResult(total, list);                       return result;      }   }

 

3.5.5.   Controller

@Controller @RequestMapping("/item") public class ItemController {           @Autowired      private ItemService itemService;        @RequestMapping("/list")      //設置相應的內容爲json數據      @ResponseBody      public EasyUIResult getItemlist(@RequestParam(defaultValue="1")Integer page,                 @RequestParam(defaultValue="30")Integer rows) throws Exception {            //查詢商品列表            EasyUIResult result = itemService.getItemList(page, rows);                       return result;      } }

 

3.6.   跨域問題

    使用json數據測試。若是ajax請求的是同一個工程中taotao-portal的json數據沒有問題，能夠直接顯示出來。若是請求的是taotao-rest工程中json數據，會發生錯誤。

跨域問題：瀏覽器一個安全的限制，不容許js跨域請求資源，

    如何解決跨域問題：使用jsonp來解決跨域問題。

    jsonp的原理：

    瀏覽器在js請求中，是容許經過script標籤的src跨域請求，能夠在請求的結果中添加回調方法名，在請求頁面中定義方法，既可獲取到跨域請求的數據。

3.6.1.   服務實現

1.    對應數據格式建立pojo類：

public class ItemCat {      //轉換成json數據時使用u做爲key                                                                                                                            @JsonProperty("u")      private String url;           @JsonProperty("n")      private String name;           @JsonProperty("i")      private List<?> item; }

2.    返回值POJO：

 

public class ItemCatResult {                                                                                                                                          private List<?> data;        public List<?> getData() {            return data;      }        public void setData(List<?> data) {            this.data = data;      }      }

 

3.    Service

@Service public class ItemCatServiceImpl implements ItemCatService {        @Autowired      private TbItemCatMapper itemCatMapper;           @Override      public ItemCatResult queryAllCategory() throws Exception {                       ItemCatResult result = new ItemCatResult();            result.setData(getItemCatList(0l));                       return result;      }           /**       * 查詢分類列表       * <p>Title: getItemCatList</p>       * <p>Description: </p>       * @param parentid       * @return       */      private List<?> getItemCatList(long parentid) {            TbItemCatExample example = new TbItemCatExample();            Criteria criteria = example.createCriteria();            //查詢parentid爲0的分類信息            criteria.andParentIdEqualTo(parentid);            List<TbItemCat> list = itemCatMapper.selectByExample(example);            List dataList = new ArrayList();            for (TbItemCat tbItemCat : list) {                 //判斷是否爲父節點                 if (tbItemCat.getIsParent()) {                      ItemCat itemCat = new ItemCat();                      itemCat.setUrl("/category/" + tbItemCat.getId() + ".html");                      itemCat.setName(tbItemCat.getName());                      //遞歸調用                      itemCat.setItem(getItemCatList(tbItemCat.getId()));                      //添加到列表                      dataList.add(itemCat);                 } else {                      String catItem = "/item/" + tbItemCat.getId() + ".html|" + tbItemCat.getName();                      dataList.add(catItem);                 }            }            return dataList;      }   }

 

4.    Controller

    要返回json數據，還須要使用回調方法把json數據包裝起來。因此須要controller添加回調支持，不能直接返回一個ItemCatResult對象。

1.        方法一：

    使用MappingJacksonValue對象包裝返回結果，並設置jsonp的回調方法。

@RequestMapping("/all")      @ResponseBody      public MappingJacksonValue queryAll(String callback) throws Exception {            //查詢分類列表            ItemCatResult result = itemCatService.queryAllCategory();            //包裝jsonp            MappingJacksonValue jacksonValue = new MappingJacksonValue(result);            //設置包裝的回調方法名            jacksonValue.setJsonpFunction(callback);                       return jacksonValue;      }

 

 

 

 

 

 

 

 

 

 

 

 

2.        方法二

    先把ItemCatResult對象轉換成json字符串，而後使用字符串拼接的方法拼裝成jsonp格式的數據。須要設置相應結果的MediaType。

@RequestMapping(value="/all", produces=MediaType.APPLICATION_JSON_VALUE + ";charset=utf-8")      @ResponseBody      public String queryAll(String callback) throws Exception {            //查詢分類列表            ItemCatResult result = itemCatService.queryAllCategory();            //把對象轉換成json數據            String jsonResult = JsonUtils.objectToJson(result);            //拼接字符串            String resultStr = callback + "(" + jsonResult + ");";                       return resultStr;      }

5.   頁面實現

 

 

 

本文爲博主原創文章，轉載請註明出處！

https://my.oschina.net/u/3375733/blog/