AJAX技术分析师,Ajax技术应用

Ajax是什么

Ajax是一种web应用技术，可以借助就客户端脚本与服务端应用进行异步通讯(可以有多个线程同时与服务器交互)，获取服务端数据以后，可以根据需求(按需)进行局部刷新。进而提高数据的响应和渲染速度。

Ajax技术最大的优势：底层异步，局部按需刷新，应用场景：商品系统。

评价系统。

地图系统。

…

Ajax技术最大的劣势：不能直接进行跨域访问，可以通过在对应的方法上添加@CrossOrigin注解描述让其间接地支持跨域访问

Ajax请求响应过程分析(时序图解)

Ajax入门代码分析及实现

Ajax编码的步骤？

重点是Ajax技术的入口-XMLHttpRequest-XHR对象

第一步：基于dom事件创建XHR对象var xhr=new XMLHttpRequest();

第二步：在XHR对象上注册状态监听(监听客户端与服务端的通讯过程)xhr.onreadystatechange=function(){

if(xhr.readyState==4&&xhr.status==200){

console.log(xhr.responseText)

}

}

第三步：与服务端建立连接(指定请求方式，请求url,同步还是异步)xhr.open("GET",url,true);

第四步：发送请求(将请求数据传递服务端)xhr.send(null);

Ajax技术在JS中的代码实现注意事项总结

1.在使用"GET"和"Delete"发送请求时，方法内部是不需要传数据或者写一个null，具体代码如下：xhr.send(null);

2.在使用"Post"和"Put"发送请求时，需要将数据写入到send方法内部，具体代码如下：xhr.send("id=101&name=Computer&remark=Computer...");

3.在使用"Post"和"Put"向服务端传递数据时，需要设置请求头,必须在open之后，代码如下：xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

4.获取请求参数时出现中文乱码问题：

在获取中文的请求参数时，可能会出现乱码问题(和请求方式、tomcat服务器版本有关)，具体可以分为以下三种情况：

(1)如果请求是GET提交，并且tomcat是8.0及以后的版本，GET提交的中文参数，在获取时不会出现乱码问题！(8.0以后的to mcat包括8.0在获取GET提交的中文参数时，已经处理中文乱码问题。)

(2)如果请求是POST提交，不管是哪个版本的tomcat服务器，在获取中文参数时，都会出现乱码问题。因为tomcat底层在接收POST提交的参数时，默认会使用iso8859-1编码接收，而这个编码中没有中文字符，所以在接收中文参数时，一定会出现中文乱码问题！

解决方法是：通知服务器在接收POST提交的参数时，使用utf-8编码来接收!

代码实现：

request.setCharacterEncoding("utf-8");

注意：这行代码不会影响GET提交，只对POST提交有效！

这行代码要放在任何获取参数的代码之前执行！

(3)如果请求是GET提交，并且tomcat是7.0及以前的版本，GET提交的中文参数，在获取时会出现乱码问题！

解决方法：在[tomcat安装目录]/ conf/server.xml文件的(修改端口的)Connector标签上，添加一个 URIEncoding="utf-8" 属性，如下：

redirectPort="8443"

URIEncoding="utf-8" />

同时在[Eclipse]/Servers/[当前tomcat服务器对应的配置目录]/server.xml文件中，在Connector标签上，添加一个 URIEncoding="utf-8" 属性，同上！

SpringBoot 项目Ajax技术应用入门分析

第一步：创建项目Module；

第二步：添加Spring web依赖，代码如下：

org.springframework.boot

spring-boot-starter-web

第三步：创建AjaxController处理客户端请求,代码如下：package com.cy.pj.ajax.controller;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.RestController;

@RestController

public class AjaxController {

@RequestMapping("/doAjaxStart")

public String doAjaxStart(){

return "Response Result Of Ajax Get Request 01 ";

}

}

第四步：在项目中static目录下,创建一个页面ajax-01.html,代码如下:

springboot中的Ajax技术应用及代码实现

业务描述

在项目中static目录下，创建一个页面ajax-01

待补充..