प्रतिक्रिया राउटर सर्वर पर रीडायरेक्ट नहीं कर रहा है

Question

मेरे पास एक उच्च ऑर्डर घटक है जो जांचता है कि कोई उपयोगकर्ता प्रमाणीकृत है और यदि नहीं, तो एक अलग यूआरएल पर रीडायरेक्ट होगा।

इसका एक आइसोमोर्फिक ऐप है और यह क्लाइंट-साइड काम करता है लेकिन अगर मैं जेएस बंद कर देता हूं, तो सर्वर रीडायरेक्ट नहीं करता है।

if (!this.props.authenticated) { 
    this.context.router.push('/'); 
} 

मैं सर्वर पर इस बयान हिट कर सकते हैं और this.context.router लौट रहा है, लेकिन कुछ नहीं होता।

पूर्ण घटक:

export default (
    <Route path='/' component={App}> 
     <IndexRoute component={Welcome} /> 
     <Route path='/feature' component={requireAuth(Feature)} /> 
     <Route path='/signin' component={Signin} /> 
     <Route path='/signout' component={Signout} /> 
     <Route path='/signup' component={Signup} /> 
    </Route> 
); 

इस सर्वर प्रस्तुत करना है कोड:

import { RouterContext, match } from 'react-router'; 
import { Provider } from 'react-redux'; 
import { renderToString } from 'react-dom/server'; 
import React from 'react'; 
import reactCookie from 'react-cookie'; 

import configureStore from '../../shared/store'; 
import routes from '../../shared/routes'; 
import assets from '../../public/assets.json'; 

import { AUTH_USER } from '../../shared/actions/types'; 

export default function (req, res) { 
    match({ routes, location: req.url }, (error, redirectLocation, renderProps) => { 
     if (error) return res.status(500).send(error.message); 
     if (redirectLocation) return res.redirect(302, redirectLocation.pathname + redirectLocation.search); 
     if (!renderProps) return res.status(404).send('Page not found'); 

     const store = configureStore(); 

     // use cookies to retrieve token 
     const unplug = reactCookie.plugToRequest(req, res); // eslint-disable-line no-unused-vars 
     const token = reactCookie.load('token'); 

     // if we have a token, consider the user to be signed in 
     if (token) { 
      // we need to update application state 
      store.dispatch({ type: AUTH_USER }); 
     } 

     const content = renderToString(
      <Provider store={store}> 
       <RouterContext {...renderProps} /> 
      </Provider> 
     ); 

     const initialState = JSON.stringify(store.getState()); 

     return res.render('index', { content, assets, initialState }); 
    }); 
} 

Answer 1

आप अपने सर्वर साझा कर सकते हैं

import React, { Component, PropTypes } from 'react'; 
import { connect } from 'react-redux'; 

export default function (ComposedComponent) { 
    class Authentication extends Component { 
     static contextTypes = { 
      router: React.PropTypes.object 
     } 

     static propTypes = { 
      authenticated: PropTypes.bool 
     } 

     componentWillMount() { 
      if (!this.props.authenticated) { 
       this.context.router.push('/'); 
      } 
     } 

     componentWillUpdate(nextProps) { 
      if (!nextProps.authenticated) { 
       this.context.router.push('/'); 
      } 
     } 

     render() { 
      return <ComposedComponent {...this.props} />; 
     } 
    } 

    function mapStateToProps(state) { 
     return { authenticated: state.auth.authenticated }; 
    } 

    return connect(mapStateToProps)(Authentication); 
} 

और इस घटक मार्गों फ़ाइल के माध्यम से पहुंचा जा सकता है प्रतिपादन कोड? इसे शायद https://github.com/ReactTraining/react-router/blob/master/docs/guides/ServerRendering.md जैसे कुछ दिखने की आवश्यकता है, जहां आप redirectLocation ध्वज की जांच कर रहे हैं। उस redirectLocation को रैपर घटक के बजाय onEnter हुक का उपयोग करके वापस किया जा सकता है। onEnter हुक दस्तावेज here है।

नीचे टिप्पणी से अपडेट करें: ठीक है तो आपका सर्वर कोड सही ढंग से redirectLocation जांच रहा है, लेकिन रूटिंग कोड को को ठीक से सेट करने के लिए onEnter हुक का उपयोग करने की आवश्यकता है। इसलिए जैसा:

ठीक है, तो आप सही ढंग से redirectLocation सर्वर कोड में सम्मान कर रहे हैं, लेकिन redirectLocation केवल से भर जाता है एक onEnter हुक का उपयोग कर, इसलिए जैसे:

const userIsInATeam = (nextState, replace) => { 
    if (!isAuth) { 
    replace('/') 
    } 
} 

<Route path="https://stackoverflow.com/users/:userId/teams" onEnter={userIsInATeam} /> 

मुझे लगता है कि nextState होना चाहिए auth आप सहारा ऑथ की जांच करने के लिए इसमें तलाश कर रहे हैं।