技术选型：

• 开发工具：eclipse
• 数据库：mysql
• 后台框架：SSM框架
• 前台框架：jQuery,BootStrap,GridManager表格插件

 

后端框架介绍：

SSM框架由Mybatis,spring,springmvc组成：

• Mybatis:基于ORM的数据库持久化框架

ORM：对象关系映射，为了解决面向对象和关系数据库互相不匹配的现象的一种技术
是我们在操作数据库的时候不用和复杂的sql打交道，而是像操作对象一样操作塔。
1.用于操作数据库的框架【替换咱们的jdbc】
2.代码更加简单 sql写在xml中
3.它的底层代码依然是jdbc

面试题：${}和#{}的区别?

如果要使用${}还要防止sql注入？

使用正则表达式过滤传入的参数

• spring:一种轻量级的DI/IOC/AOP的容器

一种轻量级的DI/IOC和AOP的容器框架
（1）轻量级：使用简单，功能强大
（2）DI：依赖注入，将创建对象和关系维护（字段赋值）交给Spring容器去做
（3）IOC：控制反转，以前的某一个对象，用来控制其他对象，现在所有对象都被spring控制
（4）AOP：切面式编程，将业务逻辑从应用服务中抽离出来，以拦截的方式作用于一个方法的不同地方，比如日志和事务的处理。

• springMVC-基于MVC模式的web表现层框架

注意：SpringMvc的功能就是之前Servlet的功能，可以理解为使用SpringMVC代替了Servlet；

面试题：1.springMVC执行流程：

2.springMVC里面用到的注解：

（1）@controller

（2）@Controller用户标记一个类，使用它标记的类就是一个Spring MVC Controller对象，即：一个控制器类。

（3）@RequestMapping是一个用来处理请求地址映射的注解（将请求映射到对应的控制器方法中），可用于类或方法上。用于类上，表示类中的所有响应请求的方法都是以该地址作为父路径。

（4）@Responsebody表示该方法的返回结果直接写入HTTP response body中。一般在异步获取数据时使用，在使用@RequestMapping后，返回值通常解析为跳转路径，加上@Responsebody后返回结果不会被解析为跳转路径，而是直接写入HTTP response body中。比如异步获取json数据，加上@Responsebody后，会直接返回json数据。

• 配置文件：

• spring.xml:

•  spring-mvc.xml:

• web.xml:

<!--  监听器配置 -->
    <listener>
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
    </listener>
    <!-- 服务器启动的时候加载spring的 配置文件 -->
    <context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:applicationContext.xml</param-value>
    </context-param>
   <!-- 前端控制器 DispatcherServlet -->
  <servlet>
      <servlet-name>dispatcherServlet</servlet-name>
      <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
      <!-- 加载springmvc核心配置文件 -->
      <init-param>
          <param-name>contextConfigLocation</param-name>
          <param-value>classpath:applicationContext-mvc.xml</param-value>
      </init-param>
      <!-- 启动即加载 ,优先级 -->
      <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
      <servlet-name>dispatcherServlet</servlet-name>
      <!-- 会拦截请求 ，包括html,css 除了jsp  为了放行静态资源-->
      <url-pattern>/</url-pattern>
  </servlet-mapping>
   <!-- 配置filter解决字符集编码问题 -->
  <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>
  <welcome-file-list>
    <welcome-file>/home/index.html</welcome-file>
  </welcome-file-list>

 

 前端框架介绍

• jQuery：是一个优秀的js库或js框架

（1）代码量减少了
（2）具有纵多的选择器供开发者使用
（3）独特的链式语法
（4）很多API都方法化了：以前原生js的API有的是属性有的是方法，jQuery中很多都是方法操作

用到了Ajax:

AJAX即Asynchronous Javascript And XML（异步JavaScript和XML），是改善用户体验的网页开发技术；
（1）写ajax代码就是写js代码；
（2）学习ajax其实是学习使用浏览器的ajax（XMLHttpRequest对象）对象发异步请求，将响应的数据局部更新到页面；
Ajax交互方式：
1.异步请求，发送请求的同时还可以继续操作页面。页面不销毁；
2.返回部分数据，减少不必要的数据传输，减少网络资源。页面不刷新，而是更新页面部分数据；
总结：Ajax出现的缘由：更好的提升用户的体验，以及提升服务器的效率，减少网络中不必要的数据的传送

//发送异步请求
$.ajax({
                type:"post",     //请求方式
                url:"/city",        //url映射路径
                data:{"id":id},   //发送给后台的参数
                dataType:"json",    //后台返回值类型
                success:function(msg){
                    })
            })

• Bootstrap ：是快速开发 Web 应用程序的前端工具包

它是一个 CSS，HTML 和 JS 的集合，它使用了最新的浏览器技术，给你的 Web 开发提供了时尚的版式，表单，buttons，表格，网格系统等等。

• GrandManager :表格插件

GridManager 可快速、灵活的对table标签进行实例化. 使用简单快捷, 功能强大
纯原生javascript实现，不依赖任何框架使用简单快捷，功能强大与用户进行沟通，采纳来自于使用的需求，并不间段的进行升级维护

 

后台模块

• 文章管理

• 分页功能：GridManager通过向后台传入分页信息（localPage和PageSize）
• 高级查询：登录按钮绑定事件将查询字段和分页信息一起传给后台，后台处理，写动态 sql,用到的标签：where,if
•  增删改查功能

富文本编辑器：ueditor,编写文章内容时有丰富的文本，需要引入文件，添加富文本框，再实例化富文本编辑器

页面静态化：FreeMarker页面静态化技术是通过模板生成静态页面的方法。之前是通过id去查询数据库，然后绑定到动态页面进行数据展示。现在我们在进行添加和修改时就生成静态页面，之后访问的就是静态资源,利于空间换时间。

• 轮播图管理

分页功能，高级查询功能，增删改查功能参考文章模块

文件上传功能：文件上传三要素：（1）必须是post请求；（2）enctype="multipart/form-data"；（3）type="file"

还需要配置文件上传解析器

• 用户模块

• 用户的登录：

登录按钮绑定事件，将数据传给后台，后台通过username查找user对象，如果user对象存在的话再比较password是否相同,相同则登录成功，返回user对象。控制层将user对象设置到session里面。用户登录还配置了拦截器，必须登陆了才能进入后台，拦截system/下的所有url，放行system/login。拦截的实现是判断session里面是否有user对象，有的话就放行，没有的话就跳转到登录界面。

• 用户的注销：

发送请求到后台，后台销毁session。

• 记住我功能：

如果勾选了记住我，后台就创建cookie，将用户名和密码以cookie的方式设置到浏览器保存，前台接收cookie，进行截取，将用户名和密码设置到用户框和密码框，然后勾选记住我；取消记住我，后台销毁cookie，重新添加到浏览器，前台清除数据，取消勾选记住我

面试题：session和cookie的区别？

cookie:数据保存在浏览器中，不安全，大小有限制，类型有限制，有中文乱码，减轻了服务器的压力

session：数据保存在服务端，安全，大小无限制，类型无限制，但是会影响服务器的性能

 

前台模块

• 文章显示：

ajax发送异步请求到后台，在后台查询，后台按类型查询存入三个list集合，再将list存入map集合里，响应给前台，再分别取出来，添加到对应的标签下展示

• 轮播图显示：

ajax发送异步请求到后台，在后台查询，将数据响应给前台，添加到对应标签下进行展示。