Next.js: de l'extraction de données dans getInitialProps(): server-side vs côté client
Je suis en utilisant Next.js et j'ai un serveur personnalisé à l'aide de l'Express. J'ai une page qui nécessite des données de la base de données.
getInitialProps()
, lors de l'exécution sur le serveur, pourrait-il suffit de saisir les données de la base de données et de retourner, sans aucun problème.
Cependant, getInitialProps()
pouvez également exécuter côté client (lorsque au début, l'utilisateur demande une page différente, puis accède à celui-ci). Dans ce cas, depuis que je suis sur le côté client, j'ai évidemment ne pouvez pas récupérer les données depuis la base de données - je utiliser AJAX pour parler au serveur et lui demander de le récupérer pour moi.
Bien sûr, cela signifie aussi que j'ai de définir une nouvelle voie Expresse sur le serveur pour traiter cette demande, qui contiendra exactement le même code que la partie côté serveur de getInitialProps()
, ce qui est très indésirable.
Quelle est la meilleure façon de gérer cela?
Vous devez vous connecter pour publier un commentaire.
getInitialProps()
reçoit toujours la demande et de la réponse que les paramètres qui sont définis uniquement sur le serveur:https://github.com/zeit/next.js#fetching-data-and-component-lifecycle
Depuis pas de bonne solution semble avoir existé, j'ai créé et publié une bibliothèque pour fournir une solution simple et élégante à ce problème: la prochaine express.
Faire une API distincte de votre next.js app. Penser à la prochaine application comme une interface client qui arrive à afficher les pages sur le serveur
Dans votre
getInitialProps
vous devriez faire une requête http vers une nouvelle voie expresse qui a votre logique pour l'extraction de la base de données. Cette logique ne devrait jamais vivre dans la couche d'INTERFACE utilisateur.Cette route devrait ensuite être appelée à indépendamment de si vous êtes sur le client ou sur le serveur, vous n'avez pas besoin de faire un code de ramification.