2023. 9. 6. 10:38ㆍ카테고리 없음
백단에서 오래 걸리는 작업이 있었다.
DB 조회를 많이 하기도 하고 파일을 A에서 B로 복사하는 작업도 있고 그 파일을 document 객체로 만들어서 내부를 수정하는 작업도 하고 완료되면 메일도 보내야하는 그런 작업.
그냥 육안으로 보기에는 화면에 변화도 없고 커서만 손 모양으로 나오는 탓에 사용자의 입장에서는 이게 눌린 건지, 처리가 되고 있는 것인지 알 수 없어 로딩바가 필요했다.
그래서 해당 작업 전에는 로딩바를 나타내고 작업 후에는 로딩바를 없애는, 이전에도 사용했던 그런 작업을 진행했는데 어째서인지 브라우저의 디버깅 모드로 실행했을 때에는 잘만 나타나던 로딩바가 일반적인 사용 환경에서는 나타나지 않는 문제가 있었다.
그렇게 3일을 버렸음
결론: https://bcdragonfly.tistory.com/76
[javascript] 동기 Ajax 로딩바_ ajax synchronous progressbar
[javascript] 동기 Ajax 프로그래스바_ loading bar for sync ajax [javascript] 동기 Ajax loading bar_ progress bar for sync ajax Ajax에서 async 즉, 동기/비동기를 적용하는 옵션이 있다. async를 true로 주면 비동기, false를 주
bcdragonfly.tistory.com
ajax에서 async를 false로 적용하게되면, ajax가 완벽하게 실행하는동안
자바스크립트 동작이 안되기 때문에 적용해두었던 로딩바 또는 프로그레스바가 작동하지 않게된다.
Ah,,,, 그래서 위의 링크에서 setTimeout을 이용한 해결 방법을 보게 되었다. 다른 방법으로는 promise 객체가 있다고 하는데 여러 ajax 처리를 하는 경우에는 promise를 이용한 방법이 좋을 듯.
나의 경우에는 promise에 자신이 없기도 하고 (2일 써봤음.. 재직자 교육 때....) 한 ajax 처리에서 늦게 끝나는 경우였기 때문에 해당 ajax를 setTimeout으로 실행하여 해결했다.
아 그런데 그 뒷 행을 먼저 실행해버려서 그런지 ajax로 받은 변수를 이용하여 처리할 작업이 있었는데 undifined 오류가 나서 그냥 그 뒤로 처리해야하는 작업들과 hide 처리 해야하는 작업들도 다 setTimeout 블럭 내부에 넣어 해결했다.
