reactjs - Redux 调度 index.html 的内容

问题描述

在测试动态创建的链接时我的 React 应用程序发生了爆炸，现在 redux 正在返回 index.html 的内容。我以前见过一次，但忘记了我是如何解决的。目前的设置已经工作了几个月，所以我不想疯狂地改变一切。我通过在调度之前检查“<！doctype 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;
}
}

标签： reactjsreduxstatecreate-react-appdispatch

reactjs - Redux 调度 index.html 的内容

问题描述

解决方案

推荐阅读