In meinem letzten Blog habe ich darüber gesprochen, wie Daten in NextJs abgerufen werden. Wenn Sie ihn noch nicht gelesen haben, empfehle ich Ihnen, ihn zu lesen. An diesem Punkt sollten Sie eine Vorstellung von der Datenbeschaffung in NextJs haben. Bei der statischen Generierung von dynamischen Routen in getStaticPaths gibt es einen Fallback-Schlüssel wie folgt
export async function getStaticPaths() {
return {
paths: [
{ params: { ... } }
],
fallback: true, false, or 'blocking'
};
}Wie Sie sehen können, nimmt der Fallback-Schlüssel drei Werte an. True, False und 'blocking'. Wir werden jeden Wert durchgehen und sein Verhalten und seine Anwendungsfälle beschreiben.
Fallback False
Im Falle eines Wertes von false. Jeder Pfad, der nicht von getStaticPaths wird die Seite 404 zurückgeben. Dies bedeutet, wenn wir Blog Api, die uns alle Blogs aus DB die Anwendung würde nur die Daten aus Api zurückgegeben rendern. Bei jeder anderen dynamischen Route wird uns eine 404-Seite angezeigt.
Dies ist nützlich für statische Websites, die eine begrenzte Anzahl von Seiten haben. Wenn neue Seiten hinzugefügt werden, muss der Build erneut ausgeführt werden, um die richtige Seite anzuzeigen.
Fallback True
Im Falle eines Wertes von false. Jeder Pfad, der nicht von getStaticPaths wird die Seite 404 zurückgeben. Dies bedeutet, wenn wir Blog Api, die uns alle Blogs aus DB die Anwendung würde nur die Daten aus Api zurückgegeben rendern. Bei jeder anderen dynamischen Route wird uns eine 404-Seite angezeigt.
Dies ist nützlich für statische Websites, die eine begrenzte Anzahl von Seiten haben. Wenn neue Seiten hinzugefügt werden, muss der Build erneut ausgeführt werden, um die richtige Seite anzuzeigen.
Fallback Blocking
Wenn Fallback blockiert ist und keine neuen Pfade von getStaticPaths zurückgegeben werden, wird die Seite leer angezeigt, bis Daten abgerufen werden, wie im Fall von getServerSideProps, und dann für zukünftige Anfragen zwischengespeichert werden, so dass dies nur einmal pro Pfad geschieht.
Schlussfolgerung
Im Falle dynamischer statischer Seiten gibt es also drei Möglichkeiten, das Verhalten einer Anwendung festzulegen. fallback: false zeigt eine 404-Seite für alle neuen Pfade, die nicht von getStaticPaths zurückgegeben werden. fallback:true Anzeige des Fallback-Zustands, bis die neuen Pfaddaten abgerufen wurden, und dann Cache. fallback:blocking zu handeln als getServerSideProps aber Cache für zukünftige Anfragen.
Lesen Sie auch: Datenabrufe in NextJS
