velopert / learning-react

[길벗] 리액트를 다루는 기술 서적에서 사용되는 코드
568 stars 406 forks source link

24장 회원가입시 문제가 생길경우 하나의 solution #376

Open andrew950515 opened 1 year ago

andrew950515 commented 1 year ago

전 회원 가입이 잘 되지 않더라구요. 혹시 문제가 생긴다면 회원가입 후 network탬에서 register의 document를 잘 확인 해보시길 바랍니다. 저 같은 경우 확인을 해보니 post(username, password)를 계속 3000 port로 보내더군요.

pakage.json의 proxy 설정을 잘 해둔 상태였는데도 말이죠. 그래서 proxy문제일거라는 생각을 하지도 못했습니다. 중간 다른 코드의 문제인가 싶어 오탈자나 문법 검사를 오랫동안 했는데도 문제가 없는것으로 보였습니다.

혹시 저처럼 proxy 설정을 했는데도 불구하고 port가 계속 다른 곳으로 간다면

$npm install http-proxy-middleware 혹은 $yarn add http-proxy-middleware 를 통해 'http-proxy-middleware' pakage를 추가하신 다음 밑에 소스 코드를 작성 해주시면 되겠습니다.

src/setupProxy.js

const { createProxyMiddleware } = require("http-proxy-middleware");

module.exports = function (app) {
  app.use(
    "/api",
    createProxyMiddleware({
      target: "http://localhost:4000",
      changeOrigin: true,
    }),
  );
};

setupProxy.js 를 src폴더에 넣어 보세요. 그럼 proxy가 잘 작동할겁니다.

작동이 잘 되지 않는다면 network tab을 꼭 확인해보세요. 전 늦게 확인 하는 바람에 책 찢을번했네요... 저처럼 시간낭비 하지 않으시길 바래요 모두 화이팅하세요 d(^^)b