Angular $http.post 1.6.1 未将数据传递给 WebAPI答案

【问题标题】：Angular $http.post 1.6.1 not passing data to WebAPIAngular $http.post 1.6.1 未将数据传递给 WebAPI
【发布时间】：2017-02-03 18:17:50
【问题描述】：

所有，我刚刚使用 1.6.1 创建了一个新的 Angular 包，但现在数据似乎没有传递给我的 WebAPI。但是，当我通过 SoapUI 或类似的方式发布位时，一切都很好。

Javascript 看起来像这样：

function testapi()
        {
            var serviceRoot='http://server/testangular16/api/Values';

            var deferred=$q.defer();

            var req = {
                method: 'POST',
                url: serviceRoot,
                data: 'PassInTheText'
            };

            $http(req).then(goodResponse,badResponse);

            return deferred.promise;
        };
    function goodResponse(response)
    {
        console.log("Good response");
        console.log(response);

    }

    function badResponse(response)
    {
        console.log("Bad response");
        console.log(response);
    }

webapi 是一个非常简单的 C# 控制器：

    // POST api/values
    public HttpResponseMessage Post([FromBody]string value)
    {
        HttpResponseMessage rp = new HttpResponseMessage(HttpStatusCode.OK);
        rp.Content = new StringContent(value);

        return rp;
    }

我正在将它放入控制器中，我可以设置一个断点并点击我可以查看值的部分。它始终为空。

查看网络跟踪，角度部分确实进行了预检，我可以看到 200 响应返回。

Request URL:http://server/testangular16/api/Values
Request Method:OPTIONS
Status Code:200 OK
Remote Address:10.7.14.209:80
**Response Headers view source**
Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:content-type
Access-Control-Allow-Origin:http://localhost:8000
Cache-Control:no-cache
Content-Length:0
Date:Fri, 03 Feb 2017 18:09:04 GMT
Expires:-1
Pragma:no-cache
Server:"Management Corporation"
X-AspNet-Version:4.0.30319
**Request Headers view source**
Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:content-type
Access-Control-Request-Method:POST
Connection:keep-alive
Host:mjvzrx3
Origin:http://localhost:8000
Referer:http://localhost:8000/
User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36

所以，看起来我正在传递 CORS，但是当我尝试将数据作为帖子的内容传递时，它没有成功。

任何想法我错过了什么？

谢谢，尼克

【问题讨论】：

标签： angularjs angular-http

【解决方案1】：

Web API 需要消息正文中的对象，您不能传入原始类型，除非您使用 application/x-www-form-urlencoded 作为内容类型并在值前面加上等于 = 符号。

所以你可以通过这些方法之一修复它

调整c#参数，将其转为具有字符串属性的类型，然后传入一个参数名称匹配的json对象。
将请求更改为 url-encoding 内容类型并将= 添加到变量值。
将其作为 URL 的一部分而不是消息正文发送，您仍然可以使用 POST 方法。

改为form-urlencoded

function testapi()
{
    var serviceRoot='http://server/testangular16/api/Values';
    var deferred=$q.defer();

    var req = {
        method: 'POST',
        url: serviceRoot,
        data: '=PassInTheText', // added =
        contentType: 'application/x-www-form-urlencoded' // specify content type
    };

    $http(req).then(goodResponse,badResponse);
    return deferred.promise;
};

【讨论】：

我猜当时有些事情不成立。我似乎需要一个 = 符号的唯一地方是如果我从 Angular 1.6 调用。我只是在邮递员中尝试过，我根本不需要做任何额外的事情。正文只是“一些虚拟文本”。与 SoapUI 相同。如果我用它来发布数据并且正文是相同的，那么一切正常。这让我相信它确实是 Angular 1.6 中的东西，而不是 WebAPI。另外，我将我的内容类型作为 application/json 发送.....
我刚刚回滚到 Angular 1.5.11，它的工作方式就像它一样......所以，唯一的变量是 Angular 1.6....
我要从头开始，看看能不能重复。否则我可能最终会转换为我发布的答案

【解决方案2】：

如果我这样做，它似乎可以按预期工作....有什么想法吗？

    // POST api/values
    public HttpResponseMessage Post(HttpRequestMessage request)
    {
        var data = request.Content.ReadAsStringAsync().Result;

        Console.WriteLine("Data: {0}", data);

        HttpResponseMessage rp = new HttpResponseMessage(HttpStatusCode.OK);
        rp.Content = new StringContent("Data back from WebAPI" + data);

        return rp;
    }

【讨论】：