前端实现RESTful风格的两种方法: 使用ajax 和使用隐藏_method

最新推荐文章于 2025-05-23 11:57:32 发布

原创最新推荐文章于 2025-05-23 11:57:32 发布 · 2.4k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#restful #ajax #_method #html #前端

java 同时被 2 个专栏收录

53 篇文章

订阅专栏

4 篇文章

订阅专栏

本文介绍如何通过两种方式实现RESTful风格的HTTP请求：使用Ajax发送PUT等非标准HTTP方法及利用表单中的隐藏字段_method来改变请求类型。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

现在推崇用RESTful的风格来使用http请求, 但是原生的form表单往往只支持GET和POST两种方式, 为了实现其他的比如PUT DELETE PATCH之类的请求, 就要做一些骚操作了;

我所知道比较常用的有两种方法:

一.使用ajax发送请求

比如我的页面中有一个名为nform的表单, 要以提交一个表项的更新内容, 那么我需要用PUT的方式发送这个请求, 我就可以设置在按下submit按钮的时候, 向服务器端发一个ajax请求, 把type设置为PUT即可;

            $("#submit").click(function () {
                $.ajax({
                    url: "ajaxPUT",
                    type: "PUT",
                    data:$('#nform').serialize(),
                    cache:false,
                    dataType: "json",
                    success: function(data){
                        alert(data);
                    },
                    error:function(err){

                    }
                });
            });

二.在表单中用隐藏的_method来设置请求

这也是我最先学会的方法, 感觉真心好用-.-
比如现在有我下面这样的一个表单要提交, 用于update一个内容, 虽然我在form的method中设置了post方法, 但我在表单内容中加了一行:

<input type="hidden" name="_method" value="PUT"/>

这样浏览器在识别到我的表单中有一个名为_method的hidden的这一项时, 就会把请求转换为PUT发送给服务器; 我们只需要用type="hidden"把这一行藏起来就好啦~

<form action="../Category" method="post">
    <input type="hidden" name="_method" value="PUT"/>
    <span>NAME</span>
        <input type="text" class="form-control" name="name" th:value="${c.name}">
        <input th:value="${c.id}" type="hidden" name="id">
        <button type="submit">Submit</button>
</form>