.NetCore WebApi Post请求参数的传递和获取

post请求有两种传递参数的方法,一种是通过在url后面使用问号(?)将参数拼接的方式传递。另一种是通过data传递参数。

get请求只能通过url传递参数,post请求既可以通过url传递参数,也可以通过data(body体)传递参数。可以参考文章:https://www.zhihu.com/question/64312188

以下所有实例都是传递三个参数:title、content、typeid。示例通过两种方式请求后端接口,分别用ajax请求和接口测试工具apipost请求。

第一种通过url传递参数:

前端代码:

<html>

<head>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script type="text/javascript">
    function sendAjax() {
        $.ajax({
            url: "http://localhost:42192/api/BlogNews/Create?title=我是标题啊&content=我是内容啊&typeid=1",
            headers: { 'Content-Type': 'multipart/form-data' },
            type: "post",
            dataType: "json",
            success: function(data) {
                console.log(data);
            }
        });
    }
    </script>
</head>

<body>
    <button id="b01" type="button" onclick="sendAjax()">发送请求</button>
</body>

</html>

后端api接口:

[HttpPost("Create")]
        public async Task<ActionResult<ApiResult>> Create(string title, string content, int typeid)
        {
            try
            {
                BlogNews blogNews = new BlogNews
                {
                    Title = title,
                    Content = content,
                    Time = DateTime.Now,
                    BrowseCount = 0,
                    LikeCount = 0,
                    TypeId = typeid,
                    WriterId = 1
                };

                bool b = await _blogNewsService.CreateAsync(blogNews);
                if (!b)
                {
                    return ApiResultHelper.Error("添加失败,服务器发生错误");
                }
                else
                {
                    return ApiResultHelper.Success(blogNews);
                }
            }
            catch (Exception ex)
            {
                return ApiResultHelper.Error("添加失败,服务器发生错误");
            }
        }

这里的参数是声明了三个变量,分别获取三个参数的值。

ApiPost软件调用示例:

前端ajax请求示例:

 

第二种通过data传递参数:

前端代码:

<html>

<head>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script type="text/javascript">
    function sendAjax() {
        $.ajax({
            url: "http://localhost:42192/api/BlogNews/Create1",
            contentType: "application/json",
            data: JSON.stringify({
                title: "前端请求标题222",
                content: "内容2222",
                typeid: 5
            }),
            type: "post",
            dataType: "json",
            success: function(data) {
                console.log(data);
            }
        });
    }
    </script>
</head>

<body>
    <button id="b01" type="button" onclick="sendAjax()">发送请求</button>
</body>

</html>

后端api接口:

        [HttpPost("Create1")]
        public async Task<ActionResult<ApiResult>> Create1([FromBody]TestClass testClass)
        {
            try
            {
                BlogNews blogNews = new BlogNews
                {
                    Title = testClass.title,
                    Content = testClass.content,
                    Time = DateTime.Now,
                    BrowseCount = 0,
                    LikeCount = 0,
                    TypeId = testClass.typeid,
                    WriterId = 1
                };

                bool b = await _blogNewsService.CreateAsync(blogNews);
                if (!b)
                {
                    return ApiResultHelper.Error("添加失败,服务器发生错误");
                }
                else
                {
                    return ApiResultHelper.Success(blogNews);
                }
            }
            catch (Exception ex)
            {
                return ApiResultHelper.Error("添加失败,服务器发生错误");
            }
        }
    public class TestClass {
        public string title { get; set; }
        public string content { get; set; }
        public int typeid { get; set; }
    }

这里后端接口在参数接收的时候需要声明FromBody,表示该参数值应该从请求的Body中获取,而不是从URL中获取。同时声明了一个类TestClass,参数通过对象的形式接收。

ApiPost软件调用示例:

 前端ajax请求示例:

 

猜你喜欢

转载自blog.csdn.net/liangmengbk/article/details/121666756