Comments (9)
Ah! I guess something got fixed in later versions. Many thanks for the explanation, I will try your suggestions 😊
from apollo-client.
Thanks @jerelmiller second option seems to be working great! 😊
from apollo-client.
Updated description with repro link: https://github.com/jca41/link-subscribe-duplicated-requests
from apollo-client.
Also would suggest the team to have a bug report template that uses an external API via HTTP.
from apollo-client.
Hey @jca41 👋
This is actually expected behavior due to how observables work. Anytime you subscribe
to it, it will execute that observable's callback function. If you look at HttpLink
, you'll see that callback function is where the fetch
happens. In the example you've given, you're calling subscribe
in the link and returning the same observable back to ApolloClient
which also subscribes itself to that observable, hence why you end up with two network requests.
There are a couple different ways you can fix this:
1: Use .map
instead of .subscribe
which lets you observe the emitted result but returns a new observable back to Apollo Client core. The downside here is that you'll only be able to observe the next
values and not the error
values. If you need access to errors, try the next technique.
export class MyLink extends ApolloLink {
constructor() {
super((operation, forward) => {
return forward(operation).map((result) => {
console.log(result);
return result;
});
});
}
}
- Return a new observable that emits results from the forwarded observable. This ensures the observable that Apollo Client subscribes to isn't the same one that creates the network request. This is the technique that several of our built-in links do in order to add additional behavior.
export class MyLink extends ApolloLink {
constructor() {
super((operation, forward) => {
return new Observable((observer) => {
const subscription = forward(operation).subscribe({
next: (result) => {
console.log(result);
observer.next(result);
},
error: (e) => {
console.log(e);
observer.error(e);
},
// very important that you include this to ensure you let the observer
// know this operation is completed!
complete: observer.complete.bind(observer)
});
// if the upstream observer stops watching for changes, unsubscribe from the forwarded operation as well
return () => subscription.unsubscribe();
})
});
}
}
Try either of these and see if this works better for you!
from apollo-client.
Definitely interesting that it deduped before since it probably shouldn't have 😆. Hope the suggestions work for you 🤞
from apollo-client.
Do you have any feedback for the maintainers? Please tell us by taking a one-minute survey. Your responses will help us understand Apollo Client usage and allow us to serve you better.
from apollo-client.
Glad to hear it!
from apollo-client.
This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
For general questions, we recommend using StackOverflow or our discord server.
from apollo-client.
Related Issues (20)
- Deprecate testing utilities introduced in 3.10 in favor of graphql-testing-library HOT 3
- Why does QueryResult not contain extensions but FetchResult does? HOT 3
- MockedResponse variableMatcher shows warning about no more mocked responses for the query HOT 5
- Partial data returned on error after resetting cache HOT 6
- Type error returning `IGNORE` object when using a generic `TypedDocumentNode` mutation HOT 2
- Documentataion: mutaitonHookOptions.ignoreResults requires additional clarification HOT 1
- @apollo/client reactive var state changes are not reflecting across libraries HOT 8
- fetchMore with fetchPolicy: "no-cache" makes two requests HOT 5
- Problem with custom type policy for query caching HOT 19
- App Crash when using ReactNativeFile in apollo upload client to upload file HOT 5
- Server-Side Rendering Error with @apollo/client 3.11.0 in NextJS 14.2.5 HOT 3
- When updating the list of mocks and calling 'rerender' on the component under test, the updated list of mocks is ignored and the original is still used. HOT 3
- Check on sample app suggested in the contributing doc
- [useMutation] unexpected handling of mutations vs queries on error handling HOT 2
- Evicting the cache for a query with both @include and @nonreactive directives can cause errors if variables have been changed HOT 1
- Calling `clearStore` while a lazyQuery is pending causes an error HOT 2
- Appolo Client with shopify HOT 2
- valueChanges does not trigger anymore after fetching the same object type from another, separate query HOT 2
- data is not available anymore in the onCompleted callback HOT 3
- `cache-only` fetchPolicy results in network request after deleting cached data HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from apollo-client.