} else { const helmet = Helmet.renderStatic()
const withHelmet = (App: any, props: any) => { const sheet = new ServerStyleSheet() const body = renderToString(sheet.collectStyles(<App {...props} />)) const styles = sheet.getStyleTags() const helmet = Helmet.renderStatic() const title = helmet.title.toString() const meta = helmet.meta.toString() return template({ title, styles, body, meta }) }
function requesthandler (req, res) { let body = renderToString( <StaticRouter location={req.path} context={{}}> {renderRoutes(Routes) } </StaticRouter>) const helmet = Helmet.renderStatic() res.send(template({body, helmet})) }
/** * Function that generates the final response based on given params * @param {string} entry - entry url * @param {string} data - data provided by response * @param {function} res - function `res` passed by express * @param {string|int} [status=200] - response status * * @returns {undefined} */ const makeResponse = (entry, data, res, status = 200) => { const INITIAL = buildInitialState(entry, data, status); const STORE = makeStore(INITIAL); const BUILD = renderToString(<StaticRouter location={entry} context={{}}><Provider store={STORE}><App /></Provider></StaticRouter>); const HELMET = Helmet.renderStatic(); res.send(build(HELMET, BUILD, STORE.getState())); }
router.get('*', async (ctx, next) => { const context = {}; global.cookie = ctx.headers.cookie; global.cookieStorage = new Cookies(ctx.headers.cookie); store = createStore(reducer, middlewares()); const promises = getRoutePromises(routes, ctx, store.dispatch, [], context); await promiseAllWrapper(promises); const reactContent = renderToString(<AppContainer><App store={store} url={ctx.url} context={context} routes={routes}/></AppContainer>); const helmet = Helmet.renderStatic(); if (context.url && context.url !== ctx.url) { return ctx.redirect(context.url); } const initialState = store.getState(); // you can add something into the server initialState here... ctx.body = generateLayout(params, reactContent, helmet, initialState); ctx.status = 200; return next(); });
matchRoutes(routes(), req.url, store) .then(() => { const markup = ReactDOMServer.renderToString( <CookiesProvider cookies={req.universalCookies}> <Provider store={store} > <StaticRouter location={req.url} context={{}}> <App isServer /> </StaticRouter> </Provider> </CookiesProvider> ); const helmet = Helmet.renderStatic(); res.status(200).send(Template({ markup, helmet, assets, })); }) .catch(err => res.json(err))
const getHTML = (markup, initialState, styleTags) => { const helmet = Helmet.renderStatic(); return ( ` <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> ${helmet.title.toString()} ${helmet.meta.toString()} ${helmet.link.toString()} <script src="/client.js" defer></script> <script> window.__INITIAL_STATE__ = ${serialize(initialState)} </script> ${styleTags} </head> <body> <div id="app">${markup}</div> </body> </html> ` ); }
const helmet = Helmet.renderStatic();
const helmet = Helmet.renderStatic();
const helmetData = Helmet.renderStatic(); const baseTag = `<base href="${config.routing.basename}">`; const titleTag = helmetData.title.toString();
/** * Render SSR content * * @export * @param {string} url * @return {string} HTML page */ export default function render(url, store) { const reactRouterContext = {}; const sheets = new ServerStyleSheets(); const content = ReactDOMServer.renderToString( sheets.collect( <Provider store={store}> <StaticRouter location={url} context={reactRouterContext}> <ThemeProvider theme={theme}> <CssBaseline /> <App /> </ThemeProvider> </StaticRouter> </Provider> ) ); const helmet = Helmet.renderStatic(); return template(helmet, content, store, sheets.toString()); }
export default function serverRenderer({ clientStats, serverStats }) { return (req, res, next) => { const context = {}; const markup = ReactDOMServer.renderToString( <StaticRouter location={ req.url } context={ context }> <App /> </StaticRouter> ); const helmet = Helmet.renderStatic(); res.status(200).send(Template({ markup: markup, helmet: helmet, })); }; }
app.get('*', (req, res) => { const context = {}; const content = ReactDOMServer.renderToString( <StaticRouter location={req.url} context={context}> <App /> </StaticRouter>, ); const helmet = Helmet.renderStatic(); const html = ` <html> <head> ${helmet.title.toString()} ${helmet.meta.toString()} <script src="client_bundle.js" defer></script> <script>window.__INITIAL_DATA__ = undefined;</script> </head> <body> <div id="root">${content}</div> </body> </html> `; res.send(html); });
} else { const helmet = Helmet.renderStatic()
export default function serverRenderer({ clientStats, serverStats }) { return (req, res, next) => { const context = {}; const markup = ReactDOMServer.renderToString( <StaticRouter location={req.url} context={context}> <App /> </StaticRouter> ); const helmet = Helmet.renderStatic(); res.status(200).send(Template({ markup, helmet })); }; }