Question

我目前正在使用ASP.NET WebApi和Angularjs

WebApi有一个方法

 [System.Web.Http.AcceptVerbs("POST")]
        [System.Web.Http.HttpPost]
        public HttpResponseMessage SearchAddress(SearchDetails searchDetail)
        {
            //13.03993,80.231867
            try
            {
                if (!WebSecurity.IsAuthenticated)
                {
                    HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.NotAcceptable);
                    return response;
                }
                List<CollegeAddress> CollegeAddress = addressService.GetAddressFromDistance(17.380498, 78.4864948, 2000);
                HttpResponseMessage responseData = Request.CreateResponse(HttpStatusCode.Accepted, CollegeAddress);
                return responseData;
            }
            catch (Exception e)
            {
                HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.NotFound);
                return response;
            }
        }

我必须从客户端调用此方法。

当我使用Ajax调用此方法时，它不起作用，如果我使用Ajax，方法参数searchDetail始终为null。

$.ajax({
            method: 'POST',
            url: rootUrl + '/api/Address/SearchAddress',
            async: false,
            data: searchDetail,
            type: "json",
            headers: {
                'Content-Type': "application/json; charset=utf-8"
            }
        }).success(function (response) {
            return response;

        }).error(function () {
            toastr.error('Somthing is wrong', 'Error');
        })

但是，当我通过HTTP请求调用该方法时，就可以了。

 $http({
            method: 'POST',
            url: rootUrl + '/api/Address/SearchAddress',
            data: searchDetail,
            headers: {
                'Content-Type': "application/json; charset=utf-8"
            }
        }).success(function (response) {
            toastr.success('Account Created successfully!', 'Account Created');
            return response;
        }).error(function () {
            toastr.error('Somthing is wrong', 'Error');
        })

为什么呢？他们之间有什么区别？为什么Ajax不工作而HTTP是？

Answer 1

jQuery的ajax()使用内容类型x-www-form-urlencoded发送数据 Angular $http使用内容类型application/json

发送数据

您的服务器显然需要JSON，但您为此设置的$.ajax()调用不正确。

根据 the docs ：

method属性似乎不存在。
type属性应该确定请求的类型（例如'GET'，'POST'等）。
要将默认内容类型更改为application/json，您可以使用contentType属性。

我自己没有尝试过，但这样的事情应该有效：

$.ajax({
    type: 'POST',
    url: rootUrl + '/api/Address/SearchAddress',
    async: false,
    data: searchDetail,
    contentType: 'application/json; charset=utf-8'
});

Answer 2

$.ajax({
        method: 'POST',
        url: rootUrl + '/api/Address/SearchAddress',
        async: false,
        data: searchDetail,

我假设searchDetail是一个对象。这就是文档对data属性的说法：

...如果不是字符串，则将其转换为查询字符串。

因此，如果服务器需要JSON，那么您必须先将其转换为JSON：

data: JSON.stringify(searchDetail),

正如@ExpertSystem指出的那样，您必须将method更改为type。

Answer 3

首先你要复制HttpPost，所以只需保留第二个（并删除命名空间）其次，你希望搜索细节来自身体，所以用[FromBody]

装饰它

    [HttpPost]
    public HttpResponseMessage SearchAddress([FromBody]SearchDetails searchDetail)
    {

区分HTTP请求和Ajax请求

3 个答案: