[졸프] 회원가입 API 프엔 연동

회원가입/로그인 API까지 만들고 나서 프엔이랑 연동을 해보기로 했다!

물론 아직 완성 된건 아니지만 (닉네임, 번호, 이름 등등 확장시켜할 엔티티들이 남아있음) 기본적인 아이디, 패스워드까지는 구현을 했기 때문에 MVP 방식을 이용해서 최소한의 기능을 같이 연동해보기로 했다

---

연동 전 설정

(1) CORS 허용 설정

---

• CORS : 출처가 다른 웹 요청을 제한하는 보안 정책

우선 postman으로 테스트 하는거는 완성을 해놓은 상태여서 내가 추가적으로 설정해야하는 것이 있는지 확인했다.

다른 건 다 괜찮았지만 CORS 허용을 안해놓은 상태였기에 config 파일에 그 부분을 추가했다!

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
            .allowedOrigins("http://localhost:3000") // react일 때의 포트
            .allowedMethods("*")
            .allowedHeaders("*")
            .allowCredentials(true);
    }
}

(2) URL 설정

---

그리고 나는 당연히 내가 사용하는 URL인 http://localhost:8080/api/auth/register 을 넣어야하는 줄 알았는데, 이렇게 넣는다면 이건 내 PC local IP 주소로 가기 때문에 안된다! (나는 바보다)

상황	URL 설정
프론트랑 백엔드 같은 컴퓨터	http://localhost:8080/...
프론트랑 백엔드 다른 컴퓨터	http://<백엔드 컴퓨터의 IP>:8080/...

• 이런 식으로 내 IP 주소를 확인하고 프엔에 저 URL을 넘겨주면 된다!
• IP 주소 확인 cmd 접속 → ipconfig 명령어 입력
  

(3) Spring Boot 서버가 외부 요청을 받을 수 있도록 허용

---

application.yml 파일에 아래 코드 추가

server.address=0.0.0.0

• server: 이 부분에 넣으면 됨!

(4) Windows 방화벽 허용

---

1. 제어판 > 시스템 및 보안 > Windows Defender 방화벽 > 고급 설정
2. 인바운드 규칙 → 새 규칙
3. 포트 선택 → TCP, 포트 8080 → 허용
4. 프로필 모두 체크 (도메인, 개인, 공용) → 이름 정해서 저장

❓

여기서 질문 !!

Q ) 방화벽은 백엔만 열면 되나요?

A ) 방화벽은 백엔만 열면 됨!

프론트엔드 → 백엔드로 요청을 보낼 때:

• 프론트(클라이언트)는 단순히 요청(Request)을 보내는 입장이야.
• 백엔드는 요청을 받아들이는 입장이기 때문에 수신 포트(예: 8080)가 열려 있어야 함.

방화벽은 서버에서 외부 요청을 받을 수 있도록 허용하는 기능이기 때문에:

• 요청을 받는 백엔드 컴퓨터에서만 열려 있어야 함
• 요청을 보내는 프론트는 그냥 보내기만 하면 됨 → 방화벽 상관 없음

이거를 postman에서 테스트를 해보았는데, 계속 프엔 쪽에서 오류가 난다

오류 코드

Cloud Agent Error: Can not send requests to reserved address. Make sure address is publicly accessible or select a different agent. 

• 이건 Postman이 클라우드 모드에서 요청을 보내려고 했는데, 내가 입력한 주소 (192.168.x.x 또는 localhost)는 로컬 IP (사설 IP) 라서, Postman 클라우드에서는 접근할 수 없는 주소라는 뜻

→ 해결방법은 postman desktop 앱을 실행시켜서 하는 방법이 있음

→ 근데 timed out이라는 오류가 남

→ 이거는 프엔이 백엔의 서버에 전혀 접근을 하고 있지 못한다는 뜻

→ 오류 경우의 수를 다 하나하나 짚어보

---

timed out 오류 원인 분석

1. IP 주소 제대로 썼는지 확인

백엔드 서버가 실행된 컴퓨터에서:

ipconfig

• IPv4 주소 예: 192.168.0.23
• Postman에서는:

  
  http://192.168.0.23:8080/api/auth/register

• ❗ 절대 localhost 쓰면 안 됨

---

2. application.yml 또는 .properties에 server.address=0.0.0.0 추가했는가?

server:
  port: 8080
  address: 0.0.0.0

없으면 외부에서 접근 불가!

• 추가 후에는 서버 재시작 필수!

---

3. 방화벽에서 8080 포트를 허용했는가? (가장 흔한 원인)

Windows 방화벽에서 포트 열기:

1. Windows 검색창 → "고급 보안이 포함된 Windows Defender 방화벽"
2. 왼쪽 메뉴: 인바운드 규칙 → 새 규칙
3. 포트 → TCP → 특정 포트: 8080
4. 연결 허용 → 도메인/개인/공용 전부 체크
5. 이름: Spring Boot 8080 허용

---

4. 같은 네트워크(Wi-Fi)인지 확인

• 백엔드 PC, Postman 실행 중인 PC가 같은 공유기/네트워크에 연결되어 있어야 해
• 다르면 접근 자체가 안 됨

---

5. 서버가 실제로 실행 중인지 확인

• 백엔드 터미널에 Spring Boot 로그 떠 있어야 해
• 브라우저에서 http://localhost:8080/ 접속해봐서 뜨는지 확인
  • 비록 에러 페이지가 떠도 괜찮아 (서버가 열려있다는 의미)

---

6. Postman Proxy 설정 꺼졌는지 확인

1. Postman → Settings (우측 상단 톱니바퀴 아이콘)
2. Proxy 탭 → Use System Proxy, Global Proxy 전부 Off

• 알고보니 가상 서버 (AWS EC2) 를 쓰는거 아니면… 만나서 같은 와이파이로 해야한다는 것…
  • 둘다 플젝 경험이 많지 않아 이런 사소한 걸 놓쳤다…하지만 괜찮아 배워가는 거니까…

🙉

그래서 결론! 우선은 만나서 다시 해보기로 했고 내가 가능하다면 AWS EC2 인스턴스 생성을 통해 가상 서버를 구축하기로 했다! AWS 는 콘솔에서만 경험해봤지 실전 경험은 처음이라 조금 설레기도 한다…모든 API 연동 성공할 때까지 홧팅!