PubSub returning [object Object] sometimes null #236
Comments
|
Same problem as @ralphchristianeclipse ... Normal queries work like a charm but all subscriptions return [object Object] inside GraphiQL: This is my schema.ts: import {makeExecutableSchema} from 'graphql-tools';
import resolvers from './resolvers';
const typeDefs = `
type Location {
locationPLZ: Int!
locationName: String!
locationAddress: String
locationPhone: String
locationEMail: String
locationOpeningHours: String
}
type ConfigurationItem {
configurationItemId: Int!
configurationItemName: String!
configurationItemDescription: String
}
type DeviceModel {
deviceModelId: Int!
deviceModelName: String!
deviceType: DeviceType!
}
type DeviceType {
deviceTypeId: Int!
deviceTypeName: String!
deviceTypeIconName: String!
templateName: String!
startNumber: Int!
}
type Device {
deviceSerialNumber: String!
deviceMacAddress: String
deviceLocationDescription: String
deviceDescription: String
deviceName: String!
location: Location
deviceType: DeviceType
deviceModel: DeviceModel
configurationItem: ConfigurationItem
logEntries: [LogEntry]
}
// Removed more types to save space
type Query {
locationByPLZ(locationPLZ: Int): Location
configurationItemById(configurationItemId: Int): ConfigurationItem
deviceModelById(deviceModelId: Int): DeviceModel
deviceTypeById(deviceTypeId: Int): DeviceType
deviceBySerialNumber(deviceSerialNumber: String): Device
devices: [Device]
}
type Subscription {
deviceAdded: Device
}
schema {
query: Query
subscription: Subscription
}
`;
export default makeExecutableSchema({ typeDefs, resolvers });And resolvers.ts: const resolvers = {
Device: {
location(obj: any, args: any, context: any, info: any) {
return getLocationByPLZ(obj.locationPLZ);
},
deviceType(obj: any, args: any, context: any, info: any) {
return getDeviceTypeById(obj.deviceTypeId);
},
deviceModel(obj: any, args: any, context: any, info: any) {
return getDeviceModelById(obj.deviceModelId);
},
configurationItem(obj: any, args: any, context: any, info: any) {
return getConfigurationItemById(obj.configurationItemId);
},
logEntries(obj: any, args: any, context: any, info: any) {
return getLogEntriesBySerialNumber(obj.deviceSerialNumber);
},
},
// More resolvers removed to save space
Query: {
locationByPLZ(obj: any, args: any, context: any, info: any) {
return getLocationByPLZ(args.locationPLZ);
},
// More queries removed to save space
},
Subscription: {
deviceAdded: {
subscribe(obj: any, args: any, context: any, info: any) {
return pubSub.asyncIterator('deviceAdded');
},
},
},
};
// Removed functions unrelated to issue to save space
export default resolvers;All combined in my index.ts: import * as bodyParser from 'body-parser';
import * as express from 'express';
import {execute, subscribe} from 'graphql';
import {graphiqlExpress, graphqlExpress} from 'graphql-server-express';
import {PubSub} from 'graphql-subscriptions';
import {createServer} from 'http';
import {SubscriptionServer} from 'subscriptions-transport-ws';
import graphqlSchema from './schema';
const PORT = 3000;
const app = express();
const pubSub = new PubSub();
app.use('/graphql', bodyParser.json(), graphqlExpress({
context: {
pubSub,
},
schema: graphqlSchema,
}));
app.use('/graphiql', graphiqlExpress({
endpointURL: '/graphql',
subscriptionsEndpoint: `ws://localhost:${PORT}/graphql/subscriptions`,
}));
const ws = createServer(app);
ws.listen(PORT, () => {
console.log('Listening on ' + PORT);
// Setup WebSocket for handling GraphQL subscriptions
const subServer = new SubscriptionServer({
execute,
schema: graphqlSchema,
subscribe,
}, {
path: '/graphql/subscriptions',
server: ws,
});
});
setInterval(() => {
let text = '';
const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
for (let i = 0; i < 5; i++)
text += possible.charAt(Math.floor(Math.random() * possible.length));
pubSub.publish('deviceAdded', {
deviceName: text,
deviceSerialNumber: text,
});
}, 500);
export default pubSub; |
|
Fixed by moving the pubSub variable and initialization to resolvers.ts |
|
try change payload to what im observe root key for payload data should be same like subscription name |
|
Did anyone get this to work? I'm consistently getting back |
|
Nevermind, it was working correctly after all! I was just pulling data from the wrong place in my component 🎉 |
|
I am also following the GraphQL Subscriptions tutorial mentioned above and getting the same issue - graphiql is displaying In my case, I do see the expected message for a fraction of a second:
However, right after that the response turns into I don't know where to go from here. My full project is published here. I would really appreciate a quick review to see what I am doing wrong. |
I think this is because the query is invalid, or there's an error when processing the subscription, but the library didn't report it. Example with these two subscriptions, the valid one will work, and the not exists one shows [object Object]: |
|
And if the subscription is successful and show // typeDef
`
type Subscription {
fieldName: FieldData
}
`
// resolver
{
Subscription: {
fieldName: {
subscribe: () => pubSub.asyncIterator('eventName'),
},
},
}
// somewhere in our app
pubSub.publish('eventName', {
fieldName: {
// field data
// ...
},
})A little more on my thoughts is that I think the team has designed the flow like this, so we can publish multiple values in one event. And the This flow can give us the ability to efficiently filter unnecessary loop through all subscriptions. We can also use this implementation to publish dynamic event name as well. Imagine that we have a chat system, every user will subscribe for their message event. With the tutorial from the team's blog, we can implement our system like this: // typeDef
`
type Subscription {
message: Message!
}
`
// resolver
{
Subscription: {
message: {
subscribe: withFilter(
pubSub.asyncIterator('messageAdded'),
(published, args, ctx, info) => published.toUserId === getUserId(ctx),
),
},
},
}
// somewhere in our app
pubSub.publish('messageAdded', {
message: {
toUserId: 'namnm',
content: 'hello, how are you?',
},
})So every message added will trigger an event then the pubsub system will loop through all subscriptions and find out the right user to send by comparing the userId. If we modify the event name so it can be identical to the user, we can avoid the loop as you can see: // resolver
{
Subscription: {
message: {
subscribe: (published, args, ctx, info) => {
const currentUserId = getUserId(ctx)
return pubSub.asyncIterator(`messageAdded-${currentUserId}`)
},
},
},
}
// somewhere in our app
const toUserId = 'namnm'
pubSub.publish(`messageAdded-${toUserId}`, {
message: {
toUserId,
content: 'hello, how are you?',
},
})Sorry for a long comment instead of a blog link, and I havent tried it out yet, but hope it helps somewhere. |
The Only Differences
|
|
I am finding that my app is not working because I am using the latest versions of the libraries. So I went back to
So the big question in my mind is how far can we push the version numbers and not break graphql-tutorial! |
|
@nareshbhatia, Thanks for you post. I decided to take a look at my dependencies, since I have once again ran into a subscription problem in my latest project. I simply uninstalled
I think the
|
|
You are right @benjaminadk. I am now sticking with the following - it's working well for me: I have dropped I am not planning to upgrade to latest versions until I see a solid example move to them, such as https://github.com/apollographql/graphql-tutorial. |
|
I'm having the same issues. My graphql subscriptions returns [object object] despite using the dependencies highlighted by @nareshbhatia. Any idea how to work around or debug this issue? Thanks all! |
|
guys to finish ur problem, with subscriptions (its all about schema miss when u see [object] and wrong nested object in publication payload..) schema: resolver |
|
My issue fixed! thanks to @agborkowski. He went all the way to assist me. I'm grateful! |
|
To all: when you say I checked websocket messages and it seems like a server returns correct messages with the details of an error: And because of |
|
@angly-cat Any issue has been opened for this in graphiql repo? If not you can go there open one 👍 |
|
For googlers, this error can also occur if you won't return an AsyncIterable in your I was improperly using Which wasn't giving an |
|
I was able to debug with @angly-cat method and found the actual error. |
|
after trying a lot i finally got it! You just need to The pubsub publish needs to have exactly the same name of your subscription name. |
who are you dude, where did you come from .... Such a life saver !!!. It worked bro, thankss. Keep up good work Broh. |
I'm following this tutorial
https://dev-blog.apollodata.com/tutorial-graphql-subscriptions-server-side-e51c32dc2951
but it seems it always returns null or an [object Object] string any ideas?
here's how i publish to the subscription
and in the resolver
i use the
to return the value inside the subscribe prop of the Subscription resolver
The text was updated successfully, but these errors were encountered: