创建Maven分布式前台系统架构，写出京动态导航，跨域返Json

作者: 您好简书 | 来源:发表于2019-03-16 14:34 被阅读6次

前台系统架构

image.png

分层的架构有什么好处：

有利于系统的维护，扩展。
分层的结构是按照功能细化，细化之后就能够分布式的部署。
灵活性
前台系统与服务层可以分离
开发团队可以分开，提高开发效率

缺点：

服务器之间需要使用接口进行通信，开发的工作量提高

前台系统可以分为两部分：

服务层的web工程功能就是发布服务
表现层：负责展现页面，没有业务逻辑，所有的业务就是调用服务层的服务
搭建服务protal-rest系统
服务的形式：使用http协议传递json数据，主要的功能是供其它系统进行调用

服务层所使用技术

Mybatis
Spring
SpringMVC

搭建protal-rest的过程与protal-manager-web整合的过程一样

搭建前台（门户）系统：它可以将各种应用，数据的资源以及互联网的资源集成到一个信息管理平台上。并以统一的用户界面提供给我们的用户。
所使用的技术：

Spring+SpringMVC
JS CSS JQuery Bootstrap AngularJS NodeJS React H5
HttpClient

实现商品分类的展示流程

image.png

Protal-rest进行发布服务
需求
请求的URL:是当鼠标滑动到链接的时候，就会发出一个事件，做一个Ajax的请求（json数据），这些数据会包含分类的信息，得到数据之后需要初始化分类的菜单并展现出业

image.png

注意：

所有的分类的数据要从protal-rest中的获取
如果我们要从protal-front里面获取json数据是没有问题，但是我们现在要从protal-rest中获取json数据。所以我们就可以使用ajax请求去调用服务器的数据。

这样就会出现跨域访问的问题
Failed to load http://localhost:8081/category.json: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8082' is therefore not allowed access.

跨域问题

什么是跨域？
a) 域名不同
b) 域名相同但是端口不同
跨域问题是浏览器的安全的限制，不允许js进行跨域的访问。

如何解决跨域的问题：使用jsonp来解决跨域的问题

Jsonp的原理：
浏览器在js请求的时候，是可以通过<script>标签中的src来跨域的请求，Js是不能够进行跨域请求数据的,但是js可以跨域请求js的脚本。得到这个js脚本之后就会立即执行的。那么我主可以把数据作为参数传递到方法中，就可以得到数据了。从而解决了跨域访问的问题。
$.getJSONP(this.URL_Serv, category.getDataService);
它有两个参数：第一个参数是请求的url，第二个参数是要调用的方法。所以我们在category.json中是用category.getDataService()把数据包装起来的，作为参数。然后这个json中的数据就会变成一个js的脚本片段。那么该js片段在传回调用方法里的时候就会立即执行。相当于执行的category.getDataService()方法。会把json数据当成参数。

image.png

图二

image

创建foreknow-rest 也是继承parent

image.png

配置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.foreknow</groupId>
        <artifactId>foreknow-parent</artifactId>
        <version>0.0.1-SNAPSHOT</version>
    </parent>
  <groupId>com.foreknow</groupId>
  <artifactId>foreknow-rest</artifactId>
  <version>0.0.1-SNAPSHOT</version>
  <packaging>war</packaging>
  <dependencies>
        <dependency>
            <groupId>com.foreknow</groupId>
            <artifactId>foreknow-manager-mapper</artifactId>
            <version>0.0.1-SNAPSHOT</version>
        </dependency>
    <!--    String -->
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-context</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-beans</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-webmvc</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-jdbc</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-aspects</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>commons-fileupload</groupId>
            <artifactId>commons-fileupload</artifactId>
        </dependency>
    
  </dependencies>
  <build>
        <plugins>
            <plugin>
                <groupId>org.apache.tomcat.maven</groupId>
                <artifactId>tomcat7-maven-plugin</artifactId>
                <version>2.2</version>
                <configuration>
                    <port>8081</port>
                    <path>/</path>
                    <uriEncoding>UTF-8</uriEncoding>
                </configuration>
            </plugin>
        </plugins>
    </build>
</project>

image.png

设置run configurations 服务器

image.png

