خطا در صفحه لاگین react redux

سلام. من یک صفحه لاگین دارم و یک صفحه ای که میخواهم بعد از لاگین وارد شوم. در اینجا از ریداکس استفاده کردم و هنگامی که لاگین میشوم بمحض اینکه صفحه را رفرش میکنم مجددا به صفحه لاگین بر میگردد. اگر دوستان کمک بفرمایند ممنون میشود:

reduce.js:

import {

  USER_LOADED,

  USER_LOADING,

  AUTH_ERROR,

  LOGIN_FAIL,

  LOGIN_SUCCESS,

  LOGOUT,

  REGISTER_SUCCESS,

  REGISTER_FAIL

} from "../actions/types";

  

  const initialState = {

    isAuthenticated: null,

    token: localStorage.getItem("token"),

    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,

        isLoading: false,

        isAuthenticated: true,

        user: action.payload

      };

     

      case LOGIN_SUCCESS:

        localStorage.setItem("token", action.payload.access);

        return {

          ...state,

          ...action.payload,

          isLoading: false,

          isAuthenticated: true

        };

      case LOGOUT:

        return {

          ...state,

          isLoading: false,

          user: null,

          isAuthenticated: false,

          token: null

        };

     

      default:

        return state;

    }

  }

----------------------------------------------

action:

import axios from "axios";

import {

  USER_LOADING,

  USER_LOADED,

  LOGIN_SUCCESS,

  LOGOUT

} from "./types";

// axios.defaults.withCredentials = true;

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

  dispatch({ type: USER_LOADING });

  const token = getState().auth.token;

  const config = {

    headers: {

      "Content-Type": "application/json"

    }

  };

  if (!!token) {

    config.headers["Authorization"] = `JWT ${token}`;

  }

  axios

    .get("http://127.0.0.1:8000/api/user/", config)

    .then(res => {

      dispatch({

        type: USER_LOADED,

        payload: res.data

      });

    })

    .catch(err => {console.log('Error')

     

    });

};

export const loginUser = (user_name, password) => (dispatch, getState) => {

  const config = {

    headers: {

      "Content-Type": "application/json",

      Accept: "application/json"

    }

  };

  const body = JSON.stringify({ user_name, password });

  axios

    .post("http://127.0.0.1:8000/api/token/", body, config)

    .then(res => {

      dispatch({

        type: LOGIN_SUCCESS,

        payload: res.data

      });

    })

    .catch(err => {console.log('Error')   

    });

};

Store:

import { createStore, applyMiddleware } from "redux";

import reducers from "./reducers";

import thunk from "redux-thunk";

const initialStore = {};

const middlewares = [thunk];

const store = createStore(

  reducers,

  initialStore,

  applyMiddleware(...middlewares));

export default store;

 

برچسب ها:
پرسیده شده در: 4 سال قبل
آمار بازدید: 1034
جهت ارسال پاسخ ابتدا عضو سایت شوید.