개발하는 고라니

팀 프로젝트를 진행하다가 JQuery를 안쓰고 Ajax를 사용하려니 코드량도 길고 반복되는 코드가 많아져서 조잡하지만 간단하게 ajax를 사용할 수 있는 모듈을 만들어보았다. 실용성은 그다지 모르겠으나.. 나의 의도대로 잘 동작하긴 한다. 이는 요긴하게 쓰일 수 있는 모듈이므로 차차 업데이트를 진행할 예정이다. function ajax(obj){ const xhr = new XMLHttpRequest(); var method = obj.method || 'GET'; var url = obj.url || ''; var data = obj.data || null; if(obj.contentType) xhr.setRequestHeader('Content-Type', obj.contentType); /* 성공/..

브라우저에서 댓글을 작성해 서버로 전송하는 과정 중 만난 문제와 그때의 해결방법을 기록하고자 한다. XMLHttpRequest 'POST' JQuery를 이용하지 않고 JS로 XMLHttpRequest를 만들어 서버로 JSON 데이터를 'POST'하는 과정에서 만난 오류는 다음과 같다. var reply = { content: content, bid: bid }; request.open('POST', url, true); request.setRequestHeader("Content-Type", 'application/json; charset=UTF-8'); request.send(JSON.stringify(reply)); 해당 URL로 JSON 형식의 데이터를 보냈는데, 이를 어떻게 받아야 할까? 우리는..

Ajax Ajax이전의 웹 요청은 문서요청이라서 매 요청마다 문서를 새로 받아왔다. 웹 개발을 하다보면 페이지를 새로고침 없이 데이터를 받아오거나, 데이터를 보내거나 등 작업이 요구될 때가 많은데 이같은 작업을 위해선 비동기적인 방법이 필요하다. Ajax(Asynchronous Javascript and XML)은 Javascript 라이브러리 중 하나이다. 비동기식 요청의 대표적인 라이브러리이다. 브라우저가 갖는 XMLHttpRequest 객체를 이용해 페이지를 다시 요청(Refresh)하지 않아도 데이터를 가져올 수 있는 기술이기도 하다. Javascript를 이용한 비동기 통신, 클라이언트와 서버간 XML 데이터를 주고받는다. 데이터 전송 Ajax를 알아보기 전에 동기식과 비동기식 데이터 전송은 어..

교재를 보며 ajax로 파일 업로드를 테스트하는데... $("input[name='aaa']") 이런 $ 를 사용하는 것은 다 되는데 $.ajax에만 오류가 발생하였다. 물론 Jquery CDN을 추가하였다. 근데도 왜 이러지 구글링해보다가 근데도 여전히 오류가 발생했다. 여기저기 소스코드를 들춰내며 대체 뭐가 문제인가 하고 마지막 즈음 브라우저의 소스를 봤는데 여전히 slim 버전 cdn을 가져오는 것이었다. ?????????????????????????????????????????????????????????? 난 분명히 바꿨는데? 아차 싶었다... 이클립스에서는 view 페이지가 변경되면 서버를 재시작하지 않아도 자동으로 반영해주지만, IntellJ는 추가적으로 설정을 해줘야 한다. 망치 아이콘 옆..