Heim > Artikel > Backend-Entwicklung > javascript - Wie entwerfe ich ein API-Schnittstellen-Gateway?
Derzeit stellt eine Seite mehrere Schnittstellen zum Frontend bereit, aber jede Schnittstelle ist unabhängig.
Das Frontend möchte Daten von mehreren Schnittstellen mit einer Anfrage abrufen Zum Entwerfen eines Gateways.
Die Funktion lautet: Übergeben Sie mehrere Anforderungsschnittstellen gleichzeitig in ein Array und geben Sie sie an das Frontend zurück Die Idee ist, in der Mitte eine Knotenebene hinzuzufügen.
Haben Sie einen Rat?
Antwortinhalt:
Das Frontend möchte Daten von mehreren Schnittstellen mit einer Anfrage abrufen Zum Entwerfen eines Gateways.
Die Funktion lautet: Übergeben Sie mehrere Anforderungsschnittstellen gleichzeitig in ein Array und geben Sie sie an das Frontend zurück Die Idee ist, in der Mitte eine Knotenebene hinzuzufügen.
Haben Sie einen Rat?
PS: Die Schnittstellen sind redundant zusammengeführt und die Änderungen sind riesig~ und einer Erweiterung nicht förderlich. Daher wird diese Methode derzeit aufgegeben
Beim Zusammenführen von Schnittstellendaten müssen Sie
Probleme berücksichtigen, sobald die Daten zusammengeführt werden.
Wenn Sie diese Situation nicht berücksichtigen müssen, können Sie direkt eine zusätzliche Schnittstelle im Backend öffnen und alle vom Frontend gewünschten Daten direkt zurückgeben. Auf diese Weise ist es nicht erforderlich, in der Mitte eine zusätzliche Knotenebene hinzuzufügen数据量
Was wir erreichen wollen, ist die automatische Zusammenführung des Frontends. Die Logik ist wie folgt:
Legen Sie die Datenspezifikationen fest, die von der Hintergrundverpackungsschnittstelle zurückgegeben werden, z. B.:
<code>#1. 每当发起一个ajax请求时, 会暂存队列等待, 比如20ms #2. 期间如果又发起了一个ajax请求, 该请求也会被放入队列, 等待下一个ajax()调用, 而20ms内没有ajax()调用, 则会拼接队列中的请求数据, 向服务端发起合并请求. #3. 当然, 第一个ajax发起后, 会有个等待超时如80ms, 防止不停的等待, 第一个请求迟迟发不出 #4. GET和POST的队列分开 #5. 合并的请求数据结构, 如: $.ajax({ url: "http://mydomain.com/ajax_package", dataType:"text", // 数据类型为text, 需要分割解析, 把结果分配到指定请求回调 data:{ "actions":[ // 当然, 这个参数要json化, jQuery自动会urlencode { "callback": "pkg_callback_234244", // 创建回调handle "url": "ajax1_url", // 请求1的url "data": "ajax1_data" // 请求1的data }, { "callback": "pkg_callback_424234", // 创建回调handle "url": "ajax2_url", // 请求2的url "data": "ajax2_data" // 请求2的data } // 更多合并的请求数据 ] }, success:function(res){ dispatch(res); // 对响应内容进行数据提取并回调 } });</code>
Das heißt, die Struktur jedes Pakets ist hier definiert als>>>{callback}n{data}n<<<
<code>>>>pkg_callback_234244 {"status":0, "error":null, "data":[1,2,3,4]} <<< >>>pkg_callback_424234 {"status":0, "error":null, "data":{"logined":true}} <<<Der Callback wird dem jQuery-Objekt hinzugefügt, wenn wir die Warteschlange verarbeiten. , wie zum Beispiel <p> <br> </p>Daten extrahieren und zurückrufen und dann ausführen <pre class="brush:php;toolbar:false"><code>jQuery.pkg_callback_424234 = { success: fucntion(data){}, // 等于或封装了原ajax请求的success方法回调 error: function(err){} }</code>
<code>jQuery.pkg_callback_424234.success.call(xhr, JSON.parse(data) ); // 移除回调 delete jQuery['pkg_callback_424234'];</code>Die Schnittstelle zusammenführen und ihm alle Daten auf einmal geben? ?