從 React 向 Django 發送 post 請求時出現 400（錯誤請求）

Question

我正在嘗試使用 react 和 redux 創建一個簡單的登錄頁面。 當我單擊登錄按鈕時，前端和后端都收到錯誤400(Bad Request) 。 我正在使用 simplejwt 身份驗證。

I have the following as part of the redux action (auth.jsx)

export const login = (email, password) => async dispatch => {
    const config = {
        headers: {
            'Content-Type':'application/json'
        }
    };
    const body = JSON.stringify({email, password});
    try{
        const res = await axios.post(`${process.env.REACT_APP_API_URL}/user/login`, body, config)

        dispatch({
            type: LOGIN_SUCCESS,
            payload: res.data
        })
        dispatch(load_user());
    }   catch (err){
        dispatch({
            type: LOGIN_FAIL,
    
        })
    }
        console.log('You hit the wrong url')
}

Redux DevTools 在 try 和 catch 塊中顯示 catch ``type(pin):"LOGIN_FAIL"`

Login.jsx

const Login = ({ login }) => {
  const [formData, setFormData] = useState({
      email: '',
      password: ''

  });

  const {email, password} = formData;
  

  const onChange = e => setFormData ({ ...formData, [e.target.name]: e.target.value});
  const onSubmit = e => {
        e.preventDefault();
        login(email, password);
  }
  return(
      <div className='container'>
          <Form onSubmit={e => onSubmit(e)}>
                <Form.Group className="mb-3" controlId="formBasicEmail">
                    <Form.Control type="email" placeholder="example@email.com" onChange={e => onChange(e)} required />
                </Form.Group>
                <Form.Group className="mb-3" controlId="formBasicPassword">
                    <Form.Control type="password" placeholder="Password" minLength='6' onChange={e => onChange(e)} required />
                </Form.Group>
                <Button variant="primary" type="submit">
                    Login
                </Button>
                
        </Form>
      </div>
  )
//  const mapStateToProps = state => ({

//  })
}

export default connect(null, {login}) (Login)

登錄后端 API 可以從await axios.post( ${process.env.REACT_APP_API_URL}/user/login part of the code where REACT_APP_API_URL=http://localhost:8000 . The problem now is that when I send a post request by clicking on the submit button to login a user, the content of the form電子郵件和密碼. The problem now is that when I send a post request by clicking on the submit button to login a user, the content of the form does is not passed along because the error on both frontend and backend is POST http://localhost:8000/user/login 400 (Bad Request )` 我該如何解決這個問題，或者更確切地說，我出了什么問題？

Answer 1

登錄 URL 錯誤 使用基於令牌的身份驗證應該是http://localhost:8000/rest-auth/login/ 。 你需要休息框架。