//Postman //React App For my react app, when dispatching apiPostRequest() I am getting 401 unauthorized error when it hits API POST Request Middleware even though the user is authenticated and token is stored in local storage. The confusing part is that my GET and DELETE api requests work just fine. So I cannot figure out why then is POST api returning 401 unauthorized error? It works fine in Postman. Any help will be greatly appreciated.
//Accept request action
export const acceptRequest = (requestId) => ({
type : ACCEPT_REQUEST,
payload: requestId
});
// Accept request middleware
export const acceptRequestFlow = ({dispatch, getState}) => next => action => {
next(action);
if(action.type === ACCEPT_REQUEST){
const acceptRequestId = action.payload
console.log(acceptRequestId)
const URL = `/api/userConnections/acceptRequest/${action.payload}`;
dispatch(apiPostRequest(URL, setAuthorizationHeader(getState), acceptRequestId, ACCEPT_REQUEST_SUCCESS, ACCEPT_REQUEST_ERROR));
}
};
//API POST, DELETE, GET request actions
export const apiPostRequest = (url, config, body, onSuccess, onError) => ({
type: POST_API_REQUEST,
meta: {url, config, body, onSuccess, onError}
});
export const apiDeleteRequest = (url, config, id, onSuccess, onError) => ({
type: DELETE_API_REQUEST,
meta: {url, config, id, onSuccess, onError}
});
export const apiGetRequest = (url, config, onSuccess, onError) => ({
type: GET_API_REQUEST,
meta: {url, config, onSuccess, onError}
});
//API POST, DELETE, GET request middleware
export const api = ({dispatch}) => next => action => {
if(action.type === POST_API_REQUEST) {
const {url, config, body, onSuccess, onError} = action.meta;
axios.post(url, config)
.then((data) => {dispatch({ type: onSuccess, payload: body})})
.catch(error => dispatch({ type: onError, payload: error }))
}
if(action.type === GET_API_REQUEST) {
const {url, config, onSuccess, onError } = action.meta;
axios.get(url, config)
.then((data) => {dispatch({ type: onSuccess, payload: data})})
.catch(error => dispatch({ type: onError, payload: error }))
}
if(action.type === DELETE_API_REQUEST) {
const {url, config, id, onSuccess, onError } = action.meta;
axios.delete(url, config)
.then((data) => { dispatch({ type: onSuccess, payload: id })})
.catch(error => dispatch({ type: onError, payload: error }))
}
return next(action)
};
//Setting Auth Header
export const setAuthorizationHeader = (getState) =>{
const token = getState().auth.token;
const config = {
headers:{
"Content-Type": "application/json"
}
}
if(token){
config.headers['x-authorization'] = token;
}
return config;
};
from React and Redux: 401 Unauthorized Error POST API Request
No comments:
Post a Comment