【问题标题】:Post request pending but data saved , how to make the request success?发布请求挂起但数据已保存,如何使请求成功?
【发布时间】:2020-10-20 18:56:44
【问题描述】:

所以我尝试使用 Axios 向服务器发送 POST 请求,以便注册新用户。 当我填写表格并提交时,请求处于待处理状态。当我使用 redux 工具和网络控制台时,我看到我发送到服务器的数据是正确的,当我尝试使用新用户登录时,即使 POST 请求状态仍处于挂起状态,我也成功了。为什么请求不成功?防止/跟踪此类错误的最佳方法是什么? 谢谢

store.js

import {createStore, combineReducers, compose, applyMiddleware} from 'redux';
import thunk from   'redux-thunk';
import {productDetailsReducer, productListReducer} from './reducers/productReducer';
import {cartReducer} from './reducers/cartReducer';
import Cookies from 'js-cookie';
import { userRegisterReducer, userSigninReducer } from './reducers/userReducer';

const cartItems= Cookies.getJSON("cartItems") || [] ;
const userInfo= Cookies.getJSON("userInfo") || null ;


const initialState={cart : {cartItems}   , userSignin: {userInfo}  };



const reducer = combineReducers({
    productList: productListReducer , 
    productDetails: productDetailsReducer   , 
    cart: cartReducer ,
    userSignin : userSigninReducer ,
    userRegister: userRegisterReducer
} );

const composeEnchancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose ; 

const store=createStore( reducer , initialState , composeEnchancer(applyMiddleware(thunk)) ) ;


export default store;

用户路由

router.post('/register' , async (req,res)=>{
    const user = User ({
        name : req.body.name , 
        email : req.body.email , 
        password : req.body.password,
       
    });

    const newUser = await user.save() ;

    if(newUser){
        res.send({
            _id:newUser.id ,
            name:newUser.name ,
            email:newUser.email,
            isAdmin: newUser.isAdmin ,
            token: getToken(signinUser)
            
        } );

    }

    else {
        res.status(401).send({msg:'invalid email or password'})
    }

})

动作



 const register = (name ,email,password)=>async dispatch=>{
    dispatch({ type: USER_REGISTER_REQUEST, payload:{name, email,password }});
    try {
        const {data}= await Axios.post("/api/users/register" , {name, email , password});
        dispatch({type:USER_REGISTER_SUCCESS , payload:data});
        Cookies.set('userInfo' , JSON.stringify(data));
    }
    catch(error){
       dispatch({type:USER_REGISTER_FAILED , payload:error.message});
    }
}

 export {signin , register }

减速器


function userRegisterReducer (state= {} , action){
    
    switch (action.type) {

        case USER_REGISTER_SUCCESS:
            return {loading: false , userInfo: action.payload};


        case USER_REGISTER_REQUEST:
            return {loading:true};


        case USER_REGISTER_FAILED:    
        return {loading:false , error:action.payload}
            
         
    
        default:
           return state ;
    }
}

来自 server.js app.use("/api/users" , userRoute);

【问题讨论】:

  • 当我 res.send(newUser) 时它确实有效。仅当我尝试 res.send({someObject}) 时才会出现问题

标签: javascript reactjs redux axios


【解决方案1】:

将实际状态添加到响应中怎么样?

res.status(201).send({
        _id:newUser.id ,
        name:newUser.name ,
        email:newUser.email,
        isAdmin: newUser.isAdmin ,
        token: getToken(signinUser)
        
    } );

【讨论】:

    猜你喜欢
    • 2017-03-13
    • 2021-05-19
    • 2021-12-20
    • 1970-01-01
    • 2017-02-11
    • 1970-01-01
    • 1970-01-01
    • 2014-06-01
    • 1970-01-01
    相关资源
    最近更新 更多