来自AngularJS的HttpPost调用抛出500内部服务器错误

时间:2017-04-11 10:18:33

标签: javascript html angularjs asp.net-mvc asp.net-web-api

我正在开发一个应用程序,我需要将用户添加到数据库,因此需要POST操作。 但是,每次运行应用程序时,我都会收到POST api调用的500内部服务器错误。

以下是我的代码段。

angular.module('app')
            .constant('userApiRoot', 'http://localhost:82/api/User/');

Service.js

app.factory('userService', [
        'userApiRoot', '$http', '$q', function (apiRoot, $http, $q) {
            'use strict';
            return {

                apiRoot: apiRoot,
                addUser: function (userData) {
                    var def = $q.defer();

                    $http.post(apiRoot + "Add", JSON.stringify(userData))
                        .then(function (response) {
                            def.resolve(response.d`enter code here`ata);
                        }, def.reject);

                    return def.promise;
                }
            };
        }
]);

Controller.js

app.controller('BlogInfoController', ['userService', '$scope', BlogInfoController]);

function BlogInfoController(userService, $scope) {
    'use strict';
    $scope.user = {};

    userService.addUser($scope.user).then(function (data) {
        var userData = data;
    });
}

HTML



<div class="comments-form">
                        <h3 class="title-normal">Leave A Comment</h3>
                        <form role="form" ng-submit="addUser()">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <input class="form-control" name="name" id="name" placeholder="Your Name" ng-model="user.Name" type="text" required>
                                    </div>
                                    <div class="form-group">
                                        <input class="form-control" name="email" id="email" placeholder="Your Mail" ng-model="user.Email" type="email" required>
                                    </div>
                                    <div class="form-group">
                                        <input class="form-control" placeholder="Your Website" type="text" ng-model="user.Website" required>
                                    </div>
                                </div>
                            </div>

                            <div class="text-right">
                                <button class="btn btn-primary" type="submit">Post Comment</button>
                            </div>
                        </form>
                    </div>
&#13;
&#13;
&#13;

我收到的错误在随附的屏幕截图中。Internal Server Error

我尝试过寻找解决方案,但没有任何帮助。我在所有浏览器中都遇到了同样的错误。

注意 - 使用像邮递员这样的外部客户端调用时,相同的api调用效果很好。

TIA。

5 个答案:

答案 0 :(得分:0)

实际上一切都是正确的,但API返回500 ..检查API是否正确。在C#端调试。

https://www.lifewire.com/500-internal-server-error-explained-2622938

答案 1 :(得分:0)

对发布数据进行字符串化的Instad,尝试将其作为原始数据发送。像这样:

$http.post(apiRoot + "Add", userData)
     .then(function (response) {
            def.resolve(response.d`enter code here`ata);
     });

答案 2 :(得分:0)

也许你应该尝试将数据作为对象发送

...
$http.post(apiRoot + "Add", userData)
...

为什么不直接返回http承诺?

addUser: function (userData) {                    
                return $http.post(apiRoot + "Add", JSON.stringify(userData))
            }

答案 3 :(得分:0)

使用

@Component({
    moduleId: module.id,
    selector: 'rooms-list',
    templateUrl: "template.html",
    providers: [ RoomService ],
    changeDetection: ChangeDetectionStrategy.OnPush
})

并将其传递给

$ http.post(apiRoot +“Add”,JSON.stringify(userData),config)

因为您正在使用post方法的JSON数据,并且不提供任何标头。你的邮递员已经包含了这个标题。

答案 4 :(得分:0)

感谢所有人提供的优质解决方案来帮助我。最后我自己找到了解决这个问题的方法。它可能会在某一天帮助某人。

  1. 在将数据传递给角度服务函数时删除了JSON.stringify。
  2. 虽然我已将ng-submit =“addUser()”添加到我的表单中,但我的控制器中没有相应的功能。这是我控制器中的服务电话

    userService.addUser($ scope.user).then(function(data){         var userData = data;     });

  3. 将其更改为以下

    $scope.addUser = function () {
    userService.addUser($scope.user).then(function (data) {
                var userData = data;
            });
    }
    

    这些在找到它时看起来很小,但如果没有密切监视,它会让你停留一段时间。

    感谢大家的帮助。