apache2.4 tomcat9.0 vue2.x 로 설정되어 있는 개발환경에서 was호출문제

Question

안녕하세요.vue프로젝트가 처음인 개발자입니다.apache2.4 tomcat9.0 vue2.x 로 설정되어 있는 개발환경에서 was호출이 안되고 있는데 설정 어느 부분을 확인해야 할까요?멀티도메인을 설치하려고 virtualhost에 80, 443포트로 두개를 설정했다가 vue프로젝트가 멀티가 안된다고 해서 하나를 삭제 했는데 잘 돌아가던 도메인설정을 삭제하고 새도메인을 올렸더니 서버단 호출이 안됩니다.index페이지설정을 어떻게 하는 건지 index페이지 호출도 안되는데 어떻게 설정해야할까요?다시 도메인 설정 복구하고 war도 이전으로 돌렸는데 잘 되던 도메인 호출에서도 백엔드 호출이 안되어 완전 폭망했습니다.설정을 어디서 부터 어디까지 어떻게 확인 해야할지 조언을 부탁드립니다.감사합니다.

Gear · Answer

was 호출이 안 된다고 하셨는데, 설정이 어떻고, 어떻게 호출했고, 어떻게 안 되는지 자세하게 설명을 해 주시는 게 좋습니다.어떤 의도를 갖고 어떻게 했더니 어떤 문제가 발생했는지 등을 제대로 알아야 제대로 된 도움을 드릴 수가 있겠지요.가령 이런 식으로 설명 하는 것입니다:okky.kr 도메인으로 운영중이며 아파치 설정은 아래와 같고, api 호출은 이런 식으로 하고 있으며,// Test.vue 이렇게 했더니 버튼을 클릭 하고 아무리 기다려도 alert 창이 안 뜨고 콘솔에Access to fetch at ‘https://okky.kr:8080/test’ from origin ‘https://okky.kr’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.이런 내용이 뜨더라~ 같은 식으로 말이죠아파치 설정 변경하기 전에 이 전 잘 돌아가던 설정 파일을 백업 해두시기 바랍니다.혹은 git으로 관리하면 더 좋을 것 같습니다.그리고 아파치를 재시작 혹은 리로드 하여 설정을 적용하기 전에, 설정이 올바른지 apachectl configtest 명령어로 확인할 수 있습니다.반드시 설정이 올바른지 확인 후에 적용 하시기 바랍니다.세팅을 어떻게 해야 할지 예시를 들어 설명 드리겠습니다.반드시 이렇게 해야 되는 것은 아니고, 이렇게도 할 수 있는 것입니다.아파치는 잘 몰라서 Nginx로 설명 드리겠습니다. 아파치로도 비슷한 방식으로 처리 하게 될 것입니다.server { listen 80; # 80 포트로 요청이 오면 return 301 https://$host$request_uri; # https로 리다이렉트 } server { listen 443 ssl; # 443 포트로 요청이 오면 ssl을 사용하며 server_name okky.kr; # okky.kr 도메인에 대한 설정이며 ssl_certificate /etc/ssl/certs/okky.kr/cert.pem; # 인증서 경로는 이렇고 ssl_certificate_key /etc/ssl/certs/okky.kr/key.pem; # 인증서 키 경로는 이렇고 location ^~ /api { # /api로 시작하는 경로로 요청이 오면 rewrite ^/api(.*) $1 break; # 요청 경로에서 맨 앞에 있는 /api를 제거 해주고 proxy_pass http://localhost:8080; # localhost의 8080 포트로 열린 was에 처리를 맡김 } location / { # 모든 경로에 대해 root /usr/share/nginx/html; # 해당 경로에 있는 파일들을 응답하게 하고 (vue 빌드 된 파일) index index.html; # index 파일은 index.html이며 try_files $uri /index.html; # 파일 못 찾으면 index.html 파일 응답 # 가령 /hello라는 페이지를 요청하면 /usr/share/nginx/html/hello를 찾을텐데, 그런건 없지요 # index.html을 응답 해줘야 올바르게 처리가 됩니다 } }이런 식으로 해놓고, 화면 쪽에서는 https://okky.kr:8080/test 가 아니라 /api/test로 요청을 하는 것입니다.제가 전에 Nginx + React + Spring boot 사용하여 배포하는 예시를 작성한 글이 있습니다.https://pauldirac.tistory.com/27Nginx가 아니라 Apache를 쓰시고 React가 아니라 Vue를 쓰시지만, 어느 정도는 참고가 될 것이라 생각 합니다.이 전 글을 보니 was는 스프링 부트로 개발을 하셨던데, 특별한 이유가 없다면 Tomcat을 따로 구동할 것 없이 jar로 빌드하여 구동할 수 있습니다.# example ./mvnw package cd target java -jar application.jar이렇게 하면 배포 환경에서 변경사항(가령 데이터베이스 계정 정보 변경 등)이 생길 때 application.yml, application.properties 내용을 수정해서 새로 빌드하여 배포 하거나 $TOMCAT_HOME/webapps/ROOT/webapps/WEB-INF/어쩌고 저쩌고 경로들어가서 수정하거나 할 필요가 없습니다.application.yml 혹은 application.properties 파일을 jar 파일과 같은 경로에 두고 실행하면 해당 설정 파일대로 적용이 됩니다.제가 메이븐으로만 예시를 들었지만, gradle도 wrapper가 있어서(gradlew) 비슷하거나 같은 방식으로 진행할 수 있을 것입니다.

