질문&답변
AZURE 등록후 백엔드 프론트엔드 각각 잘올라왔는데 로그인을 하려고 보니 아래와 같은 에러가 발생해서 문의드립니다.
안녕하세요 강사님 질문올린 후에 다시한번 코드를 수정해서 테스트 해봤는데 이번엔 어떤 오류도 발생하지 않고 새로고침만 실행 됬습니다. export default function Login() { const {dispatch} = useAppContext() const location = useLocation(); const history = useHistory(); const [errors, setErrors] = useState({}); // const [inputs, setInputs] = useState({}); const [username, setUsername] = useState('') const [password, setPassword] = useState('') const [loading, setLoading] = useState(false); const [formDisabled, setFormDisabled] = useState(false) const {from: loginRedirectUrl} = location.state || { from: {pathname : "/"} } const onSubmit = () => { // e.preventDefault() setErrors({}); const data = {username, password} axiosInstance.post("/accounts/token/", data) .then(response => { const { data : { token: jwtToken, } } = response dispatch(setToken(jwtToken)) history.push(loginRedirectUrl) }) .catch(error => { if (error.response) { setErrors({ username: (error.response.data.username || []).join(""), password: (error.response.data.password || []).join(""), }); console.log('데이터 수신불가') console.log(error.response) history.go() } }) .finally(() => { setLoading(true) }); }; useEffect(() => { const isEnable= Object.values(username).every(s => s.length > 0); setFormDisabled(!isEnable) }, [username]) const onUsernameChange = (e) => { setUsername(e.target.value) } const onPasswordChange = (e) => { setPassword(e.target.value) } return ( {/* Start Header */} {/* End Header */} ) }} /> {errors.username} ) }} /> {errors.password} Login Sign Up 로컬해서 테스트할 떄는 정상적으로 작동하는데.... 혹시 프론트는 로컬과 클라우드로 올릴때 코드가 다르게 적용되는 부분이 있나요? 위 코드는 Material UI 프레임워크를 사용해서 테스트하여 onFinish가 아닌 onSubmit으로 구현하였습니다.
- 좋아요수
- 0
- 댓글수
- 2
- 조회수
- 242