# 예시
# 현재 로컬 서버 http://localhost:8080
# 요청 서버 http://my.ysoftman.com:443
# 로컬에서 vue 개발시, 도메인이 다른 호스트 요청시 발생하는
# cors(Cross-origin resource sharing) 에러 해결을 위해
# vue.config.js (webpack) proxy 를 설정한다.
module.exports = {
// 로컬 개발시(이 파일 수정시 npm run serve 로 다시 시작해야함)
devServer: {
https: true,
// /api 로 시작하는 경로 요청을 target 으로 요청
proxy: {
'^/api': {
target: 'https://my.ysoftman.com:443',
changeOrigin: true,
},
disableHostCheck: true,
},
};
# 위와 같이 프록시 설정하면, cors 이슈도 없고, 쿠키등의 헤더도 잘 전달된다.
# 주의사항
# xmlhttprequest, axios 등으로 요청 호스트명을 빼서 로컬 호스트로 요청해야 한다.
# 그래야 위 (로컬서버에 대한) 프록시 처리가 된다.
#####
# 만약 호스트명이 필요한 실제 서비스 환경과 로컬 develop 개발 환경 구분이 필요한 경우
# host 변수을 두고 다음과 같이 process.env.NODE_ENV 에 따라 '' 로 설정해 처리하자.
let host = "http://my.ysoftman.com:443"
if (process.env.NODE_ENV != null && process.env.NODE_ENV == 'development')
{
return '';
}