Restful

  • Restful架构:即Representational State Transfer的缩写，词组的翻译是"表现层状态转化"。
    • "资源"是一种信息实体，它可以有多种外在表现形式。我们把"资源"具体呈现出来的形式，叫做它的"表现层"（Representation）。
    • 使用WEB标准来做一些准则和约束。符合REST原则，就称它为RESTful架构。
    • 基本概念：
      • 在Rest中，一切的内容都被认为是一种资源。每个资源都由特定的URI唯一标识。
      • 户端通过四个HTTP动词(POST/GET/PUT/DELETE)，对服务器端资源进行操作，实现"表现层状态转化"。
      • 无状态(每次请求不相关)。
  • POST请求：
    • 前端Ajax：
    • <script>
                
        layui.use(['form', 'layer','jquery'],
            function() {
                $ = layui.jquery;
                var form = layui.form,
                layer = layui.layer;

                //监听提交
                form.on('submit(add)',
                function(data) {
                    $.ajax({
                        type: 'POST',
                        dataType: 'json',
                        url: '/rest/user',
                        contentType: "application/json",
                        data : JSON.stringify(data.field),
                        success: function (msg) {
                            if(msg.users.length>0){
                                parent.layer.msg('添加成功!', { icon: 1, time: 1000 }, function () {
                                    parent.$('.btn-refresh').click();
                                    parent.location.reload(); //刷新父页面
                                    var index = parent.layer.getFrameIndex(window.name);
                                    parent.layer.close(index);
                                });
                            }else{
                                 layer.msg("Error:" + msg, { icon: 5, time: 1000 });
                            }
                        },
                        error:function (msg) {
                            layer.msg('error!', { icon: 1, time: 1000 });
                        }
                    });
                    return false;
                });

            });
        </script>
      View Code
    • 后端Controller：
    • @PostMapping("/user")
    @ApiOperation(value="创建用户", notes="根据User对象创建用户")
    @ApiImplicitParam(name = "user", value = "用户详细实体user", required = true, dataType = "User")
    public ResponseUserVo insertUser(@RequestBody User user)  {
        log.warn(user.toString());
        userDao.addUser(user);
        List<User> users=userDao.selectAll();
        return new ResponseUserVo(users.size(),1, PageUtil.getPageByList(users,1,2));
    }
      View Code
  • GET请求：
    • 前端Ajax：
    • function getUserInfo(curr){
         $.ajax({
            type: 'GET',
            dataType: 'json',
            url: '/rest/user',
            data: {
                curr: curr || 1,
                limit: 4
            },
            contentType : 'application/x-www-form-urlencoded',
            success: function (msg) {
              vm.sites = msg.users;
              //layui分页
              layui.use('laypage',function(){
                  var laypage=layui.laypage;
                  //执行一个laypage实例
                        laypage.render({
                            elem:'paging',//
                            count:msg.count,//数据总数,从服务器得到
                            limit:4,//一页展示多少条数据
                            curr:msg.curr,//当前页
                            theme:'#4e66f1',
                            jump:function(obj,first){//jump就是 点击上一页或者下一页触发函数自身
                                if(!first){//设置首次渲染分页无需走业务逻辑处理函数,不然会陷入死循环
                                    //查看全部
                                  getUserInfo(obj.curr);
                                }
                            }
                        });
              });
            },
            error:function (msg) {
                alert("失败");
            }
        });
      }
      View Code
    • 后端Controller：
    • @GetMapping("/user")
    @ApiOperation("查看用户")
    public ResponseUserVo getUserByPage(@RequestParam int limit,@RequestParam int curr)  {
        log.warn("每页大小："+limit+"当前页:"+curr);
        List<User> users=userDao.selectAll();
        System.out.println(users.size());
        return new ResponseUserVo(users.size(),curr,PageUtil.getPageByList(users,curr,limit));
    }
      View Code
  • PUT请求：
    • 前端Ajax：
    • <script>
            layui.use(['form', 'layer'],function() {
                $ = layui.jquery;
                var form = layui.form,layer = layui.layer;
                //监听提交
                form.on('submit(update)',
                function(data) {
                    //发异步，把数据提交给php
                    $.ajax({
                        url:'/rest/user/'+data.field.openId,
                        method:'PUT',
                        dataType:'JSON',
                        data:{
                            openId:data.field.openId,
                            url:data.field.url,
                            name:data.field.name
                        },
                        contentType : 'application/x-www-form-urlencoded',
                        success:function(res){
                            if(res.code=200){
                                parent.layer.msg('修改成功!', { icon: 1, time: 1000 }, function () {
                                    parent.$('.btn-refresh').click();
                                    parent.location.reload(); //刷新父页面
                                    var index = parent.layer.getFrameIndex(window.name);
                                    parent.layer.close(index);
                                });
                            }else {
                                layer.alert(res.msg, {
                                    icon: 6
                                },function() {
                                    // 获得frame索引
                                    var index = parent.layer.getFrameIndex(window.name);
                                    //关闭当前frame
                                    parent.layer.close(index);
                                });
                            }
                        },
                        error:function (data) {
                            layer.msg('error!', { icon: 1, time: 1000 });
                        }
                    }) ;
                    return false;
                });

            });
        </script>
      View Code
    • 后端Controller：
    • @PutMapping("/user/{opid}")
    @ApiOperation(value = "更新操作",notes = "单个更新")
    public Response editUser(@PathVariable String opid,@RequestParam("openId") String openId,@RequestParam("url") String url,@RequestParam("name") String name){
        log.warn("name :"+name+"openId:"+openId+"url:"+url+"opid:"+opid);
        User user=userDao.selectById(opid);
        if(user!=null){
            user.setName(name);
            user.setUrl(url);
            userDao.updateUser(user);
            return new Response(200,"ok");
        }else{
            return new Response(201,"error");
        }
    }
      View Code
  • DELETE请求：
    • 前端Ajax：
    • /*用户-删除*/
            member_del:function (openId){
                layer.confirm('确认要删除吗？',function(){
                    $.ajax({
                        type: 'DELETE',
                        dataType: 'json',
                        url: '/rest/user/'+openId,
                        success: function (msg) {
                          vm.sites = msg.users;
                          layer.msg('已删除!',{icon:1,time:1000});
                          getUserInfo();
                        },
                        error:function (msg) {
                            layer.msg('删除失败!',{icon:1,time:1000});
                        }
                    });
                });
            }
      View Code
    • 后端Controller：
    • @DeleteMapping("/user/{openId}")
    @ApiOperation(value = "删除操作" ,notes = "根据openId删除")
    @ApiImplicitParam(name = "openId",value = "openId删除",required = true,dataType = "String")
    public ResponseUserVo delUser(@PathVariable String openId)  {
        log.warn("删除openId:"+openId);
        userDao.delUser(openId);
        List<User> users=userDao.selectAll();
        return new ResponseUserVo(users.size(),1,PageUtil.getPageByList(users,1,2));
    }
      View Code
  • @ApiImplicitParam：作用在方法上，表示单独的请求参数 。
