Jongmo-kim / Personal-NAS

0 stars 0 forks source link

테스트용 코드를 설정합니다. #9

Closed Jongmo-kim closed 2 years ago

Jongmo-kim commented 2 years ago

Backend에 /greetings URL Mapping을 추가하여 통신이 가능한지 테스트합니다. Frontend에 backend의 /greetings 을 호출해서 정상적인 통신이 가능한지 테스트합니다.

Jongmo-kim commented 2 years ago

Frontend에서 backend의 api호출시 CORS에러가 발생합니다. 백엔드 서버에서 이를 허용할수 있게 CORS설정을 추가합니다.

Access to fetch at 'http://localhost:9090/api/greeting' from origin 'http://localhost:8080' 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.

또한 프론트엔드 서버에서 backend의 api호출할때 url의 호스트 부분을 어떻게 가져올지 고민합니다. (/localhost:9090 부분)

Jongmo-kim commented 2 years ago

frontend 폴더에 vue.config.js 파일을 다음과 같이 설정하면 webpack단위에서 요청을 변환해줍니다. 자세한사항은 (https://evan-moon.github.io/2020/05/21/about-cors/)를 참고했습니다.

  devServer: {
    proxy: {
      '/': {
        target: 'http://localhost:9090',
        changeOrigin: true,
        pathRewrite: { '^/': '' },
      },
    }
  },
Jongmo-kim commented 2 years ago

테스트용 코드가 구현되었으므로 이슈를 닫습니다.