关于Ajax的几种请求格式

1.0 Ajax是什么？

        ajax是一种浏览器通过js异步发送请求，局部更新页面的一种技术。就像微信朋友圈，你去给朋友圈朋友作品点赞，然后会看到自己点赞信息，而整个页面其它信息不变，只更新自己对该朋友圈点赞。

        Ajax请求的局部更新，浏览器地址不发生改变。局部更新不会改边原来的内容。

2.0 几种请求格式？

$.ajax 方法

        url         表示请求的地址

        type      表示请求的类型 GET 或 POST 请求

        data      表示发送给服务器的数据

                格式有两种：

                一：name=value&name=value

                二：{key:value}

        success  请求成功，响应的回调函数

        dataType 响应的数据类型

                常用的数据类型有：

                text 表示纯文本

                xml 表示 xml 数据

                json 表示 json 对象（常用）

        第一种请求格式

<script src="js/jquery-3.4.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">

    $.ajax({
        type: "get",  //请求方式 也可以是post请求
        url: "http://localhost:8088/login",  //请求路径
        data: {                     //请求数据
                username: "zhangsan",
                password: "1234"
              },
        dataType: "JSON",   //返回数据类型
        success:function(data){    //请求成功响应函数
                console.log(data)
                }

    })

</script>

        第二种请求格式

<script src="js/jquery-3.4.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">

    //$.get("url","请求参数data","请求成功的响应")
    $.get("http://localhost:8088/login",{username: "zhangsan",password: "1234"},function(data){
        console.log(data)
    },"json")
    //$.post("url","请求参数data","请求成功的响应")
    $.post("http://localhost:8088/login",{username: "zhangsan",password: "1234"},function(data){
        console.log(data)
    },"json")

</script>

3.0 get和post有什么不同

        1. get请求格式 /action+？参数名=参数值&参数名=参数值 安全性较差有长度限制，post的请求格式/action 请求参数在body中没有长度限制。

        2. get请求一般都会自动缓存到本地，post只有主动设置才会缓存到本地。get请求会被保存

            在浏览器历史记录当中，post不会。

        3. get请求回退或者刷新没有影响，post则会再一次发送请求。

       4. get和post都是http请求，通常情况下get产生一个tcp数据包，post产生两个tcp数据包给服

        务器。get发送将header和data一起发送，成功返回200，post则是先发送header成功返回100之后才会发送data给服务器。

4.0 ajax使用种常见的问题

  4.1 响应到前端中文乱码

        在响应之前要先设置响应格式

         //设置响应格式
        response.setCharacterEncoding("utf-8");

 5.0 ajax和springMvc交互的过程

        因为响应数据要是json格式，使用的json转化工具，这里要不采用fastjson，这里使用jackjson

    <!--jackson相关依赖 Springmvc@responsBody注解使用jackSon-->
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.11.3</version>
    </dependency>

  其实就是ajax发送异步请求给controller，处理之后返回数据转化为json格式采用注解@ResponseBody返回json数据给success函数。