中软国际实习第七天-Ajax使用

Ajax使用

Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。Ajax 是一种用于创建快速动态网页的技术。Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 Ajax）如果需要更新内容，必须重载整个网页页面。下面就Ajax的使用流程进行说明：
(1)在webapp下导入js包
(2)在header中加入引用声明

（3）在页面中加入对js的调用
表单中复选框设置name为ids,value为userInfo.id，用于给函数传参

给“批量删除”按钮增加对deleteAll函数的调用

    批量删除

（4）在header中增加对函数的具体实现
其中@ResponseBody为声明返回JSON字符串给前端

@RequestMapping("/deleteAll.do")
@ResponseBody
public String deleteAll(String userList){
    String[] strs = userList.split(",");
    List ids = new ArrayList<>();
    for(int i = 0; i < strs.length; i++){
        ids.add(Integer.parseInt(strs[i]));
    }
    userInfoService.deleteAll(ids);
    return "";
}

（5）分别进行持久层、服务层和控制层的实现
// 持久层接口

void deleteAll(List ids);
// mapper文件实现

    delete from userinfo where id in
        
            #{id}
        

//服务层实现

@Override
public void deleteAll(List ids) {
    userInfoDao.deleteAll(ids);
}

// 控制层实现

@RequestMapping("/deleteAll.do")
@ResponseBody
public String deleteAll(String userList){
    String[] strs = userList.split(",");
    List ids = new ArrayList<>();
    for(int i = 0; i < strs.length; i++){
        ids.add(Integer.parseInt(strs[i]));
    }
    userInfoService.deleteAll(ids);
    return "";
}

（6）效果展示

使用Spring Security进行授权和认证

（1）使用认证来显示用户信息

   

      
   
    在线

（2）使用权限来对视图进行管理，有权限的用户可以看到“用户管理”模块

     用户管理
   

get请求与post请求

get请求：
实例：查询，获取用户信息
特点：传参显示在URL中，常用于获取信息而非修改信息
缺陷：由于传参是后缀在URL中一起发送，因此传参内容收到URL长度的限制，此外也会有一定的安全问题。

post请求：
实例：表单数据发送，更新用户信息
特点：放在HTTP的包中发送，不会显示在URL中，POST的内容是没有长度限制的。常用于修改资源。

参考资料

[1].https://baike.baidu.com/item/ajax/8425
[2].https://www.cnblogs.com/hyddd/archive/2009/03/31/1426026.html