GET Request Axios не любит неопределенный заголовок (x-auth-token)

Question

Итак, у меня есть приложение реагирования, в котором компонент navbar отказывается отображаться после обновления.Вызов axios конечной точке не работает, если значение x-auth-token заголовка не определено.

Я случайно установил sethAuthtoken в значение мусора, и это дает ошибку 401 , чтоимеет смысл, но если localstorage.token не имеет значения, я ничего не получаю, пока не истечет время ожидания со следующим сообщением net::ERR_EMPTY_RESPONSE

Это файл действий, на который ссылается панель навигации: Auth.js

import setAuthToken from '../utils/setAuthToken';

export const loadUser = () => async (dispatch) => {     if
 (localStorage.token) {         setAuthToken(localStorage.token);   }

const config = {
    headers: {
        "Content-Type": "application/json"
    }
};

try {
    const res = await axios.get("/api/auth", config);

    dispatch({
        type: USER_LOADED,
        payload: res.data
    });
} catch (err) {
    dispatch({
        type: AUTH_ERROR
    });
}};

Это внутренний маршрут

router.get("/", auth, async (req, res) => {
try {
    const user = await User.findById(req.user.id).select("-password");
    res.json(user).status(200);
} catch (error) {
    console.error(error.message);
    res.status(500).send("Server error");
}});

Это код компонента Navbar, которыйвызывает действие

import React, { Fragment } from "react";
import { Link } from "react-router-dom";
import { connect } from "react-redux";
import PropTypes from "prop-types";
import { logout } from "../../actions/auth";

const Navbar = ({ auth: { isAuthenticated, loading }, logout }) => {
    const authLinks = (
        <ul>
            <li>
                <a onClick={logout} href="!#">
                    <i className="fas fa-sign-out-alt" />{" "}
                    <span className="hide-sm">Logout</span>
                </a>
            </li>
        </ul>
    );
    const guestLinks = (
        <ul>
            <li>
                <a href="#!">Developers</a>
            </li>
            <li>
                <Link to="/register">Register</Link>
            </li>
            <li>
                <Link to="/login">Login</Link>
            </li>
        </ul>
    );//will load guestlinks if not authenticated, authlinks if authenticated
    return (
        <nav className="navbar bg-dark">
            <h1>
                <Link to="/">
                    <i className="fas fa-code"></i> DevConnector
                </Link>
            </h1>
            {loading ? null : (
                <Fragment> {isAuthenticated ? authLinks : guestLinks} </Fragment>
            )}
        </nav>
    );
};

Navbar.propTypes = {
    logout: PropTypes.func.isRequired,
    auth: PropTypes.object.isRequired
};

const mapStateToProps = (state) => ({
    auth: state.auth
});

export default connect(
    mapStateToProps,
    { logout }
)(Navbar);

Answer 1

Я просто поместил оператор else в файл действий auth, чтобы он отправлял AUTH_ERROR в редуктор, когда в localalstorage нет токена.

export const loadUser = () => async dispatch => {
  if (localStorage.token) {
    setAuthToken(localStorage.token);
  } else {
    dispatch({
      type: AUTH_ERROR
    });
  }