Предоставлять статическую предварительно отрендеренную версию приложения create-реагировать на приложение только веб-сканерам
Я создал веб-приложение, используя create-react-app
а также react-router
, Он обслуживается express
сервер на сервере, который также работает с API GraphQL. Передний конец сайта обслуживается express
используя следующий код:
// Sending React Frontend Build
app.use(express.static(`${__dirname}/../frontend/build`))
app.get('/*', (req, res) => {
res.sendFile(path.join(__dirname, '../frontend/build/index.html'))
})
Теперь я пришел к выводу, что при использовании CRA веб-сканеры и веб-сайты социальных сетей не могут легко получить доступ к информации, поскольку содержимое страницы внедряется с помощью javascript.
Слишком поздно в этом проекте для меня, чтобы вернуться и начать что-то вроде nextjs
,
Простое решение, по-видимому, заключается в создании предварительно отредактированной версии веб-сайта с использованием безголового браузера и предоставлении этой версии только сканерам через своего пользовательского агента.
Для этого я попытался использовать react-snap
, который запускает пост yarn build
внешнего интерфейса для создания статических файлов HTML. Хотя это в основном работает (особенно с точки зрения веб-сканера), оно, похоже, нарушает некоторые функциональные возможности, поэтому для пользователей-людей я все еще хочу обслуживать пакет SPA, созданный yarn build
и предоставлять сканерам только статическую версию HTML.
Реализовано что-то вроде этого на сервере:
// Sending React Frontend Build
app.use(express.static(`${__dirname}/../frontend/build`))
app.get('/*', (req, res) => {
if (crawlerUserAgents.includes(req.headers['user-agent'])) {
// serve pre-rendered static HTML version of the web app
} else {
// serve normal injected version of the web app
res.sendFile(path.join(__dirname, '../frontend/build/index.html'))
}
})
Но вывод react-snap
кажется, не в состоянии создать изолированную статическую версию сайта в отдельной папке в build
папка. Поэтому я не могу представить одну версию для людей, а другую для веб-сканеров.
Есть ли способ обслуживать статическую версию сайта через Express с помощью react-snap
или что-то подобное? Я знаю о коммерческих решениях этого, но предпочел бы что-то простое через express
,