Here is my two API
export const loginUser = userData => dispatch => { axios .get('/api/users/login', params:{userdata:userdata}) .then(res => { // Save to localStorage const { token } = res.data; // Set token to ls localStorage.setItem('jwtToken', token); // Set token to Auth header setAuthToken(token); // Decode token to get user data const decoded = jwt_decode(token); // Set current user dispatch(setCurrentUser(decoded)); if(res.data.authorized === "authorized"){ axios.get('2nd api', {params:{user:userdata.email}}).then(res=> { console.log(res.data) //authorized })}else { console.log(res.data) // unauthorized } }) };
// Check for token if (localStorage.jwtToken) { // Set auth token header auth setAuthToken(localStorage.jwtToken); // Decode token and get user info and exp const decoded = jwt_decode(localStorage.jwtToken); // Set user and isAuthenticated store.dispatch(setCurrentUser(decoded)); }
In the components I used compententDidmount(){ this.props.loginuser() } Initially, I get two data first time , but When I refresh, I didn't see my second data in reducers and My auth is unauthorized. How can I solve this?
Diego Bernal
Front-End Engineer
Do you have a demo of this on codesandbox?