TypeError: Cannot read property 'cancelToken' of undefined

[itsazzad]

const middlewareConfig = {
    interceptors: {
        request: [
            {
                success: function ({getState, dispatch, getSourceAction}, req) {
                    console.error(1, req);
                },
                error: function ({getState, dispatch, getSourceAction}, error) {
                    console.error(2, error);
                }
            }
        ],
        response: [
            {
                success: function ({getState, dispatch, getSourceAction}, req) {
                    console.error(3, req);
                },
                error: function ({getState, dispatch, getSourceAction}, error) {
                    console.error(4, error);
                }
            }
        ]
    }
};
const middleware = [
    multiClientMiddleware(clients, middlewareConfig),
    routerMiddleware(history)
];

export default createStore(
    reducers,
    composeEnhancers(
        applyMiddleware(...middleware)
    )
)

TypeError: Cannot read property 'cancelToken' of undefined
    at throwIfCancellationRequested (index.js?v=:72)
    at dispatchRequest (index.js?v=:84)

[liyuanqiu]

@itsazzad
I met this problem too, have you got some solutions?

[givingwu]

+1，I met too, @liyuanqiu, Have you solved it?

[givingwu]

Look the Comments

axios.interceptors.request.use(function(config) {
  console.log('request => config ====================================');
  console.log(config);
  console.log('request => config ====================================');

  // if u add new Chainable promise or other interceptor
  // You have to return `config` inside of a rquest
  // otherwise u will get a very confusing error
  // and spend sometime to debug it.
  return config;
}, function(error) {
  return Promise.reject(error);
});

[liyuanqiu]

@vuchan
That's right, you must return req/error in those callback functions.

[Wuruiyang]

If you write API.interceptors.request.use(config => { console.log(config) return config }) not forget return config

[MartinJesu]

@vuchan you are right after return it's working perfectly. Below is my working code,

axiosInstance.interceptors.request.use((request) => {
this.setState({ showSpinner: true});
return requestHandler(request);
}, (error) => {
console.log('Interceptor error', error);
this.setState({ showSpinner: false});
return Promise.reject(error);
});

axiosInstance.interceptors.response.use((response) => {
  this.setState({ showSpinner: false});
  return successHandler(response);
}, (error) => {
  this.setState({ showSpinner: false});
  return errorHandler(error);
});

[oceceli]

Config should be returned at the end

[hardeath950]

If you write API.interceptors.request.use(config => { console.log(config) return config }) not forget return config

thanks, a lot.

[premk92]

Look the Comments

axios.interceptors.request.use(function(config) {
  console.log('request => config ====================================');
  console.log(config);
  console.log('request => config ====================================');

  // if u add new Chainable promise or other interceptor
  // You have to return `config` inside of a rquest
  // otherwise u will get a very confusing error
  // and spend sometime to debug it.
  return config;
}, function(error) {
  return Promise.reject(error);
});

this saved my day. thanks :)

[GunelYusuf]

hi

[Janeonly300]

thanks,that's right ! bro