Angularjs POST方法在控制台中返回404错误

时间:2017-11-17 11:35:14

标签: angularjs post

我正在尝试通过api on http://localhost:4567/api/v1/companies使用POST方法编写数据。我从堆栈中尝试了各种各样的东西,这是我的代码:

<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
    var app = angular.module("app", []);
    app.controller("HttpGetController", function ($scope, $http) {

        $scope.SendData = function () {
           // use $.param jQuery function to serialize data from JSON 
            var data = $.param({
                id: $scope.id,
                name: $scope.name,
                city: $scope.city,
             });

            var config = {
                headers : {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                }
            }

            $http.post('http://localhost:4567/api/v1/companies', data, config)
            .success(function (data, status, headers, config) {
                $scope.PostDataResponse = data;
            })
            .error(function (data, status, header, config) {
                $scope.ResponseDetails = "Data: " + data +
                    "<hr />status: " + status +
                    "<hr />headers: " + header +
                    "<hr />config: " + config;
            });
        };

    });
</script>
</head>
<div ng-app="app" ng-controller="HttpGetController">
    <p>ID: <input type="number" name="id" ng-model="id" required /></p>
    <p>Name: <input type="text" name="name" ng-model="name" required /></p>
    <p>City: <input type="text" name="city" ng-model="city" required /></p>
    <button ng-click="SendData()">Submit</button>
    <hr />
    {{ PostDataResponse }}
</div>

在控制台中我收到404错误。Screen shot of the console

Server side(Sinatra)

1 个答案:

答案 0 :(得分:0)

选项请求您看到有CORS的指示。当客户端代码和服务器来自不同的域或端口时,它将在发送POST之前执行OPTIONS请求,因此您只需要允许任何域通过添加适当的头来从服务器端请求来自任何地方的连接。你说你在使用节点我相信另一个问题:

https://enable-cors.org/server_expressjs.html

对OPTIONS请求的404响应是阻止浏览器做进一步的操作,但这基本上是在浏览器和服务器之间,服务器需要对OPTIONS请求给出正确的响应,否则浏览器将放弃。

因此,您要么在服务器上启用它,要么让服务器在服务器API来自同一域/端口上发送客户端文件,然后它也不是问题。