Próbuję utworzyć uwierzytelnianie użytkownika w mojej aplikacji. Stworzyłem interfejsy API, które zostaną wywołane, gdy pojawia się żądanie w aplikacji, więc może uzyskać dane użytkownika za pomocą identyfikatora, które przekazałem w obiekcie żądania.

Problemem, który ma teraz, że kiedy nazywa się interfejs API, ponieważ użytkownik nie zalogował się, żeton jest NULL, a akcja (usoceded) nie jest wymyślona zamiast tego GetError i Autherror, który złapałem.

Moja konsola Redux pokazuje, że usługa została wysłana, ale GetError i Autherror nie zostali wysyłani.

To jest kod .....

The reducer
import {AUTH_ERROR, LOGIN_FAIL, LOGIN_SUCCESS, LOGOUT_SUCCESS, REGISTER_FAIL, REGISTER_SUCCESS, USER_LOADED, USER_LOADING} from '../action/types'

const initialState = {
  token : localStorage.getItem('token'),
  isAuthenticated : null,
  isLoading : false,
  user : null
}

export default function (state=initialState, action){

  switch (action.type) {

    case USER_LOADING:
      
      return {
        ... state,
        isLoading : true
      }

    case USER_LOADED:
      
      return {
        ...state,
        isAuthenticated :true,
        isLoading : false,
        user : action.payload
      }

    case LOGIN_SUCCESS:
    case REGISTER_SUCCESS:
      
      return {
        ...state,
        ...action.payload,
        isAuthenticated : true,
        isLoading : false
      }

    case AUTH_ERROR:
    case LOGIN_FAIL:
    case REGISTER_FAIL:
    case LOGOUT_SUCCESS:
      localStorage.removeItem('token') 
      
      return {
        ...state,
        token : null,
        isLoading : false,
        isAuthenticated : false,
        user : null
      }
  
    default:
      return state
  }



}

This is the action
import {AUTH_ERROR, LOGIN_FAIL, LOGIN_SUCCESS, LOGOUT_SUCCESS, REGISTER_FAIL, REGISTER_SUCCESS, USER_LOADED, USER_LOADING} from './types'

import {returnError} from './errorActions'


// So the first thing i have to do here is to check for a token and load it

export const userLoaded = () => (dispatch, getState) => {

  dispatch({type: USER_LOADING})

  // get the token from the current state

  const token = getState().auth.token

  // creating our header 

  const req = {
    headers : {"Content-Type":"application/json"}
  }

  // check if there's a token and if we have it, then we add it to the headers

  if(token){
    req.headers['x-auth-token'] = token
  }

  fetch('http://127.0.0.1:8000/auth/user', req)
  .then(res => res.json())
  .then(data => dispatch({
    type : USER_LOADED,
    payload : data
  }))
  .catch(err => {
    dispatch(returnError(err.response.data, err.response.status))
    dispatch({type: AUTH_ERROR})
  })
}




1
lovelyn marshall 21 listopad 2020, 19:48

1 odpowiedź

Najlepsza odpowiedź

Z pobieraniem błędów zostanie rzucony tylko wtedy, gdy połączenie jest w dół lub coś podobnego. Pobierz będzie nadal obsługiwać 401 lub 500 jako udany wniosek - co jest prawnie, ponieważ na poziomie połączenia nic się nie stało. Więc musisz sprawdzić kod statusu wyników na własną rękę i odpowiednio sobie z tym poradzić.

0
phry 22 listopad 2020, 12:23