Я пытаюсь реализовать базовый SSR с Redux из документации со списком покупок.HTML обслуживается и отображается правильно, но затем возникает вышеупомянутая проблема.Похоже, что пакет не обслуживается, и мне интересно, где я ошибся.
Я попытался изменить путь, чтобы увидеть, была ли ошибка в моем синтаксисе.Я сканировал HTML миллион раз, но не вижу проблемы.Я читаю другие посты.Это кажется довольно распространенной проблемой.Ничто еще не решило проблему.Например, предложение добавить тег.
Настройка моего файла:
-client
-public
-bundle.js
-src
-actions
-components
-containers
-reducers
-server.js
-index.js
-ssrServer
-serverBundle.js
----- Код сервера:
Путь к комплекту:
app.use('/public', express.static(path.join(__dirname, '../public')));
----Функция с соответствующим html:
const renderFullPage = (html, preloadedState) => {
return
<!DOCTYPE html>
<html>
<head>
<base href="/" />
<title>Grocery List SSR</title>
</head>
<body>
<div id="app">${html}</div>
<script>
window.__PRELOADED_STATE__ = ${JSON.stringify(preloadedState).replace(
/</g,
'\\u003c'
)}
</script>
<script type='text/javascript' src="/public/bundle.js"></script>
</body>
</html>
}
----- функция для рендеринга и ответа на запрос get
const handleRender = (req, res) => {
const store = createStore(rootReducer);
const preloadedState = store.getState();
const html = renderToString(
<Provider store={store} >
<App />
</Provider>
);
res.send(renderFullPage(html, preloadedState));
}
---- вызов дескриптора render при первоначальном запросе get
app.use('/', handleRender);
app.listen(port, (err) => {
if (err) {
console.log(err);
} else {
console.log(`running on ${port}`);
}
});
----- файл index.js
const preloadedState = window.__PRELOADED_STATE__;
delete window.__PRELOADED_STATE__;`
const store = createStore(rootReducer, preloadedState);`
hydrate(<Provider store={store}>
<App />
</Provider>,
document.getElementById('app'));
Я ожидал, что пакет отправит и увлажнит HTML.Вместо этого я получил сообщение об ошибке в консоли Chrome.
Когда я запускаю код с узлом в режиме отладчика, я вижу, что начальные запросы get были успешными и что handleRender
запустилось.Затем производится звонок на /public/bundle.js
.Но это не похоже на статику.`
express:router dispatching GET /public/bundle.js +41ms
express:router query : /public/bundle.js +0ms
express:router expressInit : /public/bundle.js +1ms
express:router trim prefix (/public) from url /public/bundle.js +0ms
express:router serveStatic /public : /public/bundle.js +0ms
express:router logger : /public/bundle.js +2ms
express:router handleRender : /public/bundle.js +1ms
GET /public/bundle.js 200 665 - 2.171 ms
Извините, если это больше кода, чем нужно.Первый раз.