Vue 프로젝트 진행하기

Axios를 이용한 RESTFUL 사용시 CORS 오류 발생시 처리

달빛가면 2020. 10. 6. 18:18

프로젝트를 하면서 Vue와 Spring Boot를 이용하여 구성을 하였다

restful server와 연결 잡업을 하기 위해서 개발 셋팅을 하고 있는데 ㅡ.ㅡ

server는 8880으로 port를 설정하고

vue node server는 8800으로 셋팅 후 테스트를 하는데 ㅡ.ㅡ 계속 CORS 오류가 발생을 하는 것이다 ㅡ.ㅡ

아 열받아 ......ㅋㅋ

해결책은 바로

Vue Config파일에 

더보기

module.exports = {
dev: {

// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {
"/api": {
target: 'http://localhost:8880',
changeOrigin: true,
secure: false,
headers: {'Access-Control-Allow-Origin': '*'},
pathRewrite: {
"^api":"/api"
}
}
},

여기서 중요 한것은 proxyTable 셋팅이 중요 했다

테스트가 힘들거나 어쩔 수 없이 다른 서버를 이용 해야 한다면

이런 식으로 참고 하면 좋을 것이다