通过 angularjs http 请求在 JSON 正文中发送 byteArray答案

【问题标题】：sending byteArray in a JSON body via angularjs http request通过 angularjs http 请求在 JSON 正文中发送 byteArray
【发布时间】：2018-04-30 17:41:30
【问题描述】：

我想发送一个post请求，其中请求的主体是一个包含两个属性的JSON，其中一个是使用fabricjs生成的画布信息，第二个是项目缩略图的byteArray。问题是，当我发送请求时，我在服务器端收到null。

var dataURI = this.getDataUrl($rootScope.imageType, $rootScope.imageQuality);
var strImage = dataURI.replace(/^data:image\/[a-z]+;base64,/, "");
var byteArray = covertBase64ToByteArray(strImage);

var data = {
  data: {
    name: name,
    state: canvas.fabric.toJSON(['selectable', 'name']),
    zoom: canvas.zoom,
    canvasWidth: width,
    canvasHeight: height,
  },
  typeArray: byteArray
};

$http({
  method: "POST",
  url: _url,
  data: JSON.stringify(data),
  processData: false,
  transformRequest: [],
  contentType: 'application/json',
})

.Net 中的后端代码

public IHttpActionResult InsertOrUpdateUILayout(long user_Id, long layout_Id, int userLayout_Id, int? layoutType_Id, UserlayoutContentVM data)
{
    // back end code here
}

public class UserlayoutContentVM
{
    public object data { get; set; }
    //public string base64Image { get; set; }
    public byte[] typeArray{ get; set; }      
}

【问题讨论】：

请分享后台api代码
@MarcusHöglund 完成

标签： angularjs httprequest

【解决方案1】：

将数据发布到后端 api 时，您需要告诉方法从请求正文中读取数据。这可以通过FromBody 属性来完成，该属性会将主体数据映射到定义模型。

所以将所有属性添加到一个模型中

public class UserlayoutContentVM
{
    public long user_Id { get; set; }
    public long layout_Id { get; set; }
    public int userLayout_Id { get; set; }
    public int? layoutType_Id { get; set; }
    public object data { get; set; }
    public byte[] typeArray{ get; set; }
}

然后确保客户端以相同的结构发送所有数据，并使用控制器方法中的 FromBody 属性来读取值

public IHttpActionResult InsertOrUpdateUILayout([FromBody]UserlayoutContentVM data){ }

【讨论】：