POST da angolare a .net WebAPI

Sto utilizzando una risorsa $ angolare per inviare un modello a un endpoint webapi, ma Angular invia i dati nel carico utile della richiesta, piuttosto che un corpo JSON o i parametri del modulo. Di conseguenza, il modello finisce sempre come null.POST da angolare a .net WebAPI

mio API è la seguente:

public class UserController : APIController { 
    [HttpPost] 
    public void Disconnect(Models.Users.User model) { 
    } 
}

le intestazioni di richiesta sono:

POST /siteapi/User/Disconnect HTTP/1.1 
Host: rouge2 
Connection: keep-alive 
Content-Length: 125 
Accept: application/json, text/plain, */* 
Origin: http://rouge2 
X-Requested-With: XMLHttpRequest 
User-Agent: Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.64 Safari/537.31 
Content-Type: application/json;charset=UTF-8 
Referer: http://rouge2/Users 
Accept-Encoding: gzip,deflate,sdch 
Accept-Language: en-US,en;q=0.8 
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3 
Cookie: .ASPXAUTH=115C6015BDD5C1A9D111B0A9FBF05294B73287328566F65CB1BCB457DF206EF0916D4615B5914EB443AA567E860742AC14EAA2951B9C327260C4F00649694260A1B3960771FB6675FEE8F3E68B0BB46436020ACAB33ECE0D3E70B50D6569E52B27F69161762C10C19A806A12D3254DF60EF4758DEDCA529A91CB36C74B7FA7F4; __RequestVerificationToken=Rp4Vu8R67ziDNc36DoOLZH7KmEfumig1zFDmYiFWHTsWyf2I037xJQydcmLtOfaJ3ccc8GEZXmHoa8LBRusxKFRYVoy27GuFEfNhKKYS_hUysjwCjmsxw5OCK3RKsiXIAh1Gbi0PxcdqBfzctSJn9g2

E la richiesta di payload:

{"Id":3,"FirstName":"Test","LastName":"User","Username":"testuser","IsApproved":true,"IsOnlineNow":true,"IsChecked":true}

Se provo a Fiddler, la pubblicazione lo stesso Stringa JSON nel corpo, il modello è compilato correttamente, come previsto.

C'è un raccoglitore modello incorporato che funzionerà in questo scenario, o qualcosa di precostruito da qualche parte che posso usare?

Oppure qualcuno può indicarmi la direzione di un esempio di lavoro?

fonte

2013-05-18 mattdwen

Un campione per iniziare: http://www.codeproject.com/Articles/737030/A -basic-SPA-application-using-AngularJS-WebAPI-e – Braulio

È possibile utilizzare lo $http module.

Ecco un esempio:

<!DOCTYPE html> 

<html ng-app> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Index</title> 
</head> 
<body> 
    <div ng-controller="TestController"> 
     <ul ng-model="person"> 
      <li>FirstName: {{person.FirstName}}</li> 
      <li>LastName: {{person.LastName}}</li> 
      <li>UserName: {{person.Username}}</li> 
      <li>IsApproved: {{person.IsApproved}}</li> 
      <li>IsOnlineNow: {{person.IsOnlineNow}}</li> 
      <li>IsChecked: {{person.IsChecked}}</li> 
     </ul> 
    </div> 

    <script type="text/javascript" src="~/scripts/angular.min.js"></script> 
    <script type="text/javascript"> 
     function TestController($scope, $http) { 
      var data = { "Id": 3, "FirstName": "Test", "LastName": "User", "Username": "testuser", "IsApproved": true, "IsOnlineNow": true, "IsChecked": true }; 
      $http.post(
       '/api/values', 
       JSON.stringify(data), 
       { 
        headers: { 
         'Content-Type': 'application/json' 
        } 
       } 
      ).success(function (data) { 
       $scope.person = data; 
      }); 
     } 
    </script> 
</body> 
</html>

Supponendo che il seguente controller:

public class ValuesController : ApiController 
{ 
    [HttpPost] 
    public User Post(User model) 
    { 
     return model; 
    } 
}

fonte

2013-05-18 10:07:07

Sembra che WebAPI si aspetti che anche i dati inviati vengano incapsulati come oggetto "Utente", ad es. {Dati utente}}. – mattdwen

@mattdwen Non penso che lo farà se si usa '[FromBody]' anche se giuro che non lo faccio e funziona ancora senza. – kamranicus

Cosa fare se si desidera o * è necessario * utilizzare $ resource? Quale sarebbe il modo più pulito per "aggiustare" il POST? Utilizzando un attributo di filtro globale? – kamranicus

Per me questo solo ha funzionato bene. Di seguito si riporta il codice lato server

[HttpPost] 
    public void Disconnect([FromBody] Models.Users.User model) { ... }

e il codice client richiedente sarà,

var dataToPost ={ id : 3, firstName : 'Test', lastName : 'User', username : 'testuser', isApproved : true, isOnlineNow : true, isChecked: true }; 

      var config = { 
       headers : { 
        'Content-Type': 'application/json;charset=utf-8;' 
       } 
      } 
      $http.post(thisIsUrl, dataToPost, config).then(......

fonte

2017-10-01 03:20:44

POST da angolare a .net WebAPI

risposta

Problemi correlati