c# - AngularJs/webAPI : recieving null in the parameter of webAPI

Question

我正在使用 AngularJS，并且尝试将 json 从我的服务发送到 webAPI Controller 。当我通过发送时，我在 webApi 函数的参数中收到 null。

我的功能服务是:

angular.module('productsApp')
    .service('ProductDetailService', ['$http', function ($http) {
        var urlBase = "/api/productdetail";

        this.Salvar = function (product) {
            var mydata = JSON.stringify(product);
            debugger;

            return $http({
                method: 'POST',
                url: urlBase + "/salvar/" + mydata,
                data: mydata,
                headers: { 'Content-Type': 'application/json' }
            });
        };
    }]);

我在 webAPI 中的代码是:

public class ProductDetailController : BaseController
{
    [Route("api/productdetail/salvar/{item}")]
    [HttpPost]
    public bool Salvar(string item)
    {
        return true;
    }
}

我的 app.js 是:

var app = angular.module('productsApp', ['ngRoute']);

app.config(['$routeProvider', function ($routeProvider)
{
    $routeProvider.when('/', {
        controller: 'ProductController',
        templateUrl: '/Scripts/App/Html/ProductList.html'
    }).
    when('/testprice', {
        controller: 'ProductController',
        templateUrl: '/Scripts/App/Html/ProductDetail.html'
    }).
    when('/editar/1', {
        controller: 'ProductController',
        templateUrl: '/Scripts/App/Html/ProductDetail.html'
    }).
    when('/api/productdetail/salvar/*', {
        controller: 'ProductDetailController',
        templateUrl: '/Scripts/App/Html/ProductDetail.html'
    })
    .otherwise({ redirectTo: '/' });

}]);

服务中的问题是，当我在 webService null 中接收到类型 data: Something 时，我必须在完整的 uri 中添加我的数据，例如:

http://.../api/productdetail/salvar/{mydata}

正在使用它，它正在工作。

出了什么问题？

Answer 1

如果您想从 HTTP/POST 正文接收纯文本，则需要将 [FromBody] 属性应用于 Controller 操作的输入参数:

[Route("api/productdetail/salvar")]
[HttpPost]
public bool Salvar([FromBody] string item)
{
    return true;
}

虽然您可以采用这种方式，但 WebAPI 希望您设计 DTO 并使用 DTO 实例接收 POST 数据(WebAPI 根据其类型将 JSON 反序列化为参数):

[Route("api/productdetail/salvar")]
[HttpPost]
public bool Salvar(MyData item)
{
    return true;
}

MyData可能如下所示:

public class MyData
{
     public string Text { get; set; }
}

您的 Angular 应用程序应发送如下 JSON:{ "Text": "hello world"}。

最后，WebAPI 强制执行 RESTful API 开发，并且您的路线是 RPC 风格。您应该将其重命名为 api/product/details 并将数据 POST 到此资源 URI。否则，您就不是在设计 RESTful API!

请记住，REST 喜欢使用 HTTP 动词来表达操作:

• POST 是创建。
• PUT 是更新。
• GET 是获取全部、按页面获取或按 id 获取。
• DELETE 是按 ID、范围等删除。
• ...

总之，不要将动词放在资源 URI 中，而是使用 HTTP 动词来表达要对公开的资源执行的操作。