ASP.NET (Core)WebApi接收参数

一、ASP.NET (Core)WebApi参数传递实操演练

1、什么是contentTypedataType

$.ajax contentTypedataType , contentType 主要设置你发送给服务器的格式,dataType设置你收到服务器数据的格式。

更简单的解释:
contentType: 告诉服务器,我要发什么类型的数据。
dataType:告诉服务器,我要想什么类型的数据。

http 请求中,getpost 是最常用的。在 jquery 的 ajax 中, contentType都是默认的值:application/x-www-form-urlencoded,这种格式的特点就是,name/value 成为一组,每组之间用 & 联接,而 namevalue 则是使用 = 连接。如:wwwh.baidu.com/q?key=fdsa&lang=zh 这是get , 而 post 请求则是使用请求体,参数不在 url 中,在请求体中的参数表现形式也是: key=fdsa&lang=zh的形式。

键值对这样组织在一般的情况下是没有什么问题的,这里说的一般是,不带嵌套类型JSON,也就是 简单的JSON,形如这样:

{a:1,b:2,c:3}

但是在一些复杂的情况下就有问题了。例如在 ajax 中你要传一个复杂的 json 对像,也就说是对象嵌数组,数组中包括对象,如果你这样传:

{data: {a: [{x:2}]  }}

这个复杂对象,application/x-www-form-urlencoded 这种形式是没有办法将复杂的 JSON 组织成键值对形式(当然也有方案这点可以参考) ,你传进去可以发送请求,但是服务端收到数据为空, 因为 ajax 没有办法知道怎样处理这个数据。

这怎么可以呢?

聪明的程序员发现 http 还可以自定义数据类型,于是就定义一种叫 application/json 的类型。这种类型是 text , 我们 ajax 的复杂JSON数据,用 JSON.stringify序列化后,然后发送,在服务器端接到然后用 JSON.parse 进行还原就行了,这样就能处理复杂的对象了。

$.ajax({ 
dataType: 'json', 
contentType: 
'application/json', 
data: JSON.stringify({a: [{b:1, a:1}]}
)})

2、什么是参数绑定(Parameter Binding)?

Asp.NET Web API中Controller是如何解析从客户端传递过来的数据,然后赋值给Controller的参数的,也就是参数绑定或者模型绑定。

常见的绑定方式有如下四种。

  1. 路由值(Route Values):通过导航到路由如{controller}/{action}/{id}此时将绑定到id参数。
  2. 查询字符串(QueryStrings):通过查询字符串中的参数来绑定,如name=Jeffcky&id=1,此时nameid将进行绑定。
  3. 请求Body(Body):通过在POST请求中将数据传入到Body中此时将绑定如上述Person对象中。
  4. 请求Header(Header):绑定数据到Http中的请求头中,这种相对来说比较少见。

所以通过上述讲述我们知道有多种方式将数据从客户端传递到服务端,然后模型绑定会自动为我们创建正确的方法来绑定到后台参数中,简单和复杂的类型参数都会进行绑定。

3、ASP.NET WebAPI中FromUriFromBody两类特性区别

1)、【FromUri】特性

应用【FromUri】特性,Web API Action中参数将从URL中解析数据。

查询字符串(QueryStrings):通过查询字符串中的参数来绑定,如name=Jeffcky&id=1,此时nameid将进行绑定,对应WebAPI中媒体

类型格式化器JsonMediaTypeFormatter,对应的content-type是:application/json

2)、【FromBody】特性

应用【Frombody】特性,Web API Action中参数将从请求体(Request Body),并且通过媒体类型格式化器获取和绑定数据。

请求Body(Body):通过在POST请求中将数据传入到Body中此时将绑定如上述Person对象中,对应WebAPI中媒体类型格式化器

FormUrlEncodedMediaTypeFormatter,对应的content-type是:application/x-www-form-urlencoded

注意:对多个参数使用FromBody不起作用!!!

二、实战运用(PS:一般这几种场景就能够满足我们实际开发工作需要了)

1、ASP.NET WebApi参数传递实操演练

在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述

2、ASP.NET Core WebApi参数传递实操演练

在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述

三、总结

其实说了这么多,简单类型绑定和复杂类型绑定在本质上没什么太大的区别,真正的区别在于数据绑定是通过GET请求还是POST请求 。
说白了就是【FromUri】特性和【FromBody】特性之间的区别。

FromUri】和【FromQuery】 :一般用与单个简单类型的参数。

FromBody】 :一般用于将多个简单类型的参数打包成一个复杂对象类型的参数 。

注意:对多个参数使用FromBody不起作用,即也就是说,[FromBody] 修饰的参数只能有一个。


.NetCore WebApi传输参变化

.NetCore 的 WebApi,一般以前的mvc5,继承自 ApiController ,则是WebApi,采用独有的管道处理模型,再Core中,一般是 继承自 ControllerBase,控制器类上标注 [ApiController]

1.前端代码

//NetCoreWebApi中,传输 application/json; 格式的,后端无需加[FormBody]也能拿到值
$.ajax({
 type: "post",
   url: "/api/WebApi/ww",
   data: JSON.stringify( { a: 1, b: 2,c: 4,"yy":99,"bb":"匹配"} ),  //如果没有序列化,后端获取不到,序列化了,WebApi不需要加 FormBody,能拿到值,contentType: "application/json;charset=utf-8"//不加上 默认不是表单的那种也不是json那种
    contentType: "application/x-www-form-urlencoded",//这个类型无法指定
    data: { a: 1, b: 2,c: 4,"yy":99,"bb":"匹配"},
})

2.后端代码

 [HttpPost]
[Route("ww")]
 public string Po(KJ k, int yy, string bb)
 {
     //k null
     //yy 0
     //b  null
 }

