2

我很难让 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 提琴手报告

角 $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 报告

我正在$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 的角度 $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 的跨域请求。

4

1 回答 1

1

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

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

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

我对 asp.net 不太熟悉，但这里有一个 PHP 示例，可以说明差异。使用 jQuery 发布时，我可以username这样：

$username = $_POST['username']

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

$stream = file_get_contents("php://input"); // read input stream
$streamObj = json_decode($stream);  // json decode
$username = $streamObj->username;
于 2013-04-09T20:01:08.507 回答