@ApiImplicitParam(name = "openId",value = "openId删除",required = true,dataType = "String")
    • 参数：
    1. name ：参数名。
    2. value ： 参数的具体意义，作用。
    3. required ： 参数是否必填。
    4. dataType ：参数的数据类型。
    5. paramType ：查询参数类型（可以不用），这里有几种形式： 
      path    以地址的形式提交数据
query  直接跟参数完成自动映射赋值
body    以流的形式提交 仅支持POST
header 参数在request headers 里边提交
form    以form表单的形式提交 仅支持POST
  • Ajax中关于contentType : "application/x-www-form-urlencoded;charset=UTF-8"与contentType: "application/json"的用法：
    • 用contentType : "application/x-www-form-urlencoded"的话，在后端使用@RequestParam注解去修饰接口中对应Ajax中的data数据。
      • @RequestParam：它的作用等同于HttpServletRequest request，request.getParameter("")，使用这个注解去获取data中的json对象属性值。
    • 用contentType: "application/json"的话，后端使用@RequestBody注解去修饰接口中的对象。
      • @RequestBody：接受的是一个json对象的字符串，而不是Json对象，在请求时往往都是Json对象，用JSON.stringify(data)的方式就能将对象变成json字符串。
  • @PathVariable：是spring3.0的一个新功能：接收请求路径中占位符的值。 
    @PutMapping("/user/{openId}") 
    @ApiOperation(value     = "更新操作",notes = "单个更新") 
    public Response editUser(@PathVariable String openId,@RequestParam("url") String url,@RequestParam("name") String name){ 
    }
    • 通过 @PathVariable 可以将URL中占位符参数{xxx}绑定到处理器类的方法形参中@PathVariable(“xxx“)。
【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/LJing21/p/11477648.html