만약 회원 가입을 위해 리액트에서 액션을 디스패치 한다면 data 형식은 어떻게 정해지나요?

Question

리액트에서 회원 가입이나 포스팅을 위한 post 액션을 디스패치 할경우 data로 뭘 날려야할지 자바 백엔드와 어떻게 협의하는지 궁금합니다. 예를 들어 서비스 계층에서 아래와 같이  user 정보를 전달받아  다음과 같이 저장할 경우 public User save(User user) { if (user.getId() == null) { user.setId(++usersCount); } users.add(user); return user; } 액션 요청할때 data에 무엇이 설정되어야 하는지 어떻게 협의되는지 문서를 통해 알려주는지 메신저를 이용하는지 아니면 타입 추론 같은 기능들을 이용하는지 궁금합니다.     const onSubmitForm = useCallback(() => {         console.log("게시글 추가 submit click !!");         console.log("text 확인 : ", text);         dispatch({             type: ADD_POST_REQUEST,             data: {                 text,             },         });    }, [text]);

Dowon Lee · Answer

안녕하세요, 이도원입니다.  React와 같이 외부 Front-end 기술을 이용해서 Spring boot를 사용하기 위해서는 말씀하신 data의 포맷을 맞춰서 전달할 필요가 있습니다. User라는 빈에 name, age, ssn 등의 필드가 존재한다면, React에서 JSON 포맷으로 {"name":"test", "age":20, "ssn":"111111-2222222"} 들의 포맷으로 전달하시면 됩니다. 그리고, Spring Boot에서는 CORS(Cross-Origin Resource Sharing) 오류가 발생할 수 있기 때문에, CoreRegistry 와 같은 클래스를 이용하여 CORS 설정을 허용해 주시면 됩니다.  감사합니다.

terecal · Answer

react에서 데이터 입력 액션을 디스패치할때 첨부해야 하는 데이터의 형식과 다른 포트 서버간의 통신 에러 방지 방법에 대해서 알려주셔서 감사합니다. 질문: React 등에서 java로 입력 데이터 전달 하는 방법: 답변: JSON 포맷으로 {"name":"test", "age":20, "ssn":"111111-2222222"} 들의 포맷으로 전달 질문: cors 에러 방지 방법(서버간 다른 포트로 인한 에러 문제 해결 방법): 답변: Spring Boot에서는 CORS(Cross-Origin Resource Sharing) 오류가 발생할 수 있기 때문에, CoreRegistry 와 같은 클래스를 이용하여 CORS 설정을 허용

만약 회원 가입을 위해 리액트에서 액션을 디스패치 한다면 data 형식은 어떻게 정해지나요?

질문: React 등에서 java로 입력 데이터 전달 하는 방법:답변: JSON 포맷으로 {"name":"test", "age":20, "ssn":"111111-2222222"} 들의 포맷으로 전달

질문: cors 에러 방지 방법(서버간 다른 포트로 인한 에러 문제 해결 방법):답변: Spring Boot에서는 CORS(Cross-Origin Resource Sharing) 오류가 발생할 수 있기 때문에, CoreRegistry 와 같은 클래스를 이용하여 CORS 설정을 허용

질문: React 등에서 java로 입력 데이터 전달 하는 방법:
답변: JSON 포맷으로 {"name":"test", "age":20, "ssn":"111111-2222222"} 들의 포맷으로 전달

질문: cors 에러 방지 방법(서버간 다른 포트로 인한 에러 문제 해결 방법):
답변: Spring Boot에서는 CORS(Cross-Origin Resource Sharing) 오류가 발생할 수 있기 때문에,
CoreRegistry 와 같은 클래스를 이용하여 CORS 설정을 허용