개발환경 Nuxt.js 2 Vue.js 2 Spring Boot 3요청사항 ❓ API에 권한을 입히면서 특정 API 사용 시 alert를 노출시키고 페이지 이동은 원하지 않는다는 요청사항이 있어 이를 구현하였습니다.개발 내용 💭 Back End에서 권한을 체크하는 AOP를 하나 만들어 체크를 원하는 API에 Annotation을 넣어 Exception처리를 하도록 구현하였습니다. Front End에서 해당 Error를 보고 권한에 대한 Error일 경우 alert를 발생시켜야 합니다. 문제발생 ❗ 공통적으로 처리하기위해 axiox.onError({})로직에 처리를 하려다 보니 무조건 적으로 Error 페이지로 이동하는 현상 발생 이는 Nuxt 설정으로 헤더 정보를 보고 Error 발생 시 error.vu..
axios
자바스크립트를 사용하면서 가장 많이 신경써야하는 부분이 바로 비동기 통신 부분이다. 이번에 비동기 통신 함수를 콜백함수로 호출할 수 있도록 수정하는 방법을 알게되어 정리해 둔다. 호출 할 함수 - 아래의 코드가 콜백함수로 구현한 비동기 통신 함수이다. return을 할떄에 Promise 객체를 생성해준다. - resolve는 결과가 잘 실행됐을때, reject는 error가 났을때에 실행된다. const getList = function("api"){ let url = api; return new Promise(function(resolve, reject){ sendAxios(apt, 'get').then(function(response){ resolve(response.data); }).catch(fu..
axios async getCategoryList(url, conceptScheme){ var responsData = await this.$axios.$get(url+ '?conceptScheme=' +conceptScheme) this.catgryList = responsData.list } fetch - fetch는 json으로 받아오지 않기 때문에 .then을 이용에 reponse값을 json형식으로 변환해 주어야 한다. async getCategoryList(url, conceptScheme){ var option = { method: 'GET', } await fetch(url+ '?conceptScheme=' +conceptScheme) .then(result => result.json())..
