Jquery 및 AngularJS의 Get/Post에서 매개변수 전달

이 글에서는 주로 AngularJS의 Jquery 및 Get/Post에 대한 매개변수 전달에 대해 소개합니다. 이제 이를 공유합니다. 필요한 친구들이 참조할 수 있습니다.

매개변수 전달은 어렵지 않지만 예를 들면 다음과 같습니다. 객체나 양식을 백엔드에 전달할 때 약간 번거로울 수 있습니다. 다음은 몇 가지 사용 방법입니다.

먼저 요청을 보낼 때 자주 혼동하는 몇 가지 속성을 소개하겠습니다.
dataType: 서버가 반환하는 데이터 형식을 예상합니다.
mimeType: 서버가 반환하는 데이터 형식을 처리하는 방법을 알려줍니다. 예를 들어, 유형이 "Text/html"로 설정된 경우 클라이언트는 이것이 HTML 문서임을 알게 되며 "Application/pdf"인 경우 직접 표시할 수 있습니다. "를 선택하면 클라이언트는 콘텐츠를 렌더링하려면 PDF 리더 플러그인을 시작해야 한다는 것을 알게 될 것입니다.
contentType: 전송하려는 데이터 유형을 나타냅니다. 예를 들어 "application/json;charset=utf-8"은 매우 일반적인 유형이고 "application/x-www-form-urlencoded; charset=UTF"입니다. -8"이 기본 유형입니다.

또한 요청 페이로드와 양식의 차이점을 비교하세요.
요청 페이로드는 Content-Type: application/json을 설정해야 합니다.
Chrome 개발자 도구에서는 Object/json을 전달하는 것을 볼 수 있습니다. ajax를 통해 요청을 제출하면 브라우저는 페이로드 본문을 통해 제출한 콘텐츠만 표시합니다.

양식을 설정해야 합니다. 유형: application/x-www-form-urlencoded 또는 Content-Type: multipart/form-data 이 경우 양식 데이터는 요청 페이로드입니다. 키는 어떤 값에 해당하므로 xx=xx 형식으로 표시됩니다. 배열이 문자열로 변환된다는 점에 유의해야 합니다.

따라서 전송해야 할 데이터가 키-값 쌍뿐인 경우에는 Form을 사용하는 것으로 충분합니다(중첩 배열 및 객체 등).

다음으로 다양한 매개변수 전달 상황을 비교해보겠습니다~

첫 번째 경우, 일반 문자열 전달
JQuery:

let params = {
    a: 1,
    b: 2
}
// 第一种方法:
$.ajax({
        "dataType": 'json',
        "type": "GET",
        "url": "your_request?" + $.param(params)
})

//第二种方法:
$.ajax({
        "type": "GET",
        "url": "your_request",
        "data": params
})

AngularJS:

var conf = {
    method: 'GET',
    url: 'your_request',
    params: {
        a: 1,
        b: 2
    }
};

$http(conf).then(function(response){
    console.log(response.data);
}, function(){
    console.log("error");
}).finally(function(){
    console.log("finally");
});

두 번째 경우: Post form 데이터
JQuery :

let params = {
    a: 1,
    b: 2,
    ary1: [3,4,5]
}

$.ajax({
    "type": "POST",
    "url": "your_request",
    "data": params
})

AngularJS:
데이터는 URL 인코딩된 문자열로 변환되어야 합니다.
ContentType은 전송된 데이터 형식이 Form

var conf = {
    method: 'POST',
    url: 'your_request',
    data: $.param({
        c: 3,
        d: 4
    }),
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
};

임을 지정하기 위해 'application/x-www-form-urlencoded'로 설정되어야 합니다. 세 번째 경우: 사용 Post 매개변수에 대한 RequestPayload
JQuery:
contentType을 "application/json"으로 설정하고 매개변수 직렬화

let params = {
    a: 1,
    b: 2,
    ary1: [3,4,5]
}

$.ajax({
    "type": "POST",
    "url": "your_request",
    "data": JSON.stringify(params),
    "contentType": "application/json"
})

AngularJS:

var conf = {
    method: 'POST',
    url: 'your_request',
    data: {
        c: 3,
        d: 4
    }
};

때때로 서버가 null 응답을 반환하면 Firefox에서 xml 구문 분석이 발생합니다. 오류는 Firefox에서 xml을 사용하여 서버 반환 값을 기본적으로 구문 분석하며, null 반환 값이 발생하면 구문 분석 오류가 발생합니다.
JQuery에서 mimeType을 설정하면 문제가 해결될 수 있습니다

$.ajax({
        "dataType": 'json',
        "type": "GET",
        "url": "your_request",
        "mimeType": "json"
})

AngularJS에서 mimeType을 설정하는 것이 더 어렵습니다. https://github.com/angular/an...을 참조하세요.

오류 또는 더 많은 솔루션 제안을 환영합니다. 감사합니다. 너!

위 내용은 이 글의 전체 내용입니다. 모든 분들의 학습에 도움이 되었으면 좋겠습니다. 더 많은 관련 내용은 PHP 중국어 홈페이지를 주목해주세요!

관련 권장 사항:

angularJs ng-repeat를 사용하여 테이블 병합 행 효과 수행

ztree는 확인된 노드 데이터를 가져오고 이를 양식 정보와 병합합니다

위 내용은 Jquery 및 AngularJS의 Get/Post에서 매개변수 전달의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!