Redux 调度 index.html 的内容

Redux dispatches the content of index.html

在测试动态创建的 link TO 时,我的 React 应用发生了一些问题,现在 redux 正在返回 index.html 的内容。我以前见过这个,但忘记了我是如何修复它的。目前的设置已经工作了几个月,所以我不想疯狂地改变一切。我通过在发送前检查 '' 解决了用户登录的 html 问题,但随后的发送会成功然后立即失败并且还包含 index.html 的内容.我创建了一个新用户,同样的事情发生了。我检查了数据库,清除了浏览器数据,检查了 DevTools 中的应用程序存储,并重置了我的电脑。真正奇怪的部分是我在测试服务器上的版本正在做同样的事情,它不会加载到另一台设备上。这是我在 React Developer Tools 中看到的状态示例:

token:null
isAuthenticated:true
loading:false
user:"<!doctype html><html lang="en"><head><meta charset="utf-8"/> .."

如果不是我的电脑那么比较两个版本怎么会破坏它们?

编辑

加载用户操作

export const loadUser = () => async dispatch => {
  if (localStorage.token) {
    setAuthToken(localStorage.token);
  }
  try {
    const res = await axios.get(`${API_PREFIX}/auth`);
    dispatch({
        type: USER_LOADED,
        payload: res.data
    });
  } catch (error) {
    dispatch({
        type: AUTH_ERROR,
        payload: error.message
    });
}}

后端

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

减速机

const initialState = {
    token: localStorage.getItem('token'),
    isAuthenticated: null,
    loading: true,
    user: null,
    online: null,
}

export default function(state = initialState, action) {
  const { type, payload } = action;
  switch(type){
    case USER_LOADED:
    return {
        ...state,
        isAuthenticated: true,
        loading: false,
        user: payload
    }
    case REGISTER_SUCCESS:
    case LOGIN_SUCCESS:
    console.log(`\n\n\nLOGIN PAYLOAD: ${JSON.stringify(payload)}`)
        localStorage.setItem('token', payload.token);
        return {
            ...state,
            ...payload,
            isAuthenticated: true,
            loading: false
        }
    case REGISTER_FAIL:
    case AUTH_ERROR:
    case LOGIN_FAIL:
    case LOGOUT:
        localStorage.removeItem('token');
        return { 
            ...state,
            token: null,
            isAuthenticated: false,
            loading: false
        }
    case ONLINE:
    return{
        ...state,
        online: payload
    }
    default:
        return state;
}
}

您是在请求获取用户对象吗?我认为它只是获取一个站点(可能是你自己的)而不是获取用户对象。

请分享您获取用户并将其存储到状态的代码

原来问题不是 redux。我添加了 app.get('/*' ... 包罗万象,以防止在重新加载时出现“Cannot GET /route”,但它在我的路由之前,这意味着我的 api 调用正在返回 html.

之前(server.js):

const root = require('path').join(__dirname, 'client', 'build');
app.use(express.static(root));
app.get('/*', (req, res) => {
    res.sendFile('index.html', { root });
});
app.use(...);

之后:

app.use(...);
...
app.get('/*', (req, res) => {
    res.sendFile('index.html', { root });
}