일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- air 환경변수
- go디자인패턴
- go 맥
- go 맥 air
- go channel
- git
- go air 환경변수
- go 마스코트
- 골랑 고퍼
- gin middleware
- go 맥 air 환경변수
- go 패닉
- go clean architecture
- gopath 환경변수
- go middleware
- go 환경변수
- go recover
- 좀비고루틴
- go air
- 고루틴 채널
- go 대기그룹
- go panic
- 개발자
- 신입개발자
- gin logger
- go
- go 캐릭터
- clean architecture middleware
- gin recovery
- golang gopher
- Today
- Total
뽀미의 개발노트
ajax에서 promise 쓰기 본문
프로젝트를 하다보면 비동기 처리를 할 때가 많다.
내가 짠 코드를 예로 들면 이런 것이다.
function requestPay() {
IMP.request_pay({
pg: "kcp.INIBillTst",
pay_method: "card",
merchant_uid: "IMP" + makeMerchantUid, // 주문번호
name: "인터넷강의 수강신청",
amount: 500, // 숫자 타입
buyer_email: "이메일주소",
buyer_name: "권보미",
buyer_tel: "전화번호",
buyer_addr: "주소",
buyer_postcode: "우편번호"
}, function (rsp) { // callback
console.log(rsp);
if(rsp.success) {
alert('결제가 완료되었습니다.');
paymentComplete = true;
} else {
alert('결제에 실패하였습니다. 에러 내용 : ' + rsp.error_msg);
paymentComplete = false;
}
// 콜백 함수 내에서 두번째 ajax 통신 시작
$.get('doRegisterAfterPayment', {
classId : ${group.id},
paymentComplete : paymentComplete
}, function(data) {
alert(data);
location.replace('/');
}, 'text');
});
}
ajax로 controller에 갔다왔다가 가져온 결과로 다시한번 더 ajax 통신을 해야할 때가 있는데
callback 함수 안에서 무작정 다시 ajax를 쓰는건 쫌 위험하다.
왜냐면 내가 원하는 순서대로 함수가 실행되지 않기 때문!!
ajax로 요청하고 아직 결과를 받아오지도 않았는데 계속 다음 함수의 결과를 요구하는
콜백 지옥에 빠질 수도 있다! 그때 쓸 수 있는 방법이 promise, 그리고 걔를 더 잘 쓸수 있도록 돕는것이 async, await이다.
promise는 ajax를 실행한 후 성공했을땐 resolve, 실패했을때는 reject로 인자를 전달하고 then 또는 catch로 받아서 할 일을 순차적으로 수행해주는 것임!! promise는 선언되는 순간 함수가 자동 실행되기 때문에 클릭해야만 실행되는 함수같은 경우 주의해서 써야한다.
https://tangoo91.tistory.com/42
[JavaScript] 자바스크립트 비동기 처리와 AJAX, promise(프로미스)
동기와 비동기 처리 동기와 비동기 처리 동기 처리(Synchronous Processing) : 하나의 작업이 끝난 뒤 다음 작업을 진행하는 순차적인 처리 방식 비동기 처리(Asynchronous Processing) : 하나의 작업의 종료까
tangoo91.tistory.com
https://velog.io/@holicholicpop/AJAX-new-Promise
AJAX _ new Promise
promise를 사용한 비동기처리
velog.io
https://learnjs.vlpt.us/async/02-async-await.html
02. async/await · GitBook
02. async/await async/await 문법은 ES8에 해당하는 문법으로서, Promise 를 더욱 쉽게 사용 할 수 있게 해줍니다. 기본적인 사용법을 알아봅시다. function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms));
learnjs.vlpt.us
https://ko.javascript.info/async-await
async와 await
ko.javascript.info
위 글들을 잘 읽어보고 ajax에 적용해보도록 하자.
'Trouble_Shooting' 카테고리의 다른 글
import에서 type이 not accessible 하다는 문제 (아직 해결 못함) (0) | 2023.06.14 |
---|---|
mybatis에서 if and 쓸 때 + jstl에서 if and 쓸 때 (0) | 2023.06.12 |
table에서 th z-index 처리하기 (0) | 2023.06.08 |
mysql에서 WITH AS 자꾸 오류 났던 이유... (2) | 2023.05.28 |
if(list == null) 은 잘못된 조건식이다!! (0) | 2023.05.26 |