Question

我很难让Angular做一个我的服务器理解的帖子请求。我要么需要实施修复服务器端，要么转换请求前飞行客户端。

jQuery.post

当我使用jQuery执行请求时，它会按预期响应：

$.ajax({
        data: paramdata,
        type: "POST",
        url: 'http://api.example.com/api/controller',
        dataType: 'json'
    }).then(function(response) {

    angular.forEach(response.errors, function(val, row) {
        alert('jQuery says : ' + val);
    });

});

jQuery fiddler report

Angular $ http.post

当我在Angular中做类似的事情时，Origin http://localhost:9000 is not allowed by Access-Control-Allow-Origin.

失败了

$http.post('http://api.example.com/api/controller', {
        data: {'name':'Rick James'}
    }).then(function(response) {
        var data = response.data;

        angular.forEach(data.errors, function(val, row) {
            alert('$http says: ' + val);
        });
});

Angular http fiddler report

我正在配置我的$http提供商：

angular.module('fooApp').config(['$httpProvider', function($httpProvider) {
    //Fix as described here: https://github.com/angular/angular.js/pull/1454
    delete $httpProvider.defaults.headers.common["X-Requested-With"];

}]);

当我添加此行

时

 $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';

它在没有Acces-Control-Allow-Origin错误的情况下发送数据，但服务器可以理解如何解析如何解析application / json对象的JSON。

我怎样才能执行更像jQuery的angular $ http请求？

.NET控制器

[AllowAnonymous]
[HttpPost]
[AllowCrossDomain]
public JsonResult JsonLogin(LoginModel model, string returnUrl)
{
    //Origin = Request.Url.AbsoluteUri;

    if (ModelState.IsValid)
    {
        if (WebSecurity.Login(model.Email, model.Password, persistCookie: model.RememberMe))
        {
            FormsAuthentication.SetAuthCookie(model.Email, model.RememberMe);

            // return Json(new { success = true, redirect = returnUrl });
            return Json(new { success = true, redirect = Session["Origin"] });
        }
        else
        {
            ModelState.AddModelError("", "The user name or password provided is incorrect.");
        }
    }

    // If we got this far, something failed
    return Json(new { errors = GetErrorsFromModelState() });
}

我们允许跨域请求与AllowCrossDomain过滤器设置Access-Control-Allow-Origin，“*”，Access-Control-Allow-Methods和Access-Control-Max-Age。

Answer 1

这很有可能发生，因为Angular不像jQuery AJAX请求那样将数据作为kay-value对发送。相反，Angular将数据作为JSON编码的字符串发送，作为请求流的一部分。

您需要从输入流中读取数据字符串，然后JSON对其进行解码以便能够访问它。您可以像这样读取输入流taken from here

request.InputStream.Position = 0;
using (StreamReader inputStream = new StreamReader(request.InputStream))
{
  return inputStream.ReadToEnd();
}

我对asp.net不太熟悉，但这里有一个PHP示例，可以说明差异。使用jQuery进行POST时，我可以得到username，如下所示：

$username = $_POST['username']

但是使用Angular，需要这样做：

$stream = file_get_contents("php://input"); // read input stream
$streamObj = json_decode($stream);  // json decode
$username = $streamObj->username;

对.NET的发布请求适用于jQuery，但不适用于Angularjs $ http

1 个答案: