淘淘商城第31讲——门户系统的搭建

最新推荐文章于 2020-12-30 15:22:38 发布

李阿昀

最新推荐文章于 2020-12-30 15:22:38 发布

阅读量5k

点赞数 2

分类专栏：阿昀的淘淘商城系列项目实战之淘淘商城文章标签：淘淘商城

本文链接：https://blog.csdn.net/yerenyuan_pku/article/details/72825533

版权

项目实战之淘淘商城同时被 2 个专栏收录

123 篇文章 1123 订阅

订阅专栏

阿昀的淘淘商城系列

54 篇文章 21 订阅

订阅专栏

通过上文的学习，我相信大家已经实现了商品添加的功能，本文我将来教大家如何搭建门户系统。

什么是门户系统？

从广义上来说，门户系统将各种应用系统、数据资源和互联网资源集成到一个信息管理平台之上，并以统一的用户界面提供给用户，并建立企业对客户、企业对内部员工和企业对企业的信息通道，使企业能够释放存储在企业内部和外部的各种信息。

其实说白了，门户就是访问网站的入口，通俗的说在这里就是首页，例如京东的首页、淘宝的首页等，当然了，还包括咱们淘淘商城的首页，如下图所示。
这里写图片描述
还有一点需要说明一下，门户是属于前台系统的，它面向的是广大的互联网网民。而后台管理系统面向的是维护人员以及入住的商家，是供他们使用的。

搭建taotao-portal-web工程

我们再来看看淘淘商城的系统架构图，我们目前只是完成了后台管理系统和商品服务，还有很多都没有实现，淘淘商城首页的展示需要用到商城门户工程和内容服务工程，因此本文我们便来学习如何搭建商城门户。
这里写图片描述
下面我们就来搭建一个taotao-portal-web工程。注意：该工程可参考taotao-manager-web工程来搭建哟！

第一步，首先右键名为taotao的Working Set，然后在下拉列表选中New，接着再点击Other...，如下图所示。
在这里插入图片描述
第二步，弹出如下一个窗口，在输入框中输入maven，并选择Maven Project，然后点击Next按钮。

第三步，在弹出的如下窗口中勾选上Create a simple project复选框，如果你不打上这个勾，那么它会让你选择一个骨架，但骨架里面是没有pom这个模板的。然后再点击Next按钮。
在这里插入图片描述
第四步，出现如下窗口，在该窗口中定义maven工程的坐标，如下图所示。
这里写图片描述
温馨提示：taotao-portal-web工程的打包方式是war，且须依赖父工程。

第五步，点击Finish按钮，taotao-portal-web工程就创建好了，但是新建的web工程由于缺少web.xml文件而报错，解决这个错误最后的方法是直接利用Eclipse来帮我们创建该文件，而且我们只须按照下图所示的步骤进行操作即可。
在这里插入图片描述
taotao-portal-web工程搭建好了之后，我们可参考taotao-manager-web工程的pom文件来给taotao-portal-web工程添加相关依赖，如下所示，注意最下方tomcat7插件配置的端口号是8082（因为8080和8081已经被占用了）。

<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.taotao</groupId>
		<artifactId>taotao-parent</artifactId>
		<version>0.0.1-SNAPSHOT</version>
	</parent>
	<groupId>com.taotao</groupId>
	<artifactId>taotao-portal-web</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<packaging>war</packaging>
	
	<dependencies>
		<!-- Spring -->
		<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>org.springframework</groupId>
			<artifactId>spring-jms</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework</groupId>
			<artifactId>spring-context-support</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>
		<!-- 与Dubbo相关 -->
		<dependency>
			<groupId>com.alibaba</groupId>
			<artifactId>dubbo</artifactId>
			<!-- 排除依赖 -->
			<exclusions>
				<exclusion>
					<groupId>org.springframework</groupId>
					<artifactId>spring</artifactId>
				</exclusion>
				<exclusion>
					<groupId>org.jboss.netty</groupId>
					<artifactId>netty</artifactId>
				</exclusion>
			</exclusions>
		</dependency>
		<!-- Zookeeper的客户端，你要连接Zookeeper，需要把以下两个jar包加进来 -->
		<dependency>
			<groupId>org.apache.zookeeper</groupId>
			<artifactId>zookeeper</artifactId>
		</dependency>
		<dependency>
			<groupId>com.github.sgroschupf</groupId>
			<artifactId>zkclient</artifactId>
		</dependency>
		<dependency>
			<groupId>junit</groupId>
			<artifactId>junit</artifactId>
		</dependency>
	</dependencies>
	
	<build>
		<plugins>
			<!-- 配置tomcat7插件 -->
			<plugin>
				<groupId>org.apache.tomcat.maven</groupId>
				<artifactId>tomcat7-maven-plugin</artifactId>
				<configuration>
					<port>8082</port>
					<path>/</path>
				</configuration>
			</plugin>
		</plugins>
	</build>
</project>

