Java框架——SSM整合
SSM整合
SSM是什么？
SSM 整合指的是将 Spring、SpringMVC 和 MyBatis 三个框架集成在一起，以实现快速开发 Web 应用程序的目的。下面是 SSM 整合的详细步骤：
-
配置 Spring：在 Spring 配置文件中，配置数据源、事务管理器、MyBatis 的 SqlSessionFactory 等 Bean。
-
配置 MyBatis：在 MyBatis 的配置文件中，配置数据源、映射文件的位置、Mapper 接口的扫描路径等信息。
-
配置 SpringMVC：在 SpringMVC 配置文件中，配置视图解析器、静态资源的处理、请求映射和请求处理器等信息。
-
集成 Spring、MyBatis 和 SpringMVC：在 web.xml 文件中，配置 SpringMVC 的 DispatcherServlet 和 ContextLoaderListener，并将它们和 Spring 和 MyBatis 的配置文件关联起来。
-
编写 Mapper 接口和映射文件：在 Mapper 接口中定义 SQL 语句，并在映射文件中配置 SQL 语句的具体实现。
-
编写 Service 层和 Controller 层：在 Service 层中实现业务逻辑，并调用 Mapper 接口来执行 SQL 语句。在 Controller 层中处理请求和响应，调用 Service 层来处理业务逻辑。
-
编写页面：使用 JSP、HTML、CSS 和 JavaScript 等技术，编写页面，展示数据和交互效果。
在整个 SSM 整合过程中，需要注意一些细节问题，例如配置文件的路径和名称、Mapper 接口和映射文件的命名规范、Service 层和 Controller 层的异常处理等。此外，还可以使用一些辅助工具，例如 Maven、Spring Boot 和 MyBatis Generator 等，来简化 SSM 整合的过程。
为什么要整合？
将 Spring、SpringMVC 和 MyBatis 三个框架整合在一起，可以实现以下几个方面的好处：
-
提高开发效率：整合后，可以通过 Spring 的依赖注入和面向切面编程等特性，来简化业务逻辑的实现。同时，通过 MyBatis 的映射文件和 Mapper 接口的配置，可以轻松地实现数据访问层的编写。这些特性可以大大提高开发效率，减少重复代码的编写。
-
统一管理：整合后，可以统一管理 Spring、SpringMVC 和 MyBatis 的配置文件，避免了多个配置文件之间的冲突和不一致性。这样可以使代码的管理更加方便和规范。
-
提高可维护性：整合后，可以将业务逻辑划分为不同的层次，使代码结构更加清晰。同时，可以通过 AOP 实现事务管理和日志记录等功能，使代码更加可维护和可扩展。
-
提高系统性能：整合后，可以通过 MyBatis 的缓存机制和 SpringMVC 的视图缓存机制，来提高系统的性能。这些缓存机制可以减少对数据库的访问次数，从而提高系统的响应速度。
综上所述，将 Spring、SpringMVC 和 MyBatis 三个框架整合在一起，可以提高开发效率、统一管理、提高可维护性和提高系统性能等方面的优势，是一种常用的 Web 应用程序开发方式。
参考博文地址：https://www.cnblogs.com/999520hzy/p/13917444.html
环境
环境要求
环境：
- IDEA
- MySQL 5.7.19
- Tomcat 9
- Maven 3.6
要求：
- 需要熟练掌握MySQL数据库，Spring，JavaWeb及MyBatis知识，简单的前端知识；
1.数据库环境
创建一个存放书籍数据的数据库表
CREATE DATABASE `ssmbuild`;
USE `ssmbuild`;
#如果有此名字的表就删除
DROP TABLE IF EXISTS `books`;
CREATE TABLE `books` (
`bookID` INT(10) NOT NULL AUTO_INCREMENT COMMENT '书id',
`bookName` VARCHAR(100) NOT NULL COMMENT '书名',
`bookCounts` INT(11) NOT NULL COMMENT '数量',
`detail` VARCHAR(200) NOT NULL COMMENT '描述',
KEY `bookID` (`bookID`)
) ENGINE=INNODB DEFAULT CHARSET=utf8
INSERT INTO `books`(`bookID`,`bookName`,`bookCounts`,`detail`)VALUES
(1,'Java',1,'从入门到放弃'),
(2,'MySQL',10,'从删库到跑路'),
(3,'Linux',5,'从进门到进牢');
在idea中连接数据库
项目结构
导入依赖
<dependencies>
<dependency>
<groupId>junitgroupId>
<artifactId>junitartifactId>
<version>4.12version>
dependency>
<dependency>
<groupId>mysqlgroupId>
<artifactId>mysql-connector-javaartifactId>
<version>8.0.11version>
dependency>
<dependency>
<groupId>com.mchangegroupId>
<artifactId>c3p0artifactId>
<version>0.9.5.2version>
dependency>
<dependency>
<groupId>javax.servletgroupId>
<artifactId>servlet-apiartifactId>
<version>2.5version>
dependency>
<dependency>
<groupId>javax.servlet.jspgroupId>
<artifactId>jsp-apiartifactId>
<version>2.2version>
dependency>
<dependency>
<groupId>javax.servletgroupId>
<artifactId>jstlartifactId>
<version>1.2version>
dependency>
<dependency>
<groupId>org.mybatisgroupId>
<artifactId>mybatisartifactId>
<version>3.5.2version>
dependency>
<dependency>
<groupId>org.mybatisgroupId>
<artifactId>mybatis-springartifactId>
<version>2.0.2version>
dependency>
<dependency>
<groupId>org.springframeworkgroupId>
<artifactId>spring-webmvcartifactId>
<version>5.1.9.RELEASEversion>
dependency>
<dependency>
<groupId>org.springframeworkgroupId>
<artifactId>spring-jdbcartifactId>
<version>5.1.9.RELEASEversion>
dependency>
dependencies>
<build>
<resources>
<resource>
<directory>src/main/javadirectory>
<includes>
<include>**/*.propertiesinclude>
<include>**/*.xmlinclude>
includes>
<filtering>falsefiltering>
resource>
<resource>
<directory>src/main/resourcesdirectory>
<includes>
<include>**/*.propertiesinclude>
<include>**/*.xmlinclude>
includes>
<filtering>falsefiltering>
resource>
resources>
build>
注意：此时用的是引入的外部配置文件连接不需要再用那个amp;了，否则会报错
database.properties
jdbc.driver=com.mysql.cj.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/mybatis?useSSL=false&useUnicode=true&characterEncoding=utf8&serverTimezone=GMT%2B8
jdbc.username=root
jdbc.password=123456
Mybatis层
核心配置
mybatis-con2fig.xml
1.编写mybatis核心配置文件
DOCTYPE configuration
PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
<typeAliases>
<package name="com.Hao.pojo"/>
typeAliases>
<mappers>
<mapper class="com.Hao.dao.BookMapper"/>
mappers>
configuration>
实体类
2.在pojo包下建立实体类，注意相关变量名称对应数据库
Books
package com.Hao.pojo;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
/**
* @Project_Name ssmbuild
* @Author LH
* @Date 2021/8/25 20:06
* @TODO：整合ssm中第二步，建立实体类
* @Thinking:
*/
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Books {
private int bookID;
private String bookName;
private int bookCounts;
private String detail;
}
接口
3.在dao层，定义相关接口方法，对应相关操作
编写需要的方法
BookMapper.class
package com.Hao.dao;
import com.Hao.pojo.Books;
import org.apache.ibatis.annotations.Param;
import java.util.List;
/**
* @Project_Name ssmbuild
* @Author LH
* @Date 2021/8/25 20:10
* @TODO：接口方法
* @Thinking:
*/
public interface BookMapper {
//增加一本书
int addBook(Books books);
//@Param地处dao层 作用是用于传递参数，从而可以与SQL中的的字段名相对应，一般在2=<参数数<=5时使用最佳。
//注意：只有一个变量的时候不要加否则会报错
//删除一本书
// int deleteBookById(@Param("bookId") int id);
int deleteBookById(int id);
//更新一本书
int updateBook(Books books);
//查询一本书
// Books queryBookById(@Param("bookId") int id);
Books queryBookById(int id);
//查询全部
List<Books> queryAllBook();
}
接口实现
同层编写BookMapper.xml
从mybatis-config.xml中将项目头文件复制下来，对应三个地方改为mapper即可
DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.Hao.dao.BookMapper">
<insert id="addBook" parameterType="Books">
insert into ssmbuild.books(bookName,bookCounts,detail)
values (#{bookName}, #{bookCounts}, #{detail})
insert>
<delete id="deleteBookById" parameterType="int">
delete from ssmbuild.books where bookID=#{bookID}
delete>
<update id="updateBook" parameterType="Books">
update ssmbuild.books
set bookName=#{bookName},bookCounts=#{bookCounts},detail=#{detail}
where bookID=#{bookID} ;
update>
<select id="queryBookById" resultType="Books">
select * from ssmbuild.books
where bookID = #{bookID}
select>
<select id="queryAllBook" resultType="Books">
SELECT * from ssmbuild.books
select>
mapper>
然后立即将此mapper.xml注册到bean，前面已经写上了，此处只做陈述
再写接口
再在servise服务层中继续编写相关接口
package com.Hao.service;
import com.Hao.pojo.Books;
import org.apache.ibatis.annotations.Param;
import java.util.List;
/**
* @Project_Name ssmbuild
* @Author LH
* @Date 2021/8/25 21:09
* @TODO：服务层方法
* @Thinking:
*/
public interface BookService {
//增加一本书
int addBook(Books books);
//删除一本书
int deleteBookById(@Param("bookId") int id);
//更新一本书
int updateBook(Books books);
//查询一本书
Books queryBookById(@Param("bookId") int id);
//查询全部书籍
List<Books> queryAllBook();
}
接口实现类
BookServiceImpl.class
package com.Hao.service;
import com.Hao.dao.BookMapper;
import com.Hao.pojo.Books;
import java.util.List;
/**
* @Project_Name ssmbuild
* @Author LH
* @Date 2021/8/25 21:13
* @TODO：编写此接口实现类，将set方法加上，再将其它方法实现过来并修改其中的返回值
* @Thinking:
*/
public class BookServiceImpl implements BookService{
//service调dao层：组合Dao
private BookMapper bookMapper;
//set方法要加上
public void setBookMapper(BookMapper bookMapper) {
this.bookMapper = bookMapper;
}
@Override
public int addBook(Books books) {
return bookMapper.addBook(books);
}
@Override
public int deleteBookById(int id) {
return bookMapper.deleteBookById(id);
}
@Override
public int updateBook(Books books) {
return bookMapper.updateBook(books);
}
@Override
public Books queryBookById(int id) {
return bookMapper.queryBookById(id);
}
@Override
public List<Books> queryAllBook() {
return bookMapper.queryAllBook();
}
}
Spring层
1、配置Spring整合MyBatis，我们这里数据源使用c3p0连接池；
2、我们去编写Spring整合Mybatis的相关的配置文件；spring-dao.xml
spring-dao.xml
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
https://www.springframework.org/schema/context/spring-context.xsd">
<context:property-placeholder location="classpath:database.properties"/>
<bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource">
<property name="driverClass" value="${jdbc.driver}"/>
<property name="jdbcUrl" value="${jdbc.url}"/>
<property name="user" value="${jdbc.username}"/>
<property name="password" value="${jdbc.password}"/>
<property name="maxPoolSize" value="30"/>
<property name="minPoolSize" value="10"/>
<property name="autoCommitOnClose" value="false"/>
<property name="checkoutTimeout" value="10000"/>
<property name="acquireRetryAttempts" value="2"/>
bean>
<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
<property name="dataSource" ref="dataSource"/>
<property name="configLocation" value="classpath:mybatis-config.xml"/>
bean>
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="sqlSessionFactoryBeanName" value="sqlSessionFactory"/>
<property name="basePackage" value="com.Hao.dao"/>
bean>
beans>
spring-service.xml
Spring整合service层
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context.xsd">
<context:component-scan base-package="com.Hao.service" />
<bean id="BookServiceImpl" class="com.Hao.service.BookServiceImpl">
<property name="bookMapper" ref="bookMapper"/>
bean>
<bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
<property name="dataSource" ref="dataSource" />
bean>
beans>
springMvc层
web.xml
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
version="4.0">
<servlet>
<servlet-name>DispatcherServletservlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServletservlet-class>
<init-param>
<param-name>contextConfigLocationparam-name>
<param-value>classpath:applicationContext.xmlparam-value>
init-param>
<load-on-startup>1load-on-startup>
servlet>
<servlet-mapping>
<servlet-name>DispatcherServletservlet-name>
<url-pattern>/url-pattern>
servlet-mapping>
<filter>
<filter-name>encodingFilterfilter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilterfilter-class>
<init-param>
<param-name>encodingparam-name>
<param-value>utf-8param-value>
init-param>
filter>
<filter-mapping>
<filter-name>encodingFilterfilter-name>
<url-pattern>/*url-pattern>
filter-mapping>
<session-config>
<session-timeout>15session-timeout>
session-config>
web-app>
spring-mvc.xml
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
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/context
http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/mvc
https://www.springframework.org/schema/mvc/spring-mvc.xsd">
<mvc:annotation-driven />
<mvc:default-servlet-handler/>
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="viewClass" value="org.springframework.web.servlet.view.JstlView" />
<property name="prefix" value="/WEB-INF/jsp/" />
<property name="suffix" value=".jsp"/>
bean>
<context:component-scan base-package="com.Hao.controller" />
beans>
然后把jsp文件夹新建一下，对应起来
applicationContext.xml
<beans xmlns="http://www.springframework.org/schema/beans"
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.xsd">
<import resource="spring/spring-dao.xml"/>
<import resource="spring/spring-service.xml"/>
<import resource="spring/spring-mvc.xml"/>
beans>
以上就是配置ssm项目的基本框架，现在开始就可以写自己所需相关业务了！
要写网站就是把controller层与jsp交互即可！
业务
开发流程
配置文件，暂时结束！Controller 和 视图层编写
查询
1、BookController 类编写 ， 方法一：查询全部书籍
package com.Hao.controller;
import com.Hao.pojo.Books;
import com.Hao.service.BookService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Qualifier;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import java.util.List;
/**
* @Project_Name ssmbuild
* @Author LH
* @Date 2021/8/25 22:06
* @TODO：功能页面
* @Thinking:
*/
@Controller
@RequestMapping("/book")
public class BookController {
//controller 调用service层
@Autowired
@Qualifier("BookServiceImpl")
private BookService bookService;
//查询全部的书籍，并且返回到一个书籍展示页面
@RequestMapping("/allBook")
public String list(Model model) {
List<Books> list = bookService.queryAllBook();
model.addAttribute("list", list);
return "allBook";
}
}
编写对应的allBook.jsp
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
书籍列表
在首页index中也要有相应的指向哦
<h3>
<a href="${pageContext.request.contextPath}/book/allBook">点击进入列表页a>
h3>
测试运行输入对应地址
http://localhost:8080/book/allBook
前端页面设计Bootstrap国内cdn库
网址：https://v3.bootcss.com/
添加
BookController 类编写 ， 方法二：添加书籍
@RequestMapping("/toAddBook")
public String toAddPaper() {
return "addBook";
}
@RequestMapping("/addBook")
public String addPaper(Books books) {
System.out.println(books);
bookService.addBook(books);
return "redirect:/book/allBook";
}
添加书籍页面：addBook.jsp
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
新增书籍
新增书籍
BookController 类编写 ， 方法三：修改书籍
//修改完毕提交之后需要返回到首页
@RequestMapping("/updateBook")
public String updateBook(Model model, Books book) {
bookService.updateBook(book);
Books books = bookService.queryBookById(book.getBookID());
model.addAttribute("books", books);
return "redirect:/book/allBook";
}
//删除
@RequestMapping("/deleteBook/{bookId}")
public String deleteBook(@PathVariable("bookId") int id){
bookService.deleteBookById(id);
return "redirect:/book/allBook";
}
修改
修改书籍页面 updateBook.jsp
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
修改信息
修改信息
<%--出现的问题：提交了修改的SQL请求，但是修改失败，初次考虑，是事务问题，依旧失败！--%>
<%--看一下SQL语句，能否执行成功：SQL执行失败，修改未完成--%>
<%--前端隐藏域--%>
错误：
类型 异常报告
消息 Request processing failed; nested exception is org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.binding.BindingException: Parameter 'bookID' not found. Available parameters are [param1, bookId]
描述 服务器遇到一个意外的情况，阻止它完成请求。
例外情况
1.添加aop事务支持
<dependency>
<groupId>org.aspectjgroupId>
<artifactId>aspectjweaverartifactId>
<version>1.8.13version>
dependency>
2.在项目结构中也要将这个包加上！！
3.修改一下spring-service.xml
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/tx
http://www.springframework.org/schema/tx/spring-tx.xsd
http://www.springframework.org/schema/aop
https://www.springframework.org/schema/aop/spring-aop.xsd">
<context:component-scan base-package="com.Hao.service" />
<bean id="BookServiceImpl" class="com.Hao.service.BookServiceImpl">
<property name="bookMapper" ref="bookMapper"/>
bean>
<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="*" propagation="REQUIRED"/>
tx:attributes>
tx:advice>
<aop:config>
<aop:pointcut id="txPointCut" expression="execution(* com.Hao.dao.*.*(..))"/>
<aop:advisor advice-ref="txAdvice" pointcut-ref="txPointCut"/>
aop:config>
beans>
提交没有ID不能修改
4.在前端添加隐藏域
<%--出现的问题：提交了修改的SQL请求，但是修改失败，初次考虑，是事务问题，依旧失败！--%>
<%--看一下SQL语句，能否执行成功：SQL执行失败，修改未完成--%>
<%--前端隐藏域--%>
添加一下默认日志，此设置位置在别名的上面
<settings>
<setting name="logImpl" value="STDOUT_LOGGING"/>
settings>
然后还是有异常
类型 异常报告
消息 Request processing failed; nested exception is org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.binding.BindingException: Parameter 'bookID' not found. Available parameters are [param1, bookId]
解决：
当方法中的参数多个时要在*mapper.java中使用@Param修饰参数，当只有一个参数时，Mapper中可以不使用
eg: public Teacher_Course findById(@Param(“teacher_id”)int teacher_id, @Param(“course_name”)String course_name);
注意，与前端页面的交互，出现的问题要注意
刚刚出现一直获取不到值和修改提交的问题，原来是在编写方法的时候，先要有一个获取到页面此行信息的值，第二个方法才是对应这条数据进行修改的
否则后台一直报取不到这个值
而前端jsp的无法解析方法 ‘getBookName’() 问题不大！
最后也要在allBook.jsp中加上这条哦
修改
删除
BookController 类编写 ， 方法四：删除书籍
//删除
@RequestMapping("/deleteBook/{bookId}")
public String deleteBook(@PathVariable("bookId") int id){
bookService.deleteBookById(id);
return "redirect:/book/allBook";
}
在allBook.jsp中加上去
删除
搜索
1.编写dao层接口添加对应的功能
BookMapper
//搜索
Books queryBookByName(@Param("bookName") String bookName);
2.BookMapper.xml中的sql编写
<!--搜索-->
<select id="queryBookByName" resultType="Books">
select * from ssmbuild.books where bookName = #{bookName}
</select>
3.service层
service层的BookService接口添加方法
//搜索
Books queryBookByName(String bookName);
4.BookServiceImpl实现类
@Override
public Books queryBookByName(String bookName) {
return bookMapper.queryBookByName(bookName);
}
5.在BookController.class中编写方法
//搜索
@RequestMapping("/queryBook")
public String queryBook(String queryBookName,Model model){
//接收从前台传入的值
Books books = bookService.queryBookByName(queryBookName);
System.err.println("queryBook=>"+books);
List<Books> list = new ArrayList<Books>();
list.add(books);
//如果传入的值为空，那么跳到全部页面，且输出提示信息
if (books == null){
list = bookService.queryAllBook();
model.addAttribute("error","未查到");
}
model.addAttribute("list",list);
return "allBook";
}
6.在allBook.jsp中添加需要搜索功能对应的按钮组件
<%--查询书籍--%>
记得在合适的位置上添加一个打印错误提示信息的span
这里刚好在修改标签的上面！！
${error}
Ajax
相关博客地址：https://www.cnblogs.com/melodyjerry/p/13562572.html
介绍
AJAX初体验
异步可理解为局部刷新，同步指需要按部就班地完成一整套流程
- AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。
- AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。
- Ajax 不是一种新的编程语言，而是一种用于创建更好更快以及交互性更强的Web应用程序的技术。
- 在 2005 年，Google 通过其 Google Suggest 使 AJAX 变得流行起来。Google Suggest能够自动帮你完成搜索单词。
- Google Suggest 使用 AJAX 创造出动态性极强的 web 界面：当您在谷歌的搜索框输入关键字时，JavaScript 会把这些字符发送到服务器，然后服务器会返回一个搜索建议的列表。
- 就和国内百度的搜索框一样：
- 传统的网页(即不用ajax技术的网页)，想要更新内容或者提交一个表单，都需要重新加载整个网页。
- 使用ajax技术的网页，通过在后台服务器进行少量的数据交换，就可以实现异步局部更新。
- 使用Ajax，用户可以创建接近本地桌面应用的直接、高可用、更丰富、更动态的Web用户界面。
伪造Ajax
我们可以使用前端的一个标签来伪造一个ajax的样子。 iframe标签
- 新建一个module ： sspringmvc-06-ajax ， 导入web支持！
- 编写一个 ajax-frame.html 使用 iframe 测试，感受下效果
DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>kuangshentitle>
head>
<body>
<script type="text/javascript">
window.onload = function(){
var myDate = new Date();
document.getElementById('currentTime').innerText = myDate.getTime();
};
function LoadPage(){
var targetUrl = document.getElementById('url').value;
console.log(targetUrl);
document.getElementById("iframePosition").src = targetUrl;
}
script>
<div>
<p>请输入要加载的地址：<span id="currentTime">span>p>
<p>
<input id="url" type="text" value="https://www.baidu.com/"/>
<input type="button" value="提交" onclick="LoadPage()">
p>
div>
<div>
<h3>加载页面位置：h3>
<iframe id="iframePosition" style="width: 100%;height: 500px;">iframe>
div>
body>
html>