jQuery에서 $.ajax 실패 처리
![jQuery에서 $.ajax 실패 처리](/img/jQuery/feature-image---jquery-$.ajax-failure.webp)
오늘의 게시물은 jQuery의 AJAX에서 실패 요청을 처리하는 방법에 대해 설명합니다.
jQuery에서 $.ajax
실패 처리
jQuery의 AJAX 게시 요청은 AJAX(비동기 HTTP) 요청을 수행합니다.
통사론:
jQuery.ajax([settings]).fail((jqXHR, textStatus) => {});
jQuery.ajax(url[, settings]).fail((jqXHR, textStatus) => {});
어디에:
URL
은 요청을 보낼 URL이 포함된 문자열입니다.settings
는 AJAX 요청을 구성하는 키/값 쌍 개체입니다. 모든 설정은 선택 사항입니다.$.ajaxSetup()
을 사용하여 각 옵션에 대한 기본값을 설정할 수 있습니다.
.fail()
접근 방식은 더 이상 사용되지 않는 .error()
접근 방식을 대체합니다. 이것은 오류 콜백 옵션에 대한 대체 구성입니다.
요청이 실패하면 AJAX
구성 내에서 error
콜백 옵션이 호출됩니다. 오류 유형을 나타내는 문자열인 jqXHR
과 예외 객체가 있는 경우 이를 수신합니다.
일부 내장 오류는 abort
, timeout
, no transport
와 같은 예외 개체로 문자열을 반환합니다.
$.ajax()
는 브라우저의 기본 XMLHttpRequest
객체의 상위 집합인 jQuery XMLHttpRequest
(jqXHR
) 객체를 반환합니다.
다음 예를 통해 이해해 봅시다.
참고: 다음 코드는 있는 그대로 실행할 수 없으며 출력이 없습니다. 출력을 보려면 기존 코드에 추가해야 합니다.
HTML 코드:
<form id="myForm">
<label for="name">Name</label>
<input id="name" name="name" type="text" value="Smith" />
<input type="submit" value="Send" />
</form>
자바스크립트 코드:
$('#myForm').submit(function(event) {
event.preventDefault();
$.ajax({
method: 'POST',
url: '/open/hello-world',
data: {name: 'Smith', location: 'United State'},
error: function(jqXHR, thrownError) {
alert(jqXHR.status);
alert(thrownError);
}
})
.done(function(msg) {
alert('Data Saved: ' + msg);
})
.fail((jqXHR, errorMsg) => {alert(jqXHR.responseText, errorMsg)});
})
위의 예에서 사용자가 양식을 제출하면 지정된 URL 및 매개변수를 사용하여 AJAX 호출이 서버로 전송됩니다. 서버가 성공적인 메시지와 함께 반환되면 콘솔에 메시지를 인쇄하거나 적절한 메시지로 사용자에게 알릴 수 있습니다.
서버가 오류 메시지와 함께 반환하면 오류 핸들러 또는 .fail()
을 사용하여 오류를 포착하고 적절한 오류 메시지로 사용자에게 알릴 수 있습니다.
Shraddha is a JavaScript nerd that utilises it for everything from experimenting to assisting individuals and businesses with day-to-day operations and business growth. She is a writer, chef, and computer programmer. As a senior MEAN/MERN stack developer and project manager with more than 4 years of experience in this sector, she now handles multiple projects. She has been producing technical writing for at least a year and a half. She enjoys coming up with fresh, innovative ideas.
LinkedIn