promise - Trouble adapting official React Router v4 Redirect(auth) example to make async request -
i modified official react-router v4 redirects(auth) sample fit spa. chose axios promise-based http client , set authenticate server. host following routes on server:`
register
login
loggedin
logout
i need 'block' on calls loggedin
use verify user session before proceeding. since copying official documentation, assumed close best practice.
here sample official documentation. ternary test calls local function returns true/false:
const authbutton = withrouter(({ history }) => ( fakeauth.isauthenticated ? ( <p> welcome! <button onclick={() => { fakeauth.signout(() => history.push('/')) }}>sign out</button> </p> ) : ( <p>you not logged in.</p> ) ))
here code:
const loggedin = async() => { return await axios.request({ method: "post", url: 'http://localhost:3000/loggedin', data: { //session data } }).then((response) => { console.log("loggedin") return true; }) .catch(error => { console.log(error) console.log("error loggedin") return false; }); } const profileroute = ({ component: component, ...rest }) => ( <route {...rest} render={props => ( (loggedin().then(async(res)=>{return res})) ? ( <component {...props}/> ) : ( <redirect to={{ pathname: '/login', state: { from: props.location } }}/> ) )}/> )
the promis returning correct result asynchronously, appears test inside custom route resolving , not waiting promise. there way enable this? idea of using examples official documentation, perhaps unworkable.
thanks.
Comments
Post a Comment