рендеринг стороны сервера с помощью webpack

Question

Я использую Reactjs, webpack вместе с page.js (routing) для создания webapp. Webpack дает мне пакет bundle.js, который загружается на стороне клиента.

Я узнал, что метатеги og не могут сканироваться, если я загружаю их на клиенте, поэтому я должен реализовать его на стороне сервера (рендеринг на стороне сервера). Есть ли способ его реализовать?

(Я не нашел надлежащей документации об этом в сети).

Answer 1

Многие люди визуализируют «оболочку» html с другим языком шаблонов на сервере (так как только сервер должен отображать его). Вы не должны использовать React для рендеринга материала вне тела, используя обычные API (с этим есть известные проблемы). Однако вы можете использовать renderToStaticMarkup, что, по моему мнению, является более приятным, поскольку вы не вводите другой язык шаблона на сервере, чтобы отображать оболочку.

Конечно, это означает, что вы не можете обновить что-то вроде мета-описания или document.title в обычном режиме React, вам просто нужно сделать это с помощью обычного старого JavaScript. В качестве альтернативы я рекомендую react-helmet (который может изменять мета и заголовок, когда сервер также отображает).

Я сделал здесь пример, который может быть полезным - https://github.com/DominicTobias/universal-react/