AngularJS와 - 요청 매개 변수 대신 JSON의를 보낼 수 $ http.post에 대한 모든 방법은?

해결법

1.나는 매개 변수를 config (설정) params 객체를 파라미터는 대신 몸의 URL에 문자열을 추가하기 때문에 여기에 작동하지 않습니다 만에 예로서 (의 jQuery PARAM를 사용하여 변환 기본의 글로벌 재정의 예입니다 무엇 Infeligo 여기 제안에 추가 할 생각 ) PARAM 문자열에 데이터를 변환합니다.

나는 매개 변수를 config (설정) params 객체를 파라미터는 대신 몸의 URL에 문자열을 추가하기 때문에 여기에 작동하지 않습니다 만에 예로서 (의 jQuery PARAM를 사용하여 변환 기본의 글로벌 재정의 예입니다 무엇 Infeligo 여기 제안에 추가 할 생각 ) PARAM 문자열에 데이터를 변환합니다.

글로벌 transformRequest 기능을 설정합니다 :
```
var app = angular.module('myApp');

app.config(function ($httpProvider) {
    $httpProvider.defaults.transformRequest = function(data){
        if (data === undefined) {
            return data;
        }
        return $.param(data);
    }
});
```
그런 식으로 $ http.post에 대한 모든 호출은 자동으로 jQuery를 $ .post 호출에 사용되는 것과 동일한 PARAM 형식으로 몸을 변형시킬 것이다.

당신은 또한 호출 당 또는 전 세계적으로이 같은 Content-Type 헤더를 설정할 수도 있습니다 :
```
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
```
통화 당 샘플 비전 transformRequest :
```
    var transform = function(data){
        return $.param(data);
    }

    $http.post("/foo/bar", requestData, {
        headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
        transformRequest: transform
    }).success(function(responseData) {
        //do stuff with response
    });
```
2.각도> = 1.4를 사용하는 경우, 여기에 어떤 사용자 정의 또는 외부에 의존하지 않는 내가 찾은 깨끗한 솔루션입니다 :

각도> = 1.4를 사용하는 경우, 여기에 어떤 사용자 정의 또는 외부에 의존하지 않는 내가 찾은 깨끗한 솔루션입니다 :
```
angular.module('yourModule')
  .config(function ($httpProvider, $httpParamSerializerJQLikeProvider){
    $httpProvider.defaults.transformRequest.unshift($httpParamSerializerJQLikeProvider.$get());
    $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=utf-8';
});
```
그리고 당신은 당신의 응용 프로그램에서이 어디서나 작업을 수행 할 수 있습니다 :
```
$http({
  method: 'POST',
  url: '/requesturl',
  data: {
    param1: 'value1',
    param2: 'value2'
  }
});
```
그리고 정확하게 PARAM1 = VALUE1 및 PARAM2 = 값 2로 데이터를 직렬화 및 애플리케이션 / x-www-form-urlencoded를 가진 / requesturl에게 전송한다; 그것은 일반적으로 엔드 포인트에서 POST 요청으로 예정되어 같은 캐릭터 세트 = UTF-8의 Content-Type 헤더.
3.AngularJS와 문서에서 :

AngularJS와 문서에서 :

그래서, 매개 변수로 문자열을 제공합니다. 당신이 원하지 않는 경우, 다음 변환을 사용합니다. 다시 말하지만, 문서에서 :

자세한 내용은 설명서를 참조하십시오.
4.사용 jQuery의 $의 .PARAM 기능은 requestData에서 JSON 데이터를 직렬화합니다.

사용 jQuery의 $의 .PARAM 기능은 requestData에서 JSON 데이터를 직렬화합니다.

즉, 당신으로 유사한 코드를 사용하여 :
```
$http.post("/foo/bar",
$.param(requestData),
{
    headers:
    {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
    }
}
).success(
    function(responseData) {
        //do stuff with response
    }
});
```
이것을 사용하기 위해, 당신은 AngularJS와 함께 페이지에 jQuery를 포함해야합니다.

5.각도 1.4로, 당신이 jQuery를 사용하지 않고 양식 데이터를 직렬화 할 수 있습니다.

