問題タブ [nextjs]

私はfeatherjsとnextjsを試しています。現在、どうにかして nextjs SSR を使用してサーバーから初期データを取得し、feathersjs を使用して API をサブスクライブできます。

なぜそれが機能するのか、そしてここで実際に何が起こるのか、今はよくわかりません。多分誰かがこれについてより良い実装を持っていますか? または、これらのライブラリを間違った方法で使用しましたか?

アイデアは、コンポーネントが最初のロード時にサーバーによってレンダリングされる最初の小道具をレンダリングし、次に次のリクエストでオブザーバブルを使用して状態をフェッチすることです。

これは本のページの私のコードです。本のリストを表示するだけです：

どんな助けでも大歓迎です。

NextJS の静的レンダリング機能を使用してサイトの静的バージョンを生成するため、ページの最初のレンダリング時に、正しくレンダリングするために必要なすべてのデータが提供されるようにしたいと考えています。

/static に .md ファイルとして保存した多数のブログ投稿があり、次のようなページでそれらにアクセスしたいと考えています。

しかし、上記を実行しようとすると、次のエラーが発生します。

This dependency was not found: * fs

したがって、サーバー上でこれらの静的リソースにアクセスする方法がわかりません..

私のlaravelエンドポイントに次のリクエストがあります：

そして私のlaravelエンドポイントは次のように設定されました：

nextjs サーバー (ポート 3000) と laravel サーバー (8000) を起動しました。ブラウザーで localhost:8000/auth/login を参照すると、「ログインが呼び出されました」と表示されます。ただし、その axios 呼び出しを行うと、ステータス 200ok が返されますが、応答データはありません。

私が間違っていることは何ですか？

サーバーサイド レンダリング (SSR) を使用するのに苦労していますredux-api。アプリは、クライアント側レンダリング (CSR) だけで正常に動作します。

SSR が機能するには、Next.js のgetInitialProps関数でデータを利用できるようにする必要があります。私はnext-redux-wrapperそれを一緒にバインドするために使用しようとしています。

現在のステータス：

少なくとも今はstore入りましたが、アプリの CSR (前) バージョンにはなかっgetInitialPropsた奇妙なメッセージが表示されます。そしてもちろん空です。Error: only absolute urls are supportedwithReduxthis.props.oneLesson.data

makeStorestateサーバーで生成された呼び出しで=を取得undefinedしています。おそらくそれが手がかりです。

redux-apiまた、同様に機能する別のものに置き換えることもできます。

更新 1:すべての URL をフルにすることで、Redux が API エンドポイントにヒットするようになりました。ただし、1 ページのリロードではmakeStore3 回以上呼び出しが行われ、最初の呼び出しのみに正しいスラッグが含まれます。コンソール出力を参照してください。

更新 2:ブレークスルー: から promise を返すと、getInitialPropsSSR が機能します。これで、クライアント側のレンダリングがうまく機能し、十分に面白くなりました。