봄날의차 · Answer

댓글만 봐도 힘이되네요.감사합니다.1.application.propertiesspringdoc.swagger-ui.path=/swagger-ui.htmlspring.datasource.driver-class-name=org.mariadb.jdbc.Driverspring.datasource.url=jdbc:mysql://IP:port/SID?useUnicode=yes&characterEncoding=UTF-8&allowMultiQueries=true&serverTimezone=Asia/Seoulspring.datasource.username=@@@@@@spring.datasource.password=@@@@@@# host-server.mybatis.mapper-locations=mapper/*.xmlserver.port=yyyyserver.tomcat.connection-timeout=1800000spring.mvc.async.request-timeout=1800000server.servlet.session.timeout=30mtomcat.ajp.protocol=AJP/1.3tomcat.ajp.port=????tomcat.ajp.enabled=truespring.servlet.multipart.maxFileSize=50MBspring.servlet.multipart.maxRequestSize=50MB#mail *****#domain = http://www.aaaa.com # 처음에 잘 돌던 도메인domain = http://www.bbbb.co.kr # 추가로 설정하려던 도메인#cors.allowed-origins=http://www.aass.com,https://www.aaaa.com,http://www.bbbb.co.kr,https://www.bbbb.co.kr => Cinfig.java에 설정됨clientIp = xxx.xxx.xxx.xxx2.C:\Apache\****\httpd-vhosts.conf 설정ServerAdmin webmaster@dummy-host.example.comDocumentRoot "${SRVROOT}/htdocs"ServerName aaaa.comServerAlias "/admin" "${SRVROOT}/htdocs/admin"ErrorLog "logs/aaaa.com-error.log"CustomLog "logs/aaaa.com-access.log" commonRewriteEngine OnRewriteCond %{HTTPS} offRewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI}ServerName aaaa.comServerAlias "/admin" "${SRVROOT}/htdocs/admin"ServerAlias www.aaaa.comProxyRequests OffProxyPreserveHost OnAllowEncodedSlashes NoDecodeSSLEngine onSSLCertificateFile "${SRVROOT}/conf/ssl/www.aaaa.com.pem"SSLCertificateKeyFile "${SRVROOT}/conf/ssl/www.aaaaa.com.key"SSLProxyEngine onProxyPass /api http://localhost:server.port timeout=10000ErrorLog "logs/api.aaaa.com-error.log"CustomLog "logs/admin.aaaa.com-access.log" commonServerAdmin webmaster@bbbb.co.krDocumentRoot "${SRVROOT}/htdocs"ServerName bbbb.co.krServerAlias *.bbbb.co.kr "/admin" "${SRVROOT}/htdocs/admin"ErrorLog "logs/bbbb.co.kr-error.log"CustomLog "logs/bbbb.co.kr-access.log" commonRewriteEngine OnRewriteCond %{HTTPS} offRewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI}ServerName bbbb.co.krServerAlias "/admin" "${SRVROOT}/htdocs/admin"ServerAlias www.bbbb.co.krProxyRequests OffProxyPreserveHost OnAllowEncodedSlashes NoDecodeSSLEngine onSSLCertificateFile "${SRVROOT}/conf/ssl/www.bbbb.co.kr_cert.pem"SSLCertificateKeyFile "${SRVROOT}/conf/ssl/www.bbbb.co.kr.key"SSLProxyEngine onProxyPass /api http://localhost:8082 timeout=10000ErrorLog "logs/api.bbbb.co.kr-error.log"CustomLog "logs/admin.bbbb.co.kr-access.log" commonProxyPass /api http://localhost:8082 timeout=10000이부분이 톰캣 호출하는 부분이 맞다면 같은 서버에 돌고 있는 톰캣 서버가 있긴합니다만 별 설정은 없고backend 부분은 C: estBackendServer 폴더에 별도로 war파일을 배포한 상태입니다만 backend 폴더 설정을 어디서 하는 지 모르겠습니다.어디서 찾아봐야 할까요..?그리고 어디서 vue설정된 경우 하나의 war에 하나의 도메인 설정이 된다고 해서 처음엔 잘 돌아가던aaaa.com 설정을 지웠다가 다시 virtualhost설정을 넣었더니 이 도메인에서도 backend로 연결이 안되고 있습니다.해서 처음 도메인을 입력하고 호출할 때 웰컴페이지도 404네트워크 오류 가 뜨고 있네요....설정을 몰 어떻게 잘못 한 건지 모르겠네요.ProxyPass 부분을 설정하면 백앤드 부분을 호출 할 수 있을 줄 알았는데...영 설정을 잘 모르겠습니다.그리고 소스상에서 API 호출은 http로 하지 않고 /classAliasName/methodAliasName 형식으로 되어 있습니다.조언 부탁드립니다.감사합니다.

apache2.4 tomcat9.0 vue2.x 로 설정되어 있는 개발환경에서 was호출문제

2개의 답변

Q&A 목록