I am developing a web application and using axios to send and receive data. In this project, the token flow authentication system is updated and works well. But when the access token expires, first it shows xhr.js not allowed error, then it sends token update request, new tokens are received and new data is received with new tokens. Is there a way to prevent the xhr.js 401 error from showing the console
You can't prevent that, since it is built-in browser behavior. Eg once every 15 minutes each user gets a 401 if they look at the network tab of developer tools.
One option for minimizing 401s is to do a background token refresh before the access token expires. Eg do so on a background timer when the time gets close to the expires_in field received with access tokens.
Think of that as an optimization. If you use it you should also continue to combine it with your existing refresh handling. There are other reasons in addition to expiry for access tokens to be rejected with a 401. Personally I prefer to never use background access token renewal.