Next.JS: Resolver с обещанием не работает в тесте api-route-server-client-client-test на SSR - PullRequest
Новая
       50

Next.JS: Resolver с обещанием не работает в тесте api-route-server-client-client-test на SSR

4 голосов
/ 30 октября 2019

Используя пример next.js api-router-apollo-server-client-client . Когда я пытаюсь реализовать задержку в apollo/resolvers.js таким образом: 

export const resolvers = {
  Query: {
    viewer (_parent, _args, _context, _info) {
      return new Promise((resolve, reject) => {
        setTimeout(() => {
          resolve({ id: 1, name: 'John Smith', status: 'cached' });
        }, 1000);
      })
    }
  }
}

enter image description here

Это не работает в SSR. В состоянии SSR apollo данные пусты, но ожидаемые пользовательские данные { id: 1, name: 'John Smith', status: 'cached' }.

Я использую это также с sequelize для извлечения данных из базы данных, и это тоже не работает. Я предполагаю, что причина та же.

Возможно, я делаю что-то не так.

Клиентская часть работает нормально (данные отображаются после гидратации React).

Еслимы делаем статический объект вместо Promise: 

export const resolvers = {
  Query: {
    viewer (_parent, _args, _context, _info) {
      return { id: 1, name: 'John Smith', status: 'cached' };
    }
  }
}

Все работает нормально, и это переводит объект в исходное состояние, возвращаемое с сервера SSR с правильной статической разметкой ...

enter image description here

Чего я ожидаю?

Я хочу, чтобы сервер рендерил graphql требуемый, завершает обещания, переводит данные в состояние apollo для SSR и делаетССР для целей SEO. Потому что сейчас, если я подключаюсь к базе данных - она ​​вообще не работает (ничего не отображается. Просто пустая страница, потому что рендеринг был прерван чем-то).

Ответы [ 2 ]

1 голос
/ 08 ноября 2019

Ваш код полностью правильный и не проблема с SSR. Я проверяю ваш код на примере next.js api-router-apollo-server-and-client в режимах CSR и SSR. Для теста SSR сначала запустите npm run build, а затем npm start. Если ваша проблема не решена, попробуйте обновить файл node.js, повторно загрузить пример кода и снова протестировать его.

0 голосов
/ 30 октября 2019

Если вы пытаетесь эмулировать возможную задержку, связанную с разрешением удаленного запроса или разрешением обещаний в обработчиках в целом, попробуйте следующее: 

export const resolvers = {
  Query: {
    async viewer(_parent, _args, _context, _info) {
      try {
        const resp = await new Promise((resolve, reject) => {
          setTimeout(() => {
            resolve({ id: 1, name: 'John Smith', status: 'cached' })
          }, 1000)
        })
        return resp
      } catch (err) {
        throw new Error('failed')
      }
      // return { id: 1, name: 'John Smith', status: 'cached' }
    },
  },
}

return await new Promise() не работает, так как ожиданиеКлючевое слово в этом случае ничего не делает, и возвращаемым объектом является все еще обещание, где ваши средства распознавания ожидают, что возвращаемое значение будет объектом.

Назначение await new Promise(...) переменнойудостоверяется, что обещание разрешается, и что переменная содержит ожидаемый объект до его возвращения.

...