然后在src/main/resources目录下新建一个resource目录，并在resource目录下新建一个resource.properties配置文件，这个文件的内容暂时保留为空，以后需要配置的时候可以在这个配置文件添加配置，如下图所示。
在这里插入图片描述
顺便在src/main/resources目录下新建一个spring目录，并在spring目录下新建一个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:dubbo="http://code.alibabatech.com/schema/dubbo" 
	xmlns:mvc="http://www.springframework.org/schema/mvc"
	xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.2.xsd
        http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.2.xsd
        http://code.alibabatech.com/schema/dubbo http://code.alibabatech.com/schema/dubbo/dubbo.xsd
        http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.2.xsd">
        
    <!-- 加载外部属性文件 -->
    <context:property-placeholder location="classpath:resource/*.properties" />

	<context:component-scan base-package="com.taotao.portal.controller" />
	
	<mvc:annotation-driven />
	
	<bean
		class="org.springframework.web.servlet.view.InternalResourceViewResolver">
		<property name="prefix" value="/WEB-INF/jsp/" />
		<property name="suffix" value=".jsp" />
	</bean>
	
	<!-- 配置静态资源映射 -->
	<!-- 指定/WEB-INF/js/和/WEB-INF/css/下的所有的静态资源(包括子目录下的静态资源)都不被拦截 -->
	<!-- mapping=/js/**：表示访问静态资源的路径的形式，/js/**表示可以访问/js/下的静态资源或者所有的子目录下的静态资源 -->
	<!-- <mvc:resources location="/WEB-INF/js/" mapping="/js/**"/>
	<mvc:resources location="/WEB-INF/css/" mapping="/css/**"/> -->
	
	<!-- 引用Dubbo服务 -->
	<dubbo:application name="taotao-portal-web"/>
	<dubbo:registry protocol="zookeeper" address="192.168.81.131:2181"/>	
	<!-- <dubbo:reference interface="com.taotao.service.TestService" id="testService" /> -->
	
</beans>

从以上文件的配置中可以看到配置的Controller的扫描包是com.taotao.portal.controller，所以我们还要在src/main/java目录下新建一个com.taotao.portal.controller包，如下图所示。
在这里插入图片描述
接着我们再来配置一下webapp/WEB-INF目录下的web.xml文件。配置好之后，该文件的内容如下所示，可以看到我们配置的拦截器拦截的请求是以.html结尾的，我们可以称之为伪静态，之所以称为伪静态是因为我们可以把各种动态请求都写成以.html结尾，实质上响应的依然是动态数据，但由于请求是以.html结尾的，浏览器便会认为是要访问静态资源。SEO（搜索引擎优化）喜欢收录以.html结尾的请求，从而有利于搜索排名。

<?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" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	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>taotao-portal-web</display-name>
	<welcome-file-list>
		<welcome-file>index.jsp</welcome-file>
	</welcome-file-list>
	
	<!-- 解决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>taotao-portal-web</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>taotao-portal-web</servlet-name>
		<!-- 涉及到SEO（搜索引擎优化），做一个伪静态化 -->
		<url-pattern>*.html</url-pattern>
	</servlet-mapping>
</web-app>

我这里还是重新说一遍，SEO（搜索引擎优化）是为了提高网站的流量，提高在各搜索引擎中的搜索排名而需要进行的优化，最简单的优化方式是为动态网站伪静态化，以提高排名。

紧接着我们把首页静态页面添加到taotao-portal-web工程当中，但是这些资源从哪儿获取呢？哈哈哈，你可以从我给出的百度网盘链接地址中进行下载，我对你好不好？

链接：https://pan.baidu.com/s/1BHwUn4jn3wuf_bwe8oTwAQ，提取码：jvsd

下载下来之后，将css、images以及js这些目录直接放到webapp目录下，这点与taotao-manager-web工程不一样，原因是taotao-manager-web工程配置的拦截器拦截的是以/结尾的请求，这样的话，我们可以通过配置静态资源映射来访问WEB-INF目录下的静态资源，但是现在拦截器拦截的请求是以*.html结尾的，SpringMVC压根就不会去拦截静态资源，这样即使配置了静态资源映射也不管用。因此，如果将这些静态资源放到WEB-INF目录下，那么将会无法访问到这些静态资源，而只有将它们直接放到webapp目录下才行。
在这里插入图片描述
那为何jsp目录要放到WEB-INF下面呢？这是因为我们在springmvc.xml文件中配置了视图解析器，指定了访问的jsp目录在WEB-INF目录下，因此要将其放到WEB-INF下。

<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
	<property name="prefix" value="/WEB-INF/jsp/" />
	<property name="suffix" value=".jsp" />
</bean>

最后我们来访问一下商城首页，在com.taotao.portal.controller包下新建一个PageController类，@RequestMapping("/index")注解表示拦截以index.html结尾的请求（因为在SpringMVC拦截器配置时我们配置了以*.html结尾的请求将会被拦截）。
在这里插入图片描述
不知你有没有想过一个问题，那就是用户的习惯是输入域名之后回车直接就可以访问官网首页了，压根就没有必要再要求用户输入index.html（即让用户输入网站域名/index.html这样的url地址来访问官网首页）。为了达到这样一个目的，我们还需要在web.xml文件中配置一下。

那么如何配置该web.xml文件呢？web.xml文件中的<welcome-file-list>标签配置的是默认的访问页（原来是index.jsp，现在是index.html），也就是请求过来后会默认访问index.html，由于这个页面并不存在，DispatcherServlet会处理该请求，这时由于请求是以index.html结尾的，因此满足了Controller层的拦截要求，接着便执行其中的showIndex方法并返回index字符串，由于springmvc.xml文件中配置了视图解析器，会自动在index字符串的后面加上.jsp，这样请求便成了访问index.jsp页面，而该页面就是我们的商城首页，因此便可以访问到淘淘商城的首页了。
在这里插入图片描述
下面我们便来启动taotao-portal-web工程，如下图所示。

这时会弹出如下窗口，并在Goals一栏中输入clean tomcat7:run命令，然后依次点击Apply和Run按钮。

taotao-portal-web工程启动成功后，我们在浏览器地址栏中输入http://localhost:8082并回车即可访问到商城首页，如下图所示，现在中间广告位那块还没有实现，因此没有图片。
这里写图片描述