ajax异步请求 初体验

AJAX用于与服务器交换数据，在不加载页面的情况下，实现对部分网页的更新。
下面小例子演示一下效果：

首先在后端准备两个可用的controller做测试，这里我后端用的springboot.

package com.lys.community.controller;

import com.alibaba.fastjson.JSON;
import com.lys.community.entity.DiscussPost;
import com.lys.community.entity.User;
import com.lys.community.service.DiscussPostServiceDao;
import com.lys.community.service.UserServiceDao;
import org.apache.coyote.Request;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import java.util.*;
@Controller
//解决跨域请求
@CrossOrigin
public class DemoController {
    @Autowired
    private UserServiceDao userServiceDao;
    @Autowired
    private DiscussPostServiceDao discussPostServiceDao;

    @RequestMapping("/hello")
    @ResponseBody
    public String hello(Request request) {
        System.out.println(request.getRemoteUser());
        System.out.println(request.remoteAddr());
        return "hello,123";
    }
    
    @RequestMapping(path = "/s", method = RequestMethod.GET)
    @ResponseBody
    public String getStudents(
            @RequestParam(name = "current", required = false, defaultValue = "1") int current,
            @RequestParam(name = "limit", required = false, defaultValue = "10") int limit
    ) {
        System.out.println(current);
        System.out.println(limit);
        User user = new User();
        user.setUsername("小李");
        user.setPassword("123");
        user.setSalts("123");
        user.setEmail("yui");
        System.out.println("收到前端发来请求！！！");
        String s = JSON.toJSONString(user);
        return s;
    }
}

然后书写个简单的前端页面，用来点击按钮触发事件，记得引用jquery库

    
    
    
    
    



    

        

            异步请求1
        
        访问http://localhost:8080/community/hello

        

        

            异步请求2
        
        访问http://localhost:8080/community/s
    

打开服务器，然后打开上面的页面，点击按钮，访问相应的链接，可以看到,有数据返回并显示在页面上。这在页面不需要整体刷新的情况下，就可以访问外部链接。

分析：在上面的前端页面中，ajax()方法用于执行AJAX（异步HTTP）请求，参数url指定了访问的地址，success是如果访问地址成功并有数据返回的时候要执行的函数，在上面的例子中，通过点击按钮访问地址拿到返回的数据并放置到指定的容器中。更详细的说明和用法可以去看文档哦