Apollo - update () Methode wird zweimal aufgerufen, beide Male mit optimistischen / falschen Daten

10

Ich bin völlig auf ein Apollo-Problem festgefahren, für das ich ein GitHub-Problem geöffnet habe und keine Reaktion darauf hatte.

Ich rufe eine Apollo-Mutation an und verwende optimisticResponse . So wie es funktionieren soll, wie ich es verstehe, wird update() zweimal aufgerufen: zuerst mit den optimistischen Daten, dann wieder mit den tatsächlichen Daten, die vom Netzwerk kommen.

Aber aus irgendeinem Grund funktioniert mein Code nicht so. Ich bekomme zwei update() Aufrufe, beide mit den optimistischen Daten.

Hier ist ein Repo, der dieses Verhalten demonstriert: Ссылка

  1. Garn & amp; & amp; Garn-Entwickler
  2. Öffnen Sie im Browser die Konsole
  3. Geben Sie einen Text ein und drücken Sie die Eingabetaste
  4. Wiederholen Sie oben
  5. Beachten Sie den Fehler in der Konsole über doppelte Schlüssel. Dies geschieht, weil die temporäre ID "??" wird nicht durch die echte UUID ersetzt (optional) Sie können Vue DevTools öffnen, falls verfügbar, und die Daten überprüfen, um zu sehen, ob sie falsch sind.
ffxsam 23.02.2018, 06:13
quelle

1 Antwort

9

Ich habe etwas gegraben und ich glaube, ich habe die Ursache des Problems gefunden. Leider habe ich keine Lösung.

Kurz gesagt, könnte das Problem mit einer Netzwerkverbindung namens OfflineLink auftreten, die von aws-appsync verwendet wird.

Erklärung

aws-appsync hat einen ApolloLink namens OfflineLink , der mit der Funktion request interveniert.

Was passiert, ist etwa so:

  1. Sie rufen $apollo.mutate(...) an
  2. ApolloClient.QueryManager initialisiert die Mutation, die Ihr update zum ersten Mal mit der optimistischen Antwort auslöst. Das passiert im ApolloClient-Datenspeicher, markMutationInit ruft markMutationResult auf ruft Ihr Update .
  3. Die Operation graphql wird ausgeführt und erreicht OfflineLink in der Netzwerkkette.
  4. OfflineLink erstellt einen neuen Beobachter und sendet die Informationen zur Mutation als Aktion.
  5. Die nächste Zeile von OfflineLink ruft die next -Funktion des Beobachters mit der optimisticResponse auf, als wäre es das Ausführungsergebnis!
  6. Dies löst Ihr update das zweite Mal mit dem Ergebnis aus, das tatsächlich optimisticResponse ist.
  7. OfflineLink ruft die complete des Beobachters auf, die Ihre Versprechen löst.
  8. console.log('done!'...

Inzwischen verhindert OfflineLink , dass die ursprüngliche Mutation die Anfrage sogar sendet, und eine neue Mutation wird generiert und mit den Optionen gesendet, die Sie angegeben haben.

    
Tal Z 26.02.2018, 13:18
quelle