位置 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" version="2.5">
  <display-name>foreknow-rest</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
   <!-- 加载spring容器 -->
    <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>
    <!-- 解决post乱码 -->
    <filter>
        <filter-name>CharacterEncodingFilter</filter-name>
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>utf-8</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>CharacterEncodingFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
    <!-- springmvc的前端控制器 -->
    <servlet>
        <servlet-name>foreknow-rest</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <!-- contextConfigLocation不是必须的， 如果不配置contextConfigLocation， springmvc的配置文件默认在：WEB-INF/servlet的name+"-servlet.xml" -->
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:spring/springmvc.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>foreknow-rest</servlet-name>
        <url-pattern>/rest/*</url-pattern>
    </servlet-mapping>
</web-app>

在src/main/resources

image.png

SqlMapConfig.xml

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configuration
        PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <!-- 配置分页插件    拦截器-->
    <plugins>
        <plugin interceptor="com.github.pagehelper.PageHelper">
            <!-- 设置数据库类型 Oracle,Mysql,MariaDB,SQLite,Hsqldb,PostgreSQL六种数据库-->        
            <property name="dialect" value="mysql"/>
        </plugin>
    </plugins>
</configuration>

db.properties

jdbc.driver=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/taobao?characterEncoding=utf-8
jdbc.username=root
jdbc.password=root

resource.properties

#FTP\u76F8\u5173\u914D\u7F6E
#FTP\u7684ip\u5730\u5740
FTP_ADDRESS=192.168.230.128
FTP_PORT=21
FTP_USERNAME=ftpuser
FTP_PASSWORD=sunyong0305
FTP_BASE_PATH=/home/ftpuser/www/images

#\u56FE\u7247\u670D\u52A1\u5668\u7684\u76F8\u5173\u914D\u5236
#\u56FE\u7247\u670D\u52A1\u5668\u7684\u57FA\u7840\u8DEF\u5F84
#FILI_UPLOAD_PATH=D:/temp/imagestest/webapps/images
IMAGE_BASE_URL=http://192.168.230.128

applicationContext-dao.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:context="http://www.springframework.org/schema/context" xmlns:p="http://www.springframework.org/schema/p"
    xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.0.xsd
    http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd
    http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-4.0.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-4.0.xsd
    http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4.0.xsd">

    <!-- 数据库连接池 -->
    <!-- 加载配置文件 -->
    <context:property-placeholder location="classpath:resource/*.properties" />
    <!-- 数据库连接池 -->
    <bean id="dataSource" class="com.alibaba.druid.pool.DruidDataSource"
        destroy-method="close">
        <property name="url" value="${jdbc.url}" />
        <property name="username" value="${jdbc.username}" />
        <property name="password" value="${jdbc.password}" />
        <property name="driverClassName" value="${jdbc.driver}" />
        <property name="maxActive" value="10" />
        <property name="minIdle" value="5" />
    </bean>
    <!-- 配置sqlsessionFactory -->
    <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <property name="configLocation" value="classpath:mybatis/SqlMapConfig.xml"></property>
        <property name="dataSource" ref="dataSource"></property>
    </bean>
    <!-- 配置扫描包，加载mapper代理对象 -->
    <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <property name="basePackage" value="com.foreknow.mapper"></property>
    </bean>
</beans>

applicationContext-service.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:context="http://www.springframework.org/schema/context" xmlns:p="http://www.springframework.org/schema/p"
    xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.0.xsd
    http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd
    http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-4.0.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-4.0.xsd
    http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4.0.xsd">

    <!-- 扫描包加载Service实现类 -->
    <context:component-scan base-package="com.foreknow.rest.serive"></context:component-scan>
</beans>

applicationContext-trans.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:context="http://www.springframework.org/schema/context" xmlns:p="http://www.springframework.org/schema/p"
    xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.0.xsd
    http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd
    http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-4.0.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-4.0.xsd
    http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4.0.xsd">

    <!-- 事务管理器 -->
    <bean id="transactionManager"
        class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
        <!-- 数据源 -->
        <property name="dataSource" ref="dataSource" />
    </bean>
    <!-- 通知 -->
    <tx:advice id="txAdvice" transaction-manager="transactionManager">
        <tx:attributes>
            <!-- 传播行为 -->
            <tx:method name="save*" propagation="REQUIRED" />
            <tx:method name="insert*" propagation="REQUIRED" />
            <tx:method name="add*" propagation="REQUIRED" />
            <tx:method name="create*" propagation="REQUIRED" />
            <tx:method name="delete*" propagation="REQUIRED" />
            <tx:method name="update*" propagation="REQUIRED" />
            <tx:method name="find*" propagation="SUPPORTS" read-only="true" />
            <tx:method name="select*" propagation="SUPPORTS" read-only="true" />
            <tx:method name="get*" propagation="SUPPORTS" read-only="true" />
        </tx:attributes>
    </tx:advice>
    <!-- 切面 -->
    <aop:config>
        <aop:advisor advice-ref="txAdvice"
            pointcut="execution(* com.foreknow.rest.serive.*.*(..))" />
    </aop:config>
</beans>

springmvc.xml


<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:p="http://www.springframework.org/schema/p"
    xmlns:context="http://www.springframework.org/schema/context"
    xmlns:mvc="http://www.springframework.org/schema/mvc"
    xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd
        http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd">

    <context:component-scan base-package="com.foreknow.rest.controller" />
    <mvc:annotation-driven />
    <!-- 定义文件上传解析器 -->
    <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>
<!-- 视图解析器 -->
    <bean
        class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/jsp/" />
        <property name="suffix" value=".jsp" />
    </bean>

    <mvc:resources location="/WEB-INF/css/" mapping="/css/**" />
    <mvc:resources location="/WEB-INF/js/" mapping="/js/**" />
</beans>

image.png

接下来创建一个maven工程 foreknow-protal 继承parent

image.png

配置 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.foreknow</groupId>
        <artifactId>foreknow-parent</artifactId>
        <version>0.0.1-SNAPSHOT</version>
    </parent>
  <groupId>com.foreknow</groupId>
  <artifactId>foreknow-protal</artifactId>
  <version>0.0.1-SNAPSHOT</version>
  <packaging>war</packaging>
  <dependencies>
        <dependency>
            <groupId>com.foreknow</groupId>
            <artifactId>foreknow-common</artifactId>
            <version>0.0.1-SNAPSHOT</version>
        </dependency>
            <!--    String -->
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-context</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-beans</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-webmvc</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-jdbc</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-aspects</artifactId>
        </dependency>
    <!--    JSP -->
    <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>
        
  </dependencies>
  <build>
        <plugins>
            <plugin>
                <groupId>org.apache.tomcat.maven</groupId>
                <artifactId>tomcat7-maven-plugin</artifactId>
                <version>2.2</version>
                <configuration>
                    <port>8082</port>
                    <path>/</path>
                    <uriEncoding>UTF-8</uriEncoding>
                </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" version="2.5">
  <display-name>foreknow-protal</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  <!-- 加载spring容器 -->
    <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>
    <!-- 解决post乱码 -->
    <filter>
        <filter-name>CharacterEncodingFilter</filter-name>
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>utf-8</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>CharacterEncodingFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
    <!-- springmvc的前端控制器 -->
    <servlet>
        <servlet-name>foreknow-protal</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <!-- contextConfigLocation不是必须的， 如果不配置contextConfigLocation， springmvc的配置文件默认在：WEB-INF/servlet的name+"-servlet.xml" -->
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:spring/springmvc.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>foreknow-protal</servlet-name>
        <url-pattern>*.html</url-pattern>
    </servlet-mapping>
</web-app>

然后在 src/main/resources 配置

image.png

resource.properties

#FTP\u76F8\u5173\u914D\u7F6E
#FTP\u7684ip\u5730\u5740
FTP_ADDRESS=192.168.230.128
FTP_PORT=21
FTP_USERNAME=ftpuser
FTP_PASSWORD=sunyong0305
FTP_BASE_PATH=/home/ftpuser/www/images

#\u56FE\u7247\u670D\u52A1\u5668\u7684\u76F8\u5173\u914D\u5236
#\u56FE\u7247\u670D\u52A1\u5668\u7684\u57FA\u7840\u8DEF\u5F84
#FILI_UPLOAD_PATH=D:/temp/imagestest/webapps/images
IMAGE_BASE_URL=http://192.168.230.128

applicationContext-service.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:context="http://www.springframework.org/schema/context" xmlns:p="http://www.springframework.org/schema/p"
    xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.0.xsd
    http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd
    http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-4.0.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-4.0.xsd
    http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4.0.xsd">

    <!-- 扫描包加载Service实现类 -->
    <context:component-scan base-package="com.foreknow.protal.service"></context:component-scan>
</beans>

springmvc.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:p="http://www.springframework.org/schema/p"
    xmlns:context="http://www.springframework.org/schema/context"
    xmlns:mvc="http://www.springframework.org/schema/mvc"
    xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd
        http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd">

    <context:component-scan base-package="com.foreknow.protal.controller" />
    <mvc:annotation-driven />
    <!-- 定义文件上传解析器 -->
<!--    <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> -->
<!-- 视图解析器 -->
    <bean
        class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/jsp/" />
        <property name="suffix" value=".jsp" />
    </bean>
<!-- 配置静态资源的映射 -->
<!--    <mvc:resources location="/WEB-INF/css/" mapping="/css/**" />
    <mvc:resources location="/WEB-INF/js/" mapping="/js/**" /> -->
    
</beans>

配置好之后我们写一下，功能的具体实现

在rest 前台的服务层中我们在webapp 同级创建一个category.json

用Json Viewer 工具显示分析

image.png

其中有一个数据源 data

分为 u n i 对应的i下面还有分组 u n i
也就是说有一级标题还有二级标题

那么我们再src/main/java com.foreknow.rest.pojo 包下创建CatNode.java 和CatResult.java

分别对应根 data 和子分类
CatNode.java

package com.foreknow.rest.pojo;

import java.util.List;

import com.fasterxml.jackson.annotation.JsonProperty;

public class CatNode {
    @JsonProperty("n")
    private String name;
    @JsonProperty("u")
    private String url;
    @JsonProperty("i")
    private List<?> item;
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public String getUrl() {
        return url;
    }
    public void setUrl(String url) {
        this.url = url;
    }
    public List<?> getItem() {
        return item;
    }
    public void setItem(List<?> item) {
        this.item = item;
    }
}

CatResult.java

package com.foreknow.rest.pojo;

import java.util.List;

public class CatResult {
    private List<?> data;

    public List<?> getData() {
        return data;
    }

    public void setData(List<?> data) {
        this.data = data;
    }
}

然后写出 com.foreknow.rest.service ItemCatService.java 接口

package com.foreknow.rest.service;

import java.util.List;

import com.foreknow.rest.pojo.CatResult;

public interface ItemCatService {
    /**
     * 前台分类（根节点Data）
     * @return
     */
    public CatResult getItemCatList();
    
    /**
     * 查询分类的列表
     */
    public List<?> getCatList(long parentId);
    
}

