у нас есть проект, с nextjs, примитивной сагой, набором текстов
SSR очень важен для нашего веб-приложения, но у нас также есть много соответствующих виджетов на каждой странице.
Вот почему наша страница имеет модульную структуру, где каждый виджет (1-2 на страницу) загружает необходимые данные.
Эти виджеты сейчас актуальны для SEO.
Моя проблема в том, что запросы API не выполняются на стороне сервера. Прямо сейчас он только возвращает defaultState каждого виджета на сервере и загружает их только на клиенте.
Я искал и нашел много инструкций о том, как это сделать, но все они полагаются на тот факт, что nextjs ожидает метод "getInitialProps", пока не вернет результат с сервера.
Поскольку этот метод жизненного цикла доступен только в папке «pages», он не работает для меня.
Кроме того, если я заблокирую компонент getInitialProps, он никогда не будет визуализирован.
Наши страницы структурированы, как показано ниже:
- pages/Home
- <HomeContainer ...> (fetches data for the main page)
- <HomeComponent >
- <Widget1Container ...> (fetches data)
- <Widget2Container ...> (fetches data)
Я хочу, чтобы серверная часть ждала все предоставленные запросы, прежде чем она вернет страницу пользователю.
Из-за сложной природы различных виджетов на странице невозможно создать «комбинированную» конечную точку, в которой мы получаем данные в папке «pages / Home».
Я знаю, что это не идеально, но как мы можем убедиться, что сервер фактически выполняет все 3 запроса (homecontainer, widget1container, widget2container) и ждет там ответов, прежде чем вернуться?
Я бы хотел, чтобы это было как у angular-universal. Просто подождите, пока не появятся открытые запросы или обещания, а затем просто выполните.
Есть идеи?
Любая помощь или идеи высоко ценятся.
спасибо