ReactとRestful WebサービスAPI通信

Question

私はreactjsと安らかなWebサービスapiアーキテクチャに関する問題があります。一般的なケースでは、これは問題ではありませんが、私はこのような状況がある場合。 React Webは、多くのデータベーステーブル（これらのテーブルは関連しています）のAPIを1ページでサーバー上で消費しています（反応で複数のコンポーネントに分割されます）

しかし、私は安らかなWebサービスデータベーステーブルである1つのリソースに対して1つのURLを持っています。関連リソースが必要な場合は、ネストされたURLを使用できます。私に例を挙げましょう。 Bill、Work Order、Sale Job、Productの4つのデータベーステーブルがあります。これらの関係で。 Billには1つのWork Orderがあり、Work Orderには多くのSale Jobsがあり、Sale Jobには1つのProductがあります。 この反応ページのすべてのデータが必要な場合は、少なくとも4つのhttp要求が必要です。 URLネストされたアプローチで、以下のように。

1. /api/bills/1 
2. /api/bills/1/workOrder 
3. /api/bills/1/workOrder/saleTxns 
4. /api/bills/1/workOrder/saleTxns/product 

は、または別の方法は、単に法案のURLは、私が（巨大である）、この反応ページのために必要なすべてのネストされたデータを持っているので、私はちょうど1件のhttpリクエストがあり、各コンポーネントにすべてのデータを渡すことができるようにすることです。

私の質問はどのアプローチが良いかということです。

1. 複数のデータチャンクに分割されます。
   • です。 へのルートコンポーネントジョブで、データをフェッチして子コンポーネントに渡しますか。または各コンポーネントが独自の データを取得します。

2. ちょうど1つの巨大な要求をロードします。

   • が、これはRESTfulなWeb サービスの悪い習慣になるのですか？私のURLのように見える/ api /請求書/ 1これはちょうどこの反応のための Webページ。だから私は、ios、アンドロイドのようなプラットフォームを持っている場合、私は URLが必要ですか？ が好きかもしれません。

     • /ウェブ/ API /紙幣/ 1？reactView1 =真、
     • /ウェブ/ API /紙幣/ 1？reactView2 =真、
     • /IOS/API /紙幣/ 1
     • /アンドロイド/ API /請求書/ 1

Answer 1

私はより良いあなたの情報に基づいているアプローチと言うことはできません。私は言う、しかし、これは何ができます：

• エリック・スタインが言うように、1つのデータベーステーブルに対応する唯一の1つのURLを許可する必要はありません。
• これがフロントエンドの一般的な操作である場合は、指定されたbillの下にネストされたすべての情報で応答するAPIエンドポイントを開発することが理にかなっています。フロントエンドのコード/厄介なコールバックロジックを保存します。
• 言われているように、4つのリクエストを行うことは、世界の終わりであってはなりません。これがあなたのアプリケーションの残りの部分によく合い、適切な方法でロジックを開発した場合、これはあまり問題にならないはずです。
• どのコンポーネントがどのアクションを処理するかは、実際のアプリケーションの設計方法と、それをどのように構築し続けるかによって決まります。 1つのアプローチから始めるにはあまりにも恐れず、後でそれを変更する必要があります。結局、コードであり、具体的ではありません。