반응형
Angular에서 .net WebAPI로 게시
저는 Angular $ 리소스를 사용하여 webapi endpoint에 모델을 게시하고 있지만 Angular는 JSON 바디나 폼 파라미터가 아닌 요청 페이로드에 데이터를 보냅니다.결과적으로 모델은 항상 null로 끝납니다.
제 API는 다음과 같습니다.
public class UserController : APIController {
[HttpPost]
public void Disconnect(Models.Users.User model) {
}
}
요청 헤더는 다음과 같습니다.
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
그리고 요청 페이로드:
{"Id":3,"FirstName":"Test","LastName":"User","Username":"testuser","IsApproved":true,"IsOnlineNow":true,"IsChecked":true}
Fiddler에서 테스트하면 본문에 동일한 JSON 문자열을 게시하면 예상대로 모델이 올바르게 입력됩니다.
이 시나리오에서 사용할 수 있는 빌트인 모델 바인더나 사용할 수 있는 곳에 미리 제작된 것이 있습니까?
아니면 누가 나에게 실무적인 예를 보여줄 수 있습니까?
당신은 을 사용할 수 있습니다.
예는 다음과 같습니다.
<!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>
다음 컨트롤러를 가정합니다.
public class ValuesController : ApiController
{
[HttpPost]
public User Post(User model)
{
return model;
}
}
저는 이 정도면 잘 됐어요.아래는 서버측 코드입니다.
[HttpPost]
public void Disconnect([FromBody] Models.Users.User model) { ... }
요청하는 고객 코드는
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(......
언급URL : https://stackoverflow.com/questions/16621706/posting-from-angular-to-net-webapi
반응형
'source' 카테고리의 다른 글
판독 가능한 방법으로 dplyr 개수의 고유 개수 가져오기 (0) | 2023.10.04 |
---|---|
Android Button 배경색이 변하지 않음 (0) | 2023.10.04 |
트리거를 만들어야 해요 제가 문제가 있어요 (0) | 2023.10.04 |
PowerShell이 명령줄 인수에서 큰따옴표를 제거합니다. (0) | 2023.10.04 |
MySQL에서 incode/outcode로 지속 시간을 계산하는 가장 좋은 방법은 무엇입니까? (0) | 2023.10.04 |