在服务器上,我尝试使用react-helmet-async
从嵌套的子组件中获取Helmet meta和title标签,因为react-helmet
无法正常工作。但这似乎也不起作用,我总是得到一个空的标题标签,没有返回元标签(它们都设置在子组件中)
const helmetContext = {};
const app = (
<ApolloProvider client={client}>
<HelmetProvider context={helmetContext}>
<Router location={req.url} context={staticContext}>
<CookiesProvider cookies={req.universalCookies}>
<App />
</CookiesProvider>
</Router>
</HelmetProvider>
</ApolloProvider>
);
//Traverses Component tree and executes all queries
getDataFromTree(app).then(() => {
const content = ReactDOMServer.renderToString(app);
const state = client.extract();
const { helmet } = helmetContext; // This is always empty
const html = ReactDOMServer.renderToString(
<Html content={content} helmet={helmet} assets={assets} state={state} initData={initData}/>,);
res.status(200);
res.send(`<!doctype html>${html}`);
res.end();
}).catch(e => {
console.error('RENDERING ERROR:',e);
res.status(500);
console.log(e.stack);
res.end(
`An error occurred.:\n\n${
e.stack
}`
);
});`
有关如何从子组件访问嵌套的Helmet标签的任何帮助。我也将HelmetProvider
包裹在客户端上。它在客户端上可以很好地工作,但是在服务器上,它没有从嵌套组件中选择任何标签。我没有流式传输响应,这是一个简单的SSR设置。这有点违反了设置SSR的目的,因此我非常感谢您的帮助。谢谢!