springmvc 框架下使用restful接口参数数据传输

如前文所说，现在在写的课程设计老师强制你使用restful接口，说是接口，其实是一种规范。关于restful详见我之前的那篇讲述关于前后端分离的帖子，给出传送门。不得不说，在开发完一个模块之后，我仍旧没有体会到太多这种规范带来的好处，貌似唯一的好处是接口变得简单了些，但付出的代价是填了几处坑，而且总是坑在前台的参数传不过来,经常使用的post和get方法都没有问题，put和delete方法出问题了。上网查了一下，是浏览器不支持put,delete等方法，需要加个Filter来将原来的请求转换成标准的http put,delete方法，这样参数的传递就变得正常了。项目是基于SpringMVC的，所以就以此为背景来讲述啦。

1.filter需要加在web.xml中

<!-- 支持GET、POST、PUT与DELETE请求 -->
  <filter>
    <filter-name>hiddenHttpMethodFilter</filter-name>
    <filter-class>org.springframework.web.filter.HiddenHttpMethodFilter</filter-class>
  </filter>

  <filter-mapping>
    <filter-name>hiddenHttpMethodFilter</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>

2.比如说要根据某个表单的内容修改已经存在的记录，则需要在被提交的表单中加一个隐藏的项（name="_method" value="put 或delete二选一"），来指明你真正想用的HTTP METHOD（比如put）,然后用post或get请求向后台提交数据，后台接收请求后会根据这个隐藏的字段将http method做转换。值得注意的是html里的form表单只支持get或post,你不加过滤器做转换不指定隐藏的method，后台一点数据都得不到哟。

a.form表单隐式指定http method

<form class="form-horizontal" id="editForm" role="form">
                    <input type="hidden" name="_method" value="put" />
                    <div class="form-group" hidden="true">
                        <label class="col-sm-2 control-label">编号:</label>
                        <div class="col-sm-6">
                            <input class="form-control" type="text" id="editId" name="id">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">员工工号:</label>
                        <div class="col-sm-6">
                            <input class="form-control" type="text" id="editEmployeeCode" name="employeeCode">
                        </div>
                    </div>
                </form>

b.ajax post方法提交表单

$.ajax({
            url: "/fields/",
            type: 'post',
            data: $("#editForm").serialize(),
            async: false,
            success: function (result) {
                if (result.success) {
                    $("#editModal").modal('hide');
                    swal("Good job!", "修改成功", "success");
                    searchAll();
                } else {
                    sweetAlert("Oops...", result.message, "error");
                }
            },
            error: function (result) {
                sweetAlert("Oops...", "更新失败", "error");
            }
        });

此外我还发现，如果你用ajax发送请求，参数很少且表示在URL里（eg: delete /zoos/id），那么type属性里指定method为delete,则只需要有那个filter就行，否则还是传不了数据哟。

 $.ajax({
                        url: "/fields/"+id,
                        type: 'DELETE',
                        async: false,
                        success: function (result) {
                            if (result.success) {
                                swal("Deleted!", "删除成功.", "success");
                                searchAll();
                            } else {
                                sweetAlert("Oops...", result.message, "error");
                            }
                        },
                        error: function (result) {
                            sweetAlert("Oops...", "操作失败", "error");
                        }
                    });

好啦，暂时这样坑就填过去了。。。希望能帮到大家，自己也能有个印象。。。

如果有收获的话可以扫码侧面的二维码打赏一下哟，感谢您的鼓励~

springmvc 框架下使用restful接口参数数据传输

猜你喜欢