2013-06-20 19 views
24

Ciao ragazzi io sono nuovo a AngularJS e avevo bisogno del vostro aiuto ..cambiamento Content-type al metodo POST "application/json", API RESTful

Tutto quello che serve è solo bisogno di pubblicare la mia JSON per l'API e ricevere la risposta corretta.

Ecco il mio JSON in cui non so dove codificarlo.

JSON

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

Non sono sicuro se sto facendo questo diritto.

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> 

spera che possiate hel p me ragazzi con questo ..

ho continuato a ottenere una risposta del genere non supportato Tipo di carta ... non so che altro fare ...

suggerimenti o commenti saranno grandi .. GRAZIE !

+1

per tipo di contenuto predefinito è application/json quindi nessun bisogno di ignorare che si prega di controllare il vostro formato JSON è corretto o non si prega di monitorare la scheda di rete in chrome quindi vederlo json corretto viene inviato attraverso la rete –

+0

Ho fatto un esempio qui: http://stackoverflow.com/questions/14708804/managing-models-relations-in-angular/ 17055281 # 17055281 controlla se ti aiuta. –

+0

Penso che l'impostazione '$ http.defaults.useXDomain' sia un mito, non esiste nel codice sorgente! https://groups.google.com/forum/m/#!topic/angular/kl2BVOubG4I – Blowsie

risposta

20

La pubblicazione di un oggetto JSON è piuttosto semplice in Angular. Tutto quello che devi fare è il seguente:

creare un oggetto JavaScript

userò le proprietà esatte dal codice.

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

Posta l'oggetto alle API

Per pubblicare un oggetto a un'API si limita a bisogno di una semplice funzione di http.post $. Vedi sotto:

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

Poiché JSON è il metodo predefinito di pubblicazione su un'API, non è necessario ripristinarlo. Vedere this link su scorciatoie $ http per ulteriori informazioni.

Per quanto riguarda specificamente il codice, provare a modificare il metodo di salvataggio per includere questo semplice metodo di post.

+0

Buongiorno signore, quindi cosa intendi con cui ho intenzione di cambiare linea con $ risorsa e cambiarla in $ http? – user2073913

+0

Sì, l'intera porzione di reso può essere sostituita con questa chiamata molto più semplice. Come lo integrerai nel tuo progetto dipende da te. – John

+0

Non riesco a farlo funzionare. Continuo a ricevere il seguente errore nella console: POST http: // localhost: 49653/api/warehouse/415 (tipo di supporto non supportato) Penso che abbia a che fare con l'applicazione/json all'estremità di AngularJS e l'applicazione/x-www-form-urlencoded all'estremità WebAPI di ASP.NET. Funziona in questo modo: i dati : "id = 3 & name = prueba & location = madrid", intestazioni: { "Content-Type": "application/x-www-form-urlencoded"} vorrei essere in grado per ottenere json a fine WebAPI, però. Qualsiasi ulteriore aiuto? –

22

Supponendo che si sia in grado di utilizzare una delle versioni "unstable" più recenti, la sintassi corretta per modificare l'intestazione è.

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

Ho trovato il servizio $ risorsa è uno strumento molto potente per la creazione di applicazioni e ha maturato ad un punto che non è necessario a ripiegare a $ http tanto. Inoltre il suo curriculum attivo come i modelli sono dannatamente convenienti.

+0

Come posso passare a "eliminare" un oggetto da inviare nel corpo della richiesta? – brescia123

+0

Ciao @ brescia123, "di solito" il metodo http stesso indica l'azione desiderata che si desidera ottenere, come mostrato sopra per DELETES. Se non riesci a chiamare/esporre il metodo DELETE, allora non è inaudito passare un oggetto richiesta che conterrebbe sia l'oggetto che l'azione desiderata: {'action': 'delete', {'target': myObj}} ma non ne sono un fan in quanto non sarebbe conforme ai principi generalmente accettati dei servizi RESTful. – acg

3

Il modo corretto per impostare "Content-Type": "application/json" sta impostando una funzione transformRequest per l'azione di salvataggio.

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 
      }    
     } 
    }); 
}); 

Sembra che non ci sia un metodo per cancellare i parametri di ricerca, la richiesta avrà sia ...