Предоставлять статическую предварительно отрендеренную версию приложения 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,

0 ответов

Другие вопросы по тегам