03-05-动吧旅游生态系统-首页

1 项目简介

1.1 概述

动吧旅游生态系统,应市场高端用户需求，公司决定开发这样的一套旅游系统，此系统包含旅游电商系统（广告子系统，推荐子系统，评价子系统，商品子系统，订单子系统，…），旅游分销系统(分销商的管理)，旅游业务系统(产品研发，计调服务，系统权限管理子系统，…)，，。。。

1.2 原型分析

基于用户需求,进行原型设计（基于html+css+js进行静态页面实现）。例如系统登录页面:

系统登录成功页面(例如starter.html)

菜单展示页面

说明:原型设计好以后,会与客户进行确认,确认好以后进行签字,然后就是设计和实现.

2 技术架构

2.1 项目分层架构

本项目应用层基于MVC设计思想，进行分层架构设计，其核心目的是将复杂问题简单化,实现各司其职,各尽所能.然后基于“高内聚,低耦合”的设计思想，再实现各对象之间协同,从而提高系统的可维护性，可扩展性。

其中：
1.开放接口层：可直接封装 Service 方法暴露成 RPC (远程过程调用)接口；也可通过 Web 封装成 http 接口；同时也可进行网关安全控制、流量控制等。
2.终端显示层：负责各个端的模板渲染并显示。当前主要是 thymeleaf 渲染，JS 渲染，移动端展示等。
3.Web请求处理层：主要是对访问控制进行转发，请求参数校验，响应结果处理等
4.Service 层：相对具体的业务逻辑服务层（核心业务，扩展业务）。
5.Manager 层：通用业务处理层，它有如下特征：
1） 对第三方平台封装的层，预处理返回结果及转化异常信息；
2） 对 Service 层通用能力的下沉，如缓存方案、中间件通用处理；
3） 与 DAO 层交互，对多个 DAO 的组合复用。
6.DAO 层：数据访问层，与底层 MySQL、Oracle、Hbase 等进行数据交互。
7.外部接口或第三方平台：包括其它部门RPC开放接口，基础平台，其它公司的 HTTP 接口
说明：对如上分层中涉及到知识的点，逐步加强。

总之：分层的目的就是将复杂问题进行拆解，然后分而治，进而提高系统的可扩展性以及可维护性。

2.2 API应用架构

整体API应用架构:

3 技术整合

3.1 环境准备

3.1.1 数据库初始化

启动MySQL客户端并登陆,然后执行

set names utf8;
source d:/jtsys.sql

说明:假如在mysql客户端查询表中数据，可以先执行set names gbk，否则可能会出现乱码。还有一点要记住,在拿到任何一个sql脚本文件时,不要上来就执行它,要先打开看一看,检查是否有删除库或删除表的语句,这些语句是否会对你当前数据库中的库和表有影响 ,假如有一定要经过leader审批,才能执行删除等操作.

3.1.2 IDE配置初始化(STS)

1.统一工作区编码(UTF-8)
2.统一JDK版本(JDK1.8)
3.统一MAVEN配置(3.6.3)

3.2 创建项目

1.项目名称:CGB-DB-SYS-V3.01
2.组ID: com.cy
3.打包方式:jar

3.2.1 添加项目依赖

3.2.2 修改配置文件

在application.yml文件中添加如下配置(server,datasource,mybatis,mvc)

#server
server:
  port: 80
  servlet:
    context-path: /

#spring
spring:
  datasource:
    url: jdbc:mysql:///dbsys?serverTimezone=GMT%2B8&characterEncoding=utf8
    username: root
    password: root
  thymeleaf:
    prefix: classpath:/templates/pages/
    suffix: .html

#mybatis
mybatis:
  configuration:
    default-statement-timeout: 30
    map-underscore-to-camel-case: true
  mapper-locations:
  - classpath:/mapper/*/*.xml

#lOG
logging:
  level:
com.cy: DEBUG

3.3 首页初始化

3.3.1 定义页面初始资源

1.将js、css、images相关资源拷贝到项目static目录
2.将pages页面拷贝到项目的templates目录

3.3.2 创建页面Controller

创建呈现首页页面的controller对象。

package com.cy.pj.sys.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
@RequestMapping("/")
	@Controller
public class PageController {
	@RequestMapping("doIndexUI")
	public String doIndexUI(){
		return "starter";
	}
}

说明：此controller会作为项目中所有页面访问的入口。

3.3.3 启动项目进行测试

启动tomcat，在地址栏输入http://localhost/doIndexUI（地址中的端口号要参考自己tomcat启动端口）地址进行访问，假如没有问题会呈现如下页面：

页面访问流程分析，如下图所示(了解)：

4 总结

4.1 重点难点分析

1.项目需求调研，分析，原型设计,评审?
2.项目整体应用分层架构及API设计架构?
3.项目初始化环境配置(数据库，IDE，MAVEN)及运行?

4.2 FAQ分析

1.项目是如何进行分层设计的?(MVC)。
2.项目页面是如何设计的? (BootStrap，AdminLTE-网址(adminlte.io))。
3.客户端向服务端发起一个请求,服务端请求处理的一个过程是怎样的?

4.3 BUG分析

▪请求资源不存在,如下图所示:

问题分析:
1)检查url是否正确(是否有对应的映射)
2)检查controller的包是否正确以及是否有对应的注解(例如@Controller)进行描述

▪响应资源解析异常,如下图所示:

问题分析:
1)假如start是模板，检查响应页面是否存在.
2)检查配置文件中视图的前缀、后缀是否正确
3)假如start不是html模板，检查对应的Controller方法上是否有@ReponseBody注解

因为没有做部门的文档，在这里做以下补充，整个系统的源码及sql文件在Git地址：https://gitee.com/Zxs1198179754/move2004?_from=gitee_search 。