Logo Taedi's Log
    Logo Inverted Logo
    • Tags
    • ajax
    • blog
    • deploy
    • dns
    • eclipse
    • github pages
    • hugo
    • java
    • log
    • macOS
    • maven
    • modal
    • Mybatis
    • OCI
    • pip
    • pipenv
    • pyenv
    • python
    • sever
    • Spring
    • tistory
    • tomcat
    • VanillaJS
    Hero Image
    [Vanilla JS]Ajax 함수 모듈화

    개인 프로젝트나 팀 프로젝트 할 것 없이 Ajax 를 매우 많은 곳에 사용했는데 그때마다 코드를 작성하려니 contentType 같이 외우기 까다로운 부분도 있고 코드도 길어진다고 판단하여 모듈화를 하여 사용하였다. 개인적으로 post 방식으로 json 데이터를 사용하는 경우가 많아서 기본값으로 두었고, 데이터는 “json / multipart / urlencoded” 에 대한 부분만 고려했다. 코드는 짧지만 불필요한 if 문이라던지(막상 지우려니 잘 안된다..) 깔끔해 보이지 않아서 한참이나 고민했지만 결국 만족할 만큼 다듬지 못한 것 같다. 시도해본 것 ajax 통신 이후 결과 여부에 따라 지정한 콜백함수 호출 필요한 전달인자만 입력하면 되도록 코드 'use strict'; /** * Vanilla JavaScript Ajax 함수 모듈화 * * @param {string} url - (required) 호출 할 url * @param {object} data - (optional) 전송 할 데이터 * @param {function} confirmCallback - (optional) ajax 통신 완료 후 실행 할 함수 * @param {function} cancelCallback - (optional) ajax 통신 실패 시 실행 할 함수 * @param {string} method - (optional) post / get / put .

    2021년 12월 05일 Read
    Contact
    • taedi90@gmail.com
    • taedi90