然后写接口的实现类 com.foreknow.rest.service.impl包下 ItemCatServiceImpl.java

package com.foreknow.rest.service.impl;

import java.util.ArrayList;
import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.foreknow.mapper.TbItemCatMapper;
import com.foreknow.pojo.TbItemCat;
import com.foreknow.pojo.TbItemCatExample;
import com.foreknow.pojo.TbItemCatExample.Criteria;
import com.foreknow.rest.pojo.CatNode;
import com.foreknow.rest.pojo.CatResult;
import com.foreknow.rest.service.ItemCatService;
@Service
public class ItemCatServiceImpl implements ItemCatService {
    @Autowired
    private TbItemCatMapper tbItemCatMapper;
    @Override
    public CatResult getItemCatList() {
        CatResult catResult = new CatResult();
        //查询分类的列表
        catResult.setData(getCatList(0));
        return catResult;
    }
    
    @Override
    public List<?> getCatList(long parentId) {
//      把结果创建一个resultList  集合
        List resultList = new ArrayList<>();
        TbItemCatExample example = new TbItemCatExample();
        Criteria criteria = example.createCriteria();
//      这个什么意思？
        criteria.andParentIdEqualTo(parentId);
        List<TbItemCat> list = tbItemCatMapper.selectByExample(example);
        for (TbItemCat tbItemCat : list) {
            //1.要判断是否为根节点
            if(tbItemCat.getIsParent()) {
                CatNode catNode = new CatNode();
//              data下面如果等于0  是第0个元素   那么我们就拼接   这个是第一级
                if(parentId==0) {
                    catNode.setName("<a href='/products/"+tbItemCat.getId()+".html'>"+tbItemCat.getName()+"</a>");
                }else {
//                  二级节点    否则就能显示的名字  
                    catNode.setName(tbItemCat.getName());
                }
                catNode.setUrl("/products/"+tbItemCat.getId()+".html");   //u  拼接
//              应该I 里面还有  N U I   我们用的是递归  自己调用自己
                catNode.setItem(getCatList(tbItemCat.getId()));
                resultList.add(catNode);
            }else {
                //如果为子节点
                resultList.add("/products/"+tbItemCat.getId()+".html|"+tbItemCat.getName());
            }
        }
        
        return resultList;
    }
}