3.结论:

因为前端指定了,传输类型为,"application/x-www-form-urlencoded",就算不写contentType,它的默认值也是“application/x-www-form-urlencoded”,但是指定失败
最后的请求格式:application /problem+json; charset=utf-8
报错为:415
解决:指定为 json传输,序列化后传输,后端就可以拿到值 (可以不用[FormBody]),核心都在传输的 contentType

[HttpPost]
[Route("E3")]
public string fdasfs([BindAttribute(include: "a,b")] [FromBody] KJ p, int r = 0)
{
 //******************.Net Core Mvc WebApi的post的使用**************************/
 //1.前端指定的application/json,传输json数据,不管有没有[FromBody]都可以拿到值
   /*2.前端指定的application/x-www-form-urlencoded,传输json数据或者json对象,失败,
     *明明设置了传输类型,但是却成了 application /problem+json; charset=utf-8,导致请求失败
     3.如果传入的除了一个实体,还有其他参数,那就都绑定不上 都没有拿到值 
      前端是这样的:{user: {a: 1, b: 9}, r: 99} 就是不行的,
      {a: 1, b: 9}可行的
       必须整成一个实体
       /* var json = { user: { a: 1, b: 9,  }, r: 99 };
$.ajax({
   url: "/api/mm/E3",
   type: "post",
   //contentType:"application/x-www-form-urlencoded",//写成这种,写了也白写,最终传输类型被覆盖
   contentType:"application/json",
   data:JSON.stringify(json)
}); *//* 4.NetCore的 BindAttribute特性 在  contentType:"application/json 不起作用,不能绑定指定的属性,在
  contentType:"application/x-www-form-urlencoded  表单中完全可以,过滤掉不需要的属性
   FormData    
    a:1
    b:9
    */
   return "OK";
}
  • 3
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: dropzone.js 是一个非常流行的文件上传库,可以方便地在网页中实现文件拖拽上传的功能。而 ASP.NET Core WebAPI 是一个用于构建 Web API 的框架,可以快速地开发和部署具有高性能和可伸缩性的 Web API。 要在 ASP.NET Core WebAPI 中集成 dropzone.js,首先需要在前端代码中引入 dropzone.js 相关的脚本和样式文件。然后,在页面中创建一个用于接收文件上传的表单,并将其配置为使用 dropzone.js 进行文件上传。可以通过配置一些参数来自定义上传行为,例如设置文件上传的最大数量、文件大小限制、文件类型限制等。 在后端代码中,需要创建一个用于处理文件上传的 API 接口,该接口会接收前端发起的文件上传请求,并将上传的文件保存到指定的位置。可以使用 ASP.NET Core WebAPI 提供的 HttpRequest 对象来处理文件上传,通过读取请求的文件流来获取上传的文件内容,并将文件保存到指定的文件夹中。 在接收到文件上传请求后,需要进行一些验证和处理操作。例如,可以检查文件大小和类型是否符合要求,并根据需求进行相应的文件处理,例如修改文件名称、生成缩略图、写入数据库等。处理完成后,可以通过 API 接口返回相应的结果,例如返回上传成功的消息或返回上传失败的原因。 总结来说,使用 dropzone.js 和 ASP.NET Core WebAPI 可以很方便地实现文件上传功能。前端使用 dropzone.js 实现文件拖拽上传,后端使用 ASP.NET Core WebAPI 接受并处理上传的文件。通过结合使用这两个工具,可以轻松地实现一个功能强大且易于维护的文件上传功能。 ### 回答2: dropzone.js是一个基于JavaScript的文件上传库,它可以与asp.net core webapi配合使用来进行文件上传的处理。在使用dropzone.js时,我们需要引入相关的JavaScript和CSS文件,并建立一个HTML表单元素作为文件上传的区域。 在asp.net core webapi中,我们可以编写一个控制器来处理文件上传的请求。首先,我们需要在控制器中添加一个HttpPost方法,用于接收从前端传递过来的文件数据。然后,我们可以使用IFormFile接口来接收和处理上传的文件。 具体的实现步骤如下: 1. 在前端的HTML中,我们需要引入dropzone.js的相关文件,并在表单中定义一个用于文件上传的区域。可以设置一些参数来自定义文件上传的行为。 2. 在asp.net core webapi的控制器中,添加一个HttpPost方法,并使用[FromForm]特性将上传的文件绑定到IFormFile类型的参数中。 3. 在HttpPost方法中,可以对上传的文件进行处理,比如保存到服务器指定的路径中、返回文件的信息等。 主要的代码示例如下: 前端HTML代码: ```html <form action="/api/upload" class="dropzone" id="my-dropzone"></form> ``` 前端JavaScript代码: ```javascript Dropzone.options.myDropzone = { url: "/api/upload", maxFiles: 10, maxFilesize: 5, acceptedFiles: ".pdf,.jpg,.png", init: function () { this.on("success", function (file, response) { console.log("File uploaded:", file); }); }, }; ``` 后端C#代码: ```csharp [ApiController] [Route("api/[controller]")] public class UploadController : ControllerBase { [HttpPost] public async Task<IActionResult> UploadFile([FromForm] IFormFile file) { // 对上传的文件进行处理,比如保存到指定路径中 if (file != null && file.Length > 0) { var filePath = Path.Combine("path/to/save", file.FileName); using (var stream = new FileStream(filePath, FileMode.Create)) { await file.CopyToAsync(stream); } } return Ok(new { message = "File uploaded successfully." }); } } ``` 通过以上代码,我们可以在前端页面中使用dropzone.js来实现文件的上传,并在后端的asp.net core webapi中编写相应的控制器来处理上传的文件。这样就可以实现一个基于dropzone.js和asp.net core webapi的文件上传功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值