각도 1.4로, 당신이 jQuery를 사용하지 않고 양식 데이터를 직렬화 할 수 있습니다.

app.js에서 :

module.run(function($http, $httpParamSerializerJQLike) {
  $http.defaults.transformRequest.unshift($httpParamSerializerJQLike);
});

그런 다음 컨트롤러 :

$http({
    method: 'POST',
    url: myUrl',
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    data: myData
});

6.이 해킹의 비트 수 있습니다, 그러나 나는이 문제를 회피하고 서버 측에서 PHP의 POST 배열에 JSON 변환 :

이 해킹의 비트 수 있습니다, 그러나 나는이 문제를 회피하고 서버 측에서 PHP의 POST 배열에 JSON 변환 :
```
$_POST = json_decode(file_get_contents('php://input'), true);
```

7.나는 또한 사용자 지정 HTTP 인증 $ 자원 캐시 때문에 요청 설정과 같은 문제가있다.

나는 또한 사용자 지정 HTTP 인증 $ 자원 캐시 때문에 요청 설정과 같은 문제가있다.

그것은이 작업을 수행하여 기존 헤더를 덮어 쓸 필요가 작동하게하려면

var transformRequest = function(data, headersGetter){
  var headers = headersGetter();
  headers['Authorization'] = 'WSSE profile="UsernameToken"';
  headers['X-WSSE'] = 'UsernameToken ' + nonce
  headers['Content-Type'] = 'application/json';
};

return $resource(
  url,
    {
    },
    {
      query: {
        method: 'POST',
        url: apiURL + '/profile',
        transformRequest: transformRequest,
        params: {userId: '@userId'}
      },
    }
);

내가 도움이 사람에게 할 수 있었다 바랍니다. 그것은이 한 개를 내기 위해 삼일 걸렸다.

8.기본 헤더를 수정 :

기본 헤더를 수정 :

$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8";

그런 다음 JQuery와의 $ .PARAM 방법을 사용 :

var payload = $.param({key: value});
$http.post(targetURL, payload);

9.

   .controller('pieChartController', ['$scope', '$http', '$httpParamSerializerJQLike', function($scope, $http, $httpParamSerializerJQLike) {
        var data = {
                TimeStamp : "2016-04-25 12:50:00"
        };
        $http({
            method: 'POST',
            url: 'serverutilizationreport',
            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
            data: $httpParamSerializerJQLike(data),
        }).success(function () {});
    }
  ]);

10.빠른 조정 - 당신이 transformRequest 함수의 전역 구성에 문제가의 사람들을 위해, 여기에 내가 정의되지 않은 오류의 읽을 수 없습니다 재산 'JQuery와'없애 사용하고 니펫 :

빠른 조정 - 당신이 transformRequest 함수의 전역 구성에 문제가의 사람들을 위해, 여기에 내가 정의되지 않은 오류의 읽을 수 없습니다 재산 'JQuery와'없애 사용하고 니펫 :
```
$httpProvider.defaults.transformRequest = function(data) {
        return data != undefined ? $.param(data) : null;
    }
```
11.또한 $ http.post 호출에서 헤더를 변경, 서버의 코드를 변경하지 않고이 문제를 해결하고 _POST $ 정규 방법을 사용할 수 있습니다. 여기에 설명 : http://victorblog.com/2012/12/20/make-angularjs-http-service-behave-like-jquery-ajax/

또한 $ http.post 호출에서 헤더를 변경, 서버의 코드를 변경하지 않고이 문제를 해결하고 _POST $ 정규 방법을 사용할 수 있습니다. 여기에 설명 : http://victorblog.com/2012/12/20/make-angularjs-http-service-behave-like-jquery-ajax/
12.나는이 전체의 몇 번이나 문제 행동을 발견했다. 나는 익스프레스 (typings없이) 및 (DT는 ~ 몸 파서 typings 포함) bodyParser를 사용했다.

나는이 전체의 몇 번이나 문제 행동을 발견했다. 나는 익스프레스 (typings없이) 및 (DT는 ~ 몸 파서 typings 포함) bodyParser를 사용했다.