最后写com.foreknow.rest.controller 控制器

JsonController.java

package com.foreknow.rest.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.MediaType;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import com.foreknow.common.util.JsonUtils;
import com.foreknow.rest.pojo.CatResult;
import com.foreknow.rest.service.ItemCatService;

@Controller
public class JsonController {
    @Autowired
    private ItemCatService itemCatService;
    /* 后面的参数表示返回的数据类型是json，字符编码是utf-8
     * 相当于是.response.setContentType("application/json;charset=UTF-8");
     */
    @RequestMapping(value="/itemcat/all", produces=MediaType.APPLICATION_JSON_VALUE + ";charset=utf-8")
    @ResponseBody
    public String getItemCatList(String callback) {
        //查询分类列表  调用service 层的查询方法json数据  前台分类（根节点Data）
        CatResult catResult = itemCatService.getItemCatList();
        
        //把pojo转换成一个字符串   //把对象转换成json数据   
        String json = JsonUtils.objectToJson(catResult);
        
        //拼装返回的字符串(js代码片段)  不能直接返回Json  这个callback= category.getDataservice 在lib-v1.js  包装起来
        String result = callback + "(" + json + ");";   
        return result;
    }
}

总结：rest里的流程就是把json 数据获取并封装成一个JS脚本因为为了跨域让foreknow-protal能访问到 rest 里的数据

