淘淘商城04——门户网站介绍&商城首页搭建&内容系统创建&CMS实现
1. 课程计划
1、门户系统的搭建
2、显示商城首页
3、内容管理系统的实现
a) 内容分类管理
b) 内容管理
2. 门户系统的搭建
2.1. 什么是门户系统
从广义上来说,它将各种应用系统、数据资源和互联网资源集成到一个信息管理平台之上,并以统一的用户界面提供给用户,并建立企业对客户、企业对内部员工和企业对企业的信息通道,使企业能够释放存储在企业内部和外部的各种信息。
门户就是访问网站的入口,通俗的说在这里就是首页。比如:jd首页,taotao首页,taobao首页。
门户属于前台系统 :面向广大的互联网网民。
后台系统:面向维护人员,入住的商家,使用。
2.2. 系统架构
2.3. 搭建taotao-portal-web工程
2.3.1. 创建Maven工程
打包方式:war, 继承 taotao-parent
2.3.2 修改pom.xml 文件
<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> <dependency> <groupId>org.apache.zookeeper</groupId> <artifactId>zookeeper</artifactId> </dependency> <dependency> <groupId>com.github.sgroschupf</groupId> <artifactId>zkclient</artifactId> </dependency> </dependencies> <!-- 配置tomcat插件 --> <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>
2.3.3. 配置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>taotao-manager</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> <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> <!-- URL 拦截形式 --> <servlet-mapping> <servlet-name>taotao-portal-web</servlet-name> <!-- 伪静态化:SEO 搜索引擎优化--> <url-pattern>*.html</url-pattern> </servlet-mapping> </web-app>
2.3.4. 加入配置文件
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: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> <!-- 引用dubbo服务 --> <dubbo:application name="taotao-portal-web" /> <dubbo:registry protocol="zookeeper" address="192.168.25.129:2181" /> <!-- <dubbo:reference interface="com.taotao.service.TestService" id="testService" timeout="300000" /> --> </beans>
log4j.properties (添加log4j不是必须的)
搭建后的效果图:
3. 商城首页展示
首页的原型:
静态页面:
3.1. 功能分析
请求的url:/index
http://localhost:8082/index.html
参数:没有
返回值:String 逻辑视图
3.2. 功能实现
/** * 展示首页 */ @Controller public class PageController { @RequestMapping("/index") public String showIndex(){ return "index"; } }
一般:jd,taobao访问时直接访问域名
我们这里能否直接访问: http://localhost:8082/
(http://localhost:8082/相当于访问域名,后面部署的时候将会换成域名访问)
答案是否定的,要想实现此功能,修改:web.xml。添加红色部分如下:
4. 内容管理系统介绍
4.1. 首页大广告位开发实现分析
可以根据首页大广告位的数据结构设计一张表,进行增删改查管理
其他部分的展示内容同样可以设计表,进行增删改查
存在的问题:
如果每一个前端展示内容(大广告位、小广告位等等),单独建立表,进行CRUD操作,会有以下问题:
1.首页页面信息大量堆积,发布显的异常繁琐沉重;
2.内容繁杂,管理效率低下;
3.许多工作都需要其他技术人员配合完成;
4.改版工作量大,维护,扩展性差;
使用内容管理系统解决以上问题。
4.2. 内容管理系统
内容管理系统(content management system,CMS)是一种位于WEB 前端(Web 服务器)和后端办公系统或流程(内容创作、编辑)之间的软件系统。内容的创作人员、编辑人员、发布人员使用内容管理系统来提交、修改、审批、发布内容。这里指的“内容”可能包括文件、表格、图片、数据库中的数据甚至视频等一切你想要发布到Internet网站的信息。
就是后台管理维护前台的页面和页面中的内容可以动态展示。
4.3. 动态展示分析
对首页展示功能进行分析,抽取,发现应当有以下的字段属性:
有图片
有链接
有标题
有价格
图片提示
包含大文本类型,可以作为公告
把首页的每个展示功能(大广告位,淘淘快报等),看作是一个分类。
每个展示功能里面展示的多条信息,看作是分类下的内容
例如:首页大广告,对应的是大广告分类,而大广告位展示的多张图片,就是大广告分类下的内容
前台需要获取大广告的图片,只需要根据大广告的id查询对应的内容即可
需要一个内容分类表和一个内容表。内容分类和内容表是一对多的关系。
说白了CMS系统就是两张表:
内容分类表:tb_content_category
内容分类表:需要存储树形结构的数据。(大分类下有小分类)
内容表:tb_content
内容分类表tb_content_category结构:
内容表tb_content结构:
需要有后台来维护内容信息CMS系统。
需要创建一个内容服务系统。
5. 内容服务系统创建
taotao-content:聚合工程打包方式pom,父工程taotao-parent
|--taotao-content-interface jar (maven模块,选择taotao-content 右击鼠标-->NEW --->Maven Module)
|--taotao-content-Service war (maven模块,选择taotao-content 右击鼠标-->NEW --->Maven Module)
//直接依赖POJO过来(taotao-manager-pojo)
//直接依赖dao过来(taotao-manager-dao)
(1)taotao-content pom文件:
<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-content</artifactId> <version>0.0.1-SNAPSHOT</version> <packaging>pom</packaging> <dependencies> <dependency> <groupId>com.taotao</groupId> <artifactId>taotao-commom</artifactId> <version>0.0.1-SNAPSHOT</version> </dependency> </dependencies> <!-- 配置tomcat插件 --> <build> <plugins> <plugin> <groupId>org.apache.tomcat.maven</groupId> <artifactId>tomcat7-maven-plugin</artifactId> <configuration> <port>8083</port> <path>/</path> </configuration> </plugin> </plugins> </build> <modules> <module>taotao-content-interface</module> <module>taotao-content-service</module> </modules> </project>
(2)taotao-content-interface pom文件:
<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-content</artifactId> <version>0.0.1-SNAPSHOT</version> </parent> <artifactId>taotao-content-interface</artifactId> <dependencies> <dependency> <groupId>com.taotao</groupId> <artifactId>taotao-manager-pojo</artifactId> <version>0.0.1-SNAPSHOT</version> </dependency> </dependencies> </project>
(3)taotao-content-Service pom文件:
<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-content</artifactId> <version>0.0.1-SNAPSHOT</version> </parent> <artifactId>taotao-content-service</artifactId> <packaging>war</packaging> <dependencies> <dependency> <groupId>com.taotao</groupId> <artifactId>taotao-manager-dao</artifactId> <version>0.0.1-SNAPSHOT</version> </dependency> <dependency> <groupId>com.taotao</groupId> <artifactId>taotao-content-interface</artifactId> <version>0.0.1-SNAPSHOT</version> </dependency> <!-- spring的依赖 --> <!-- 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> <!-- 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> <原文地址:https://www.cnblogs.com/toria/p/day04.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 【Flutter 实战】简约而不简单的计算器
- Flutter 中渐变的高级用法
- 【Flutter实战】动画核心(1/2)
- 【Flutter实战】动画核心(2/2)
- Flutter 1.17 新 Material motion 规范的预构建动画
- Canonical通过Flutter启用Linux桌面应用程序支持
- Flutter 快捷开发 Mac Android Studio 篇
- TRTC Android端开发接入学习之互动直播(七)
- Flutter 实现酷炫的3D效果
- 【Flutter 实战】一文学会20多个动画组件
- 【Flutter 实战】动画序列、共享动画、路由动画
- 【Flutter 实战】自定义动画-涟漪和雷达扫描
- Flutter —布局系统概述
- 【Flutter 实战】全局点击空白处隐藏键盘
- 我对Flutter的第一次失望