2017-06-09 2 views
0

Following this stackoverflow postServer-Seite mit Rendering reagieren Router v4

Ich habe versucht, Server einzurichten Rendering mit reagieren-Router-v4

meine routes.js Datei:

var React = require('react'); 
 
import ReactDOM from 'react-dom'; 
 
import Appa from './components/app.js'; 
 
import Welcome from './components/welcome.js'; 
 
import { BrowserRouter as Router, Route,Redirect} from 'react-router-dom'; 
 

 
export default() => 
 
<Router> 
 
    <div> 
 
    <Route exact path="/" component={Appa} /> 
 
    <Route path="/home" component={Welcome} /> 
 
    </div> 
 
    </Router>;

server.js

import React from 'react'; 
 
import {renderToString} from 'react-dom/server'; 
 
import { match, RoutingContext,ServerRouter, createServerRenderContext } from 'react-router'; 
 
import Routes from './app/routes.js'; 
 
var express = require('express'); 
 
const app = express(); 
 

 
app.use(function(req,res,next) { 
 
const context = createServerRenderContext(); 
 
    let markup = renderToString(
 
    <ServerRouter location={req.url} context={context} > <Routes /> </ServerRouter>); 
 
    const result = context.getResult(); 
 

 
    if (result.redirect) { 
 
    res.writeHead(301, { 
 
     Location: result.redirect.pathname, 
 
    }); 
 
    res.end(); 
 
    } else { 
 
    if (result.missed) { 
 
     res.writeHead(404); 
 
     markup = renderToString(
 
     <ServerRouter location={req.url} context={context}> <Routes /> </ServerRouter>); 
 
    } 
 
    res.write(markup); 
 
    res.end(); 
 
    } 
 

 
}); 
 

 
app.get('*', function(req,res,next){ 
 
    
 
    res.sendFile(path.resolve(__dirname ,'/dist/index.html')); 
 
    
 
});

Immer, wenn meine app Routen/home es viel Zeit und laden dauert schließlich kann Shows nicht erhalten/home Bitte helfen Sie mir den Fehler im Code zu identifizieren

Antwort

0

Ich bin ziemlich sicher, dass Sie Ihre Rückruf-Parameter req und res geschaltet haben. Der Rückruf hat eine Signatur von function(req, res, next). Versuchen Sie, Ihre Verwendungsfunktion über die Deklaration des App Callbacks zu verschieben.

+0

, die von meiner Seite aber nach dieser Korrektur i gleiche Ausgabe nicht .... sowohl mit app.use() und app.get(), um diese nicht funktioniert .. –

+0

ich/home bin immer dumm war hat meinen Beitrag bearbeitet. Kannst du es noch einmal versuchen –

+0

Danke @stephen Ich versuchte es erneut mit deinen Vorschlägen, aber ich bekomme immer noch nicht/home und ich meine Frage mit dem aktuellen Code bearbeitet Es dauert ewig, um die/home page zu laden und schließlich gibt es nicht GET/home und ich bekomme console.log (req.url) Ausgabe als/home –

Verwandte Themen