[jQuery] ajax

메모 생성 javascript 예시

// 메모를 생성합니다.
function writePost() {
	// 1. 작성한 메모를 불러온다.
	let contents = $('#contents').val();
	// 2. 작성한 메모가 올바른지 isValidContents 함수를 통해 확인합니다.
	if (isValidContents(contents) == false) {
		return;
	}
	// 3. genRandomName 함수를 통해 익명의 username을 만든다.
	let username = genRandomName(10);
	// 4. 전달할 data JSON으로 만듭니다.
	let data = {'username': username, 'contents': contents};
	// 5. POST /api/memos 에 data를 전달합니다.
	$.ajax({
		type: "POST",
		url: "/api/memos",
		contentType: "application/json",
		data: JSON.stringify(data),
		success: function (response) {
			alert('메시지가 성공적으로 작성되었습니다.');
			window.location.reload();
		}
	});
}

 

ajax?

GET, POST, PUT, DELETE를 지원해줌.

 

$.ajax({
type: "POST",
url: "/api/memos",
contentType: "application/json", //get에서는 사용 x
data: JSON.stringify(data),      //get에서는 사용 x
success: function (response) {
alert('메시지가 성공적으로 작성되었습니다.');
window.location.reload();
}
});

 

JSON.stringify?

JSON을 문자열로 만들어 줌.

함수에 JSON값 자체를 넣어줄 수 없어 문자열로 변환하여 전달.