在写foreknow-protal

也一个跳到主页的控制器 com.foreknow.protal.controller

PageController.java

package com.foreknow.protal.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class PageController {
    @RequestMapping("/index")
    public String showIndex() {
        return "index";
    }
}

总结：protal里的核心在也JS lib-v1.js

image.png

1171行代码找到服务器端口的127.0.0.1:8081 rest 里的Json数据

还有就是用ajax 发起的异步跨域请求

image.png

可以实现数据库和前框页面的动态处理 http://localhost:8082/

image.png

数据库

image.png

创建Maven分布式前台系统架构，写出京动态导航，跨域返Json

注意：

创建foreknow-rest 也是继承parent

接下来创建一个maven工程 foreknow-protal 继承parent

配置好之后我们写一下，功能的具体实现

总结：rest里的流程就是把json 数据获取并封装成一个JS脚本因为为了跨域让foreknow-protal能访问到 rest 里的数据

在写foreknow-protal

总结：protal里的核心在也JS lib-v1.js

可以实现数据库和前框页面的动态处理 http://localhost:8082/

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读

IT@程序员猿媛

读书

紫水晶书院•文思飞扬（散文、随笔、杂文、评论、科普、日记……

【Camel】...

【学】@Jav...

创建Maven分布式前台系统架构，写出京动态导航，跨域返Json

注意：

创建foreknow-rest 也是继承parent

接下来 创建一个maven工程 foreknow-protal 继承parent

配置好之后 我们写一下，功能的具体实现

总结：rest里的流程 就是把json 数据获取并封装成一个JS脚本 因为为了跨域 让foreknow-protal能访问到 rest 里的数据

在写foreknow-protal

总结：protal里的核心 在也JS lib-v1.js

可以实现数据库和前框页面的动态处理 http://localhost:8082/

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读

IT@程序员猿媛

读书

紫水晶书院•文思飞扬（散文、随笔、杂文、评论、科普、日记……

【Camel】...

【学】@Jav...

接下来创建一个maven工程 foreknow-protal 继承parent

配置好之后我们写一下，功能的具体实现

总结：rest里的流程就是把json 数据获取并封装成一个JS脚本因为为了跨域让foreknow-protal能访问到 rest 里的数据

总结：protal里的核心在也JS lib-v1.js