asp.net 核心 api PUT 请求从不命中方法

asp.net core api PUT request never hits method

我正在尝试在 asp.net 中创建网站 api。我正在尝试使用 ajax 将我的查询参数发送到操作方法,但它永远不会到达它。仅供参考,我在 ajax.

方面经验不足

我试图在我的视图中使用一个表单将数据传递给操作方法,但它什么也没做。这是我的观点:

<form action="/api/values" method="put">
    <ul>
        <li>
           <input type="text" id="Id" />
        </li>
        <li>
           <input type="text" id="FirstName" />
        </li>
        <li>
           <button onclick="Update()" class="btn btn-primary">Update</button>
        </li>
    </ul>
</form>

这是我的 ajax:

<script>
    function Update(Id, FirstName) {
       $.ajax({
           url: "/api/values/" + Id + "/" + FirstName,
           type: "PUT",
           data: {
             Id: Id,
             FirstName: FirstName
           },
           success: function () {
              alert("success");
           }
       )};
    }
</script>

我的 url 看起来像:/api/values?Id=123XXXjxn&FirstName=Billy

这永远不会到达我的控制器:

[HttpPut("{Id}/{FirstName}")]
public ActionResult PutRequest([FromQuery] string Id, [FromQuery] string FirstName)
{
    //do stuff
}

我试过仅使用 [HttpPut] 属性,并使用了 [Route("{Id}/{FirstName}")] 属性,但参数中没有 [FromQuery]。我被卡住了,我认为这与我的 ajax 有关,而且我的方法无法读取查询参数,但我不确定。

您的控制器代码应如下所示

[Route("api/values")]
public class ValuesController : Controller
{
    [Route("~/api/values/{Id}/{FirstName}")]
    public ActionResult PutRequest(string Id, string FirstName)
    {
       .......
    }
}
Your url shood look like: /api/values/123XXXjxn/Billy

javascript

的变化
type: "PUT",
data: {

             Id: Id,
             FirstName: FirstName
           },

type: "POST",
data: null,

并检查你是否有 app.UseRouting();在启动文件的配置部分。

您的代码应如下所示

控制器

[Route("api/values")]
public class ValuesController : Controller
{
    [HttpPut("{Id}/{FirstName}")]
    public ActionResult PutRequest(string Id, string FirstName)
    {
        return new EmptyResult();
    }
}

查看

<script>
    function Update(Id, FirstName) {
       $.ajax({
           url: "/api/values/" + Id + "/" + FirstName,
           type: "PUT",
           success: function () {
              alert("success");
           }
       });
    }
</script>

既然你做了 ajax 调用,你不需要表单属性,防止使用 event.preventDefault()

导航到 url
<script>
    function Update(Id, FirstName) {
        event.preventDefault();

        $.ajax({
            url: "/api/values/" + Id + "/" + FirstName,
            type: "PUT",
            success: function () {
                alert("success");
            }
        });
    }
</script>

<form>
    <ul>
        <li>
            <input type="text" id="Id" />
        </li>
        <li>
            <input type="text" id="FirstName" />
        </li>
        <li>
            <button type="button" onclick="Update()" class="btn btn-primary">Update</button>
        </li>
    </ul>
</form>

当然,您需要 jquery 的某个版本。您可以获得最新的 here

<script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>