如何将结构化数据作为 HTTP GET 请求的参数?

How to include structured data as a parameter of a HTTP GET request?

我想将结构化数据作为参数包含在我的 HTTP GET 调用中,并且我认为我已经正确设置了它,但是我的 API 没有像我预期的那样接收数据。如何设置双方来传达结构化数据?

我的 angular 应用程序向用 Web API 编写的 REST API 提出一个复杂的问题 API 2.

控制器方法定义为:

[RoutePrefix("v1/questions")]
public class VersionsController : ApiController
{
    [Route("askComplicated")]
    [HttpGet]
    [ResponseType(typeof(ComplicatedResponseDto))]
    public IHttpActionResult AskComplicatedQuestion(ComplicatedRequestDto complicatedRequest)
    {
        var responseElements = new List<ComplicatedResponseElementDto>();
        foreach (var requestElement in complicatedRequest.Elements)
        {
            responseElements.Add(new ComplicatedResponseElementDto()
            {
                Id = requestElement.Id,
                answer = "it is unknowable!!!"
            });
        }
        return Ok(new ComplicatedResponseDto() { Elements = responseElements.ToArray()});
    }

DTO:

public class ComplicatedRequestDto
{
    public ComplicatedRequestElementDto[] Elements { get; set; }
}

public class ComplicatedRequestElementDto
{
    public int Id { get; set; }
    public string Question { get; set; }
}


public class ComplicatedResponseDto
{
    public ComplicatedResponseElementDto[] Elements { get; set; }
}

public class ComplicatedResponseElementDto
{
    public int Id { get; set; }
    public string Answer { get; set; }

}

我这样分解是因为我喜欢简单的请求和简单的响应。我正在采用对我过去的 WCF 工作最有效的模式(并理解这可能是我的问题)。

在 angular 方面,这是我的代码:

    var request = $http({
        method: "get",
        url: "http://localhost:65520/v1/questions/askComplicated",
        data: {
            complicatedRequest : {
                elements: [
                  { id: 2, question: 'what is the meaning of life?' },
                  { id: 3, question: 'why am I here?' },
                  { id: 4, question: 'what stock should I pick?' }
                ]
            }
        }
    });
    return request.then(handleSuccess, handleError);

当我从我的 angular 应用程序调用 REST API 时,WEB API 2 应用程序收到它,但 ComplicatedRequestDto 为空。我如何正确发送该数据才能通过?

你应该在方法参数前添加[FromUri]注解来通知WebAPI你想从应用程序Uri加载这个参数,这就是你的数据去哪里当你使用带有数据参数的 GET http 操作。

所以你的代码应该是这样的

[RoutePrefix("v1/questions")]
public class VersionsController : ApiController
{
    [Route("askComplicated")]
    [HttpGet]
    [ResponseType(typeof(ComplicatedResponseDto))]
    public IHttpActionResult AskComplicatedQuestion([FromUri]ComplicatedRequestDto complicatedRequest)
    {
        var responseElements = new List<ComplicatedResponseElementDto>();
        foreach (var requestElement in complicatedRequest.Elements)
        {
            responseElements.Add(new ComplicatedResponseElementDto()
            {
                Id = requestElement.Id,
                answer = "it is unknowable!!!"
            });
        }
        return Ok(new ComplicatedResponseDto() { Elements = responseElements.ToArray()});
    }

您还必须更正负载以匹配您的 类 的结构。 正确值应如下所示:

{
  "Elements": [
    {
      "Id": 1,
      "Question": "sample string 2"
    },
    {
      "Id": 1,
      "Question": "sample string 2"
    }
  ]
}

最后提供 JavaScript 代码示例(我只有 jQuery,但 Angular 的有效负载相同):

$.ajax({url:"/v1/questions/askComplicated",data: {
  "Elements": [
    {
      "Id": 2,
      "Question": "what is the meaning of life?"
    },
    {
      "Id": 3,
      "Question": "why am I here?"
    }
  ]
}})

将您的 API 从 Get 更新为 Post,因为当我们要传递复杂对象时,它包含更多数据并且我们在 URL 中限制发送最大字符数。 做以下修改:

[RoutePrefix("v1/questions")]
public class VersionsController : ApiController
{
    [Route("askComplicated")]
    [HttpPost]
    [ResponseType(typeof(ComplicatedResponseDto))]
    public IHttpActionResult AskComplicatedQuestion([FromBody]ComplicatedRequestDto complicatedRequest)
    {
        //write ur code here...
    }
}

更新您的 js 代码如下:

 var request = $http({
        method: "post",
        url: "http://localhost:65520/v1/questions/askComplicated",  
        data: {
            complicatedRequest : {
                elements: [
                  { id: 2, question: 'what is the meaning of life?' },
                  { id: 3, question: 'why am I here?' },
                  { id: 4, question: 'what stock should I pick?' }
                ]
            },
        }
    });
    return request.then(handleSuccess, handleError);