나는 포스트 문자열에 주어진 JSON을 해석하는 대신 단순히 파일을 업로드하려고하지 않았다.

request.body은 단순히 빈 JSON이었다 ({}).

마지막으로이 나를 위해 일한 조사를 많이 후 :
```
import { json } from 'body-parser';
...
app.use(json()); <-- should be defined before the first POST handler!
```
클라이언트 측에서 요청 문자열에서 응용 프로그램 / JSON 콘텐츠 형식을 제공하는 것도 중요 할 수있다.

13.AngularJS와 v1.4.8 + 구문 (v1.5.0)

AngularJS와 v1.4.8 + 구문 (v1.5.0)

       $http.post(url, data, config)
            .then(
                    function (response) {
                        // success callback
                    },
                    function (response) {
                        // failure callback
                    }
            );

예 :

    var url = "http://example.com";

    var data = {
        "param1": "value1",
        "param2": "value2",
        "param3": "value3"
    };

    var config = {
        headers: {
            'Content-Type': "application/json"
        }
    };

    $http.post(url, data, config)
            .then(
                    function (response) {
                        // success callback
                    },
                    function (response) {
                        // failure callback
                    }
            );

from https://stackoverflow.com/questions/12190166/angularjs-any-way-for-http-post-to-send-request-parameters-instead-of-json by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] HTML 양식 데이터를 사용하여 JSON 개체를 보내는 방법 (0)	2020.10.12
[JQUERY] C 번호와 ASP.NET MVC 3의 폭포 드롭 다운을 만들 수있는 가장 쉬운 방법 (0)	2020.10.12
[JQUERY] 다시로드하는 방법 / jQuery를의 요소 (이미지)를 새로 고침 (0)	2020.10.12
[JQUERY] 창 크기 조정에 jQuery를 (0)	2020.10.11
[JQUERY] 적절한 방법은 강력한 형식의 MVC 3보기에서 패스 모델에 JQuery와에 AJAX 포스트를 사용하는 (0)	2020.10.11

복붙노트

[JQUERY] AngularJS와 - 요청 매개 변수 대신 JSON의를 보낼 수 $ http.post에 대한 모든 방법은?

AngularJS와 - 요청 매개 변수 대신 JSON의를 보낼 수 $ http.post에 대한 모든 방법은?

해결법

2.각도> = 1.4를 사용하는 경우, 여기에 어떤 사용자 정의 또는 외부에 의존하지 않는 내가 찾은 깨끗한 솔루션입니다 :

3.AngularJS와 문서에서 :

4.사용 jQuery의 $의 .PARAM 기능은 requestData에서 JSON 데이터를 직렬화합니다.

5.각도 1.4로, 당신이 jQuery를 사용하지 않고 양식 데이터를 직렬화 할 수 있습니다.

6.이 해킹의 비트 수 있습니다, 그러나 나는이 문제를 회피하고 서버 측에서 PHP의 POST 배열에 JSON 변환 :

7.나는 또한 사용자 지정 HTTP 인증 $ 자원 캐시 때문에 요청 설정과 같은 문제가있다.

8.기본 헤더를 수정 :

9.

10.빠른 조정 - 당신이 transformRequest 함수의 전역 구성에 문제가의 사람들을 위해, 여기에 내가 정의되지 않은 오류의 읽을 수 없습니다 재산 'JQuery와'없애 사용하고 니펫 :

11.또한 $ http.post 호출에서 헤더를 변경, 서버의 코드를 변경하지 않고이 문제를 해결하고 _POST $ 정규 방법을 사용할 수 있습니다. 여기에 설명 : http://victorblog.com/2012/12/20/make-angularjs-http-service-behave-like-jquery-ajax/

12.나는이 전체의 몇 번이나 문제 행동을 발견했다. 나는 익스프레스 (typings없이) 및 (DT는 ~ 몸 파서 typings 포함) bodyParser를 사용했다.

13.AngularJS와 v1.4.8 + 구문 (v1.5.0)

'JQUERY' 카테고리의 다른 글

티스토리툴바