将Content-type更改为“application / json”POST方法,RESTful API

时间:2013-06-20 10:36:00

标签: angularjs

大家好我是AngularJS的新手,我需要你的帮助..

我只需要将我的json发布到API并收到正确的响应。

这是我的JSON,我不知道在哪里编码。

JSON

{ 
    "userId"      :"testAgent2",
    "token"       :"testAgent2",
    "terminalInfo":"test2",
    "forceLogin"  :"false"
}

如果我这样做的话,不确定。

CONTROLLER.JS

function UserLoginCtrl($scope, UserLoginResource) {
    //Save a new userLogin
    $scope.loginUser = function() {
        var loggedin = false;
        var uUsername = $scope.userUsername;
        var uPassword = $scope.userPassword;
        var uforcelogin = 'true';

        UserLoginResource.save();
    }
}

SERVICES.JS

angular.module('UserLoginModule', ['ngResource'])
    .factory('UserLoginResource', function($resource, $http) {
        $http.defaults.useXDomain = true;
        delete $http.defaults.headers.common['X-Requested-With'];
        $http.defaults.headers.post["Content-Type"] = "application/json"; //NOT WORKING

        return $resource('http://123.123.123.123\\:1234/SOME/LOCATION/THERE', {}, {
            save: { 
                method:'POST', 
                headers: [{'Content-Type': 'application/json'}] 
            } //NOT WORKING EITHER
        });
    });

INDEX.HTML

<html ng-app>

<head>
<script src="js/lib/angular/angular.js"></script>
<script src="js/lib/angular/angular-resource.js"></script>
</head>


<body ng-controller="UserLoginCtrl">

<form class="form-horizontal" name="form-horizontal" ng-submit="loginUser();">

<div class="button-login">

<!-- start: button-login -->
<button class="btn btn-primary" type="submit">Login</button>

</div>

</form>


</body>   


</html>

希望你能帮助我这些人..

我一直在收到像Unsupported Media Type这样的回复...... 我不知道还能做什么...

任何建议或评论都会很棒..谢谢!

3 个答案:

答案 0 :(得分:23)

假设您能够使用一个较新的“不稳定”版本,更改标题的正确语法是。

app.factory('BarService', function ($resource) {
var BarService = $resource('/foo/api/bars/:id', {}, {    
    'delete': {
        method: 'DELETE',
        headers: {
            'Content-Type': 'application/json'
        }
    }
});
 return BarService;
});

我发现$ resource服务是构建应用程序的一个非常强大的工具,并且已经成熟到一点,你不需要再回到$ http。再加上像模式这样的活跃记录非常方便。

答案 1 :(得分:21)

在Angular中发布JSON对象非常简单。您需要做的就是:

创建Javascript对象

我将使用您代码中的确切属性。

var postObject = new Object();
postObject.userId = "testAgent2";
postObject.token = "testAgent2";
postObject.terminalInfo = "test2";
postObject.forceLogin = "false";

将对象发布到API

要将对象发布到API,您只需要一个简单的$ http.post函数。见下文:

$http.post("/path/to/api/", postObject).success(function(data){
    //Callback function here.
    //"data" is the response from the server.
});

由于JSON是发布到API的默认方法,因此无需重置。有关详细信息,请参阅$ http快捷方式上的this link

关于您的代码,请尝试更改您的保存方法以包含此简单的帖子方法。

答案 2 :(得分:3)

正确设置内容类型&#39;:&#39; application / json&#39;正在为保存操作设置transformRequest函数。

angular.module('NoteWrangler')
.factory('NoteNgResource', function NoteNgResourceFactory($resource) {

    // https://docs.angularjs.org/api/ngResource/service/$resource

    return $resource("./php/notes/:id", {}, {
        save : { // redefine save action defaults
            method : 'POST',
            url : "./php/notes", // I dont want the id in the url
            transformRequest: function(data, headers){
                console.log(headers);
                headers = angular.extend({}, headers, {'Content-Type': 'application/json'});
                console.log(headers);
                console.log(data);
                console.log(angular.toJson(data));
                return angular.toJson(data); // this will go in the body request
            }               
        }
    });
});

似乎没有一种清除查询参数的方法,请求将同时具有...