I m using apollo-angular 4.2.1. Our backend team has drop websocket using graphql. we are using Multipart HTTP protocol for GraphQL subscriptions
following is my setup for apollo client
export function createApollo(httpLink: HttpLink): ApolloClientOptions<any> {
loadDevMessages();
loadErrorMessages();
return {
link: httpLink.create({
uri,
headers: new HttpHeaders({
"Accept": 'multipart/mixed; boundary="graphql"; subscriptionSpec="1.0", application/json'
})
}),
cache: new InMemoryCache(),
};
}
@NgModule({
exports: [ApolloModule],
providers: [
{
provide: APOLLO_OPTIONS,
useFactory: createApollo,
deps: [HttpLink],
},
],
})
export class GraphQLModule {}
Subscription Function
I have a subscription function like this:
subscribeToAirportUpdates(): Observable<any> {
const GET_AIRPORT_SUBSCRIPTION = gql`
subscription Subscription {
getAirport {
_id
}
}
`;
return this.apollo.subscribe({ query: GET_AIRPORT_SUBSCRIPTION });
}
Subscription in Component
And I’m using it in my component like this:
this.stationService.subscribeToAirportUpdates().subscribe({
next: (response) => {
// Access the raw response body here
console.log('Raw response:', response);
},
error: (error) => {
console.error('Error subscribing to airport updates:', error);
},
});
Problem
While I can see the subscription requests in the network inspector and confirm the data is being sent when using curl, I’m not able to get the raw response in Angular.
I’ve tried using watchQuery and other options without success. The current setup at least initiates the request correctly, but I can’t get the raw response.
How can I properly receive and handle raw GraphQL subscription updates in Angular using Apollo-Angular and the Multipart HTTP protocol?