Can axios not redirect to /login on 401 response

[ImadBoumzaoued]

Hello I'm using a route called /sign-in for user authentication

when the api returns a 401 status code I get redirected to /login which doesn't exists
it would be nice if we could customize the 401 redirect route.

_{This question is available on Nuxt.js community (#c45)}

[PMK]

Because of this hard-coded URI: https://github.com/nuxt-community/modules/blob/master/modules/axios/plugin.js#L72

[pi0]

Will be enhanced soon allow customizing behaviour :)

[silverbackdan]

Is it going to be as simple as changing that 401 if statement to this?

if (error.response.status === 401) {
    <% if(options.loginRedirect) { %>
        return this.redirect(process.env.LOGIN_URL || '<%= options.loginURL %>' || '/login' )
    <% } else { %>
        error.statusCode = 401
        error.message = (process.env.UNAUTHORIZED_ERROR_MESSAGE || '<%= options.unauthorizedErrorMessage %>' || 'Unauthorized' )
    <% } %>
} else {
    error.statusCode = error.statusCode || parseInt(error.response.status) || 500
    error.message = error.message || error.response.statusText || (error.statusCode + ' (Internal Server Error)')
}

And perhaps adding some docs about the environment vars, options and 401 handling?

[silverbackdan]

this.redirect should be this.app.router.go now as well.

This works but I'm wondering how useful the automatic redirecting is anyway, perhaps leave this up to the user? Happy to make a PR with or without the redirect feature if you'd like me to (unless you're already had more features in mind)

// Nuxt friendly error handler
function errorHandler(error) {
  if (error.response) {
    // Error from backend (non 2xx status code)
    if (error.response.status === 401) {
      <% if(options.loginRedirect) { %>
        return this.app.router.go(process.env.LOGIN_URL || '<%= options.loginURL %>' || '/login' )
      <% } else { %>
        error.statusCode = 401
        error.message = (process.env.UNAUTHORIZED_ERROR_MESSAGE || '<%= options.unauthorizedErrorMessage %>' || 'Unauthorized' )
      <% } %>
    } else {
      error.statusCode = error.statusCode || parseInt(error.response.status) || 500
      error.message = error.message || error.response.statusText || (error.statusCode + ' (Internal Server Error)')
    }
    error.statusCode = error.statusCode || parseInt(error.response.status) || 500
    error.message = error.message || error.response.statusText || (error.statusCode + ' (Internal Server Error)')
  } else if (error.request) {
    // Error while making request
    error.statusCode = error.statusCode || 500
    error.message = error.message || 'request error'
  } else {
    // Something happened in setting up the request that triggered an Error
    error.statusCode = 500
    error.message = error.message || 'axios error'
  }
  // Display error page on unhandled promises
  if(process.browser) {
    return Promise.reject(error)
  } else {
    // Don't throw unhandled promises in SSR context
    return this.app._nuxt.error.call({$options: this.app}, {
      message: error.message,
      statusCode: error.statusCode
    })
  }
}

[silverbackdan]

As of PR #74 - you can now disable the error handler which may be enough to close this issue