Advanced GraphQL, v2

Adding Subscriptions Exercise

Scott Moss

Scott Moss

Superfilter AI
Advanced GraphQL, v2

Check out a free preview of the full Advanced GraphQL, v2 course

The "Adding Subscriptions Exercise" Lesson is part of the full, Advanced GraphQL, v2 course featured in this preview video. Here's what you'd learn in this lesson:

The students are instructed to add a subscription to new posts and to publish the subscription when a post is created, add authentication to the subscription, and using the subscription field.


Transcript from the "Adding Subscriptions Exercise" Lesson

>> So you're gonna be adding a subscription for new posts. So if you go to the resolvers and then createPost, you'll notice that you get pubsub.publish, NEW_POST event, you get create a new post. You need to set this up so it works. So obviously, a couple things you're gonna have to do is you're gonna have to add a subscription for the new posts.

And what I mean by that is you need to go to your type definitions, and you need to add a subscription down here for when a new post is created. You can call the field whatever you want, just make sure you also add the resolver for it in the resolvers file.

And then you need to publish to subscription when a post is created, I already left that part in for you. You can change the name of the event if you want to, if you don't like the event that I chose. Or if your field name is different, for instance, the one that I left in there for you, the field name on createPost is newPost.

So that would be the field name on my subscription object. If your subscription object has a different field name, then you need to change that to be a different field name as well. And then obviously, publish your posts. And if you have a different event than I do, then you would change the event, but I think this one's up top, so you get that for free as well.

You also need to add authentication to the subscription. So I didn't have authentication in my example, but I showed you how to do it. And basically it was using the context objects, I'm sorry, using the Subscriptions field on the Apollo server object, there's onConnect, and his onConnect takes an object of fields.

And in GraphQL Playground, whatever you pass on the header section in GraphQL Playground is gonna be accessible on this. So whatever logic you see in the context object that we already have inside of index.js, so this logic as far as getting a user and setting a context. You would have to do that inside of Subscriptions, onConnect, and you would get some params here.

And what I've been saying is this params, at least in this example, this params is gonna be the same thing as req.headers, it's the same thing. req.headers and params are gonna have whatever you pass to GraphQL Playground's headers field. So any object that's in headers in GraphQL Playground is gonna be attached to the req.headers, and it's also gonna be attached to these params here.

So that means you could literally do the exact same logic here, probably copy and paste.
>> You're passing your pubsub object in the context to get it into the resolvers?
>> I am not passing the pubsub into the context, but I like the way you're thinking. You could totally do that if you want to be able to pass it around to every single one, so yeah.

onConnect, well, there's problems around that, but I don't think we'll run into that problem here. But basically, if we go down and look at the, wait, I'm not on the solution branch, never mind. You'll see, done do that on this example, you'll run into problems. Because you need access to the pubsub outside the resolver, inside a subscribe function on a resolver.

So you don't have it yet because you don't have access to the context. So there's scenarios where you won't have it, in other scenarios you might. Cool, and then I have something here called add a filter for a subscription. I don't have time to talk about the filters for extra credit, so don't worry about that, I can talk about that when I get back.

But basically that is like adding arguments to your subscriptions, where you can say, I only wanna subscribe to this event and only when it has this data. So you can add a filter. It's basically arguments for your subscriptions, just like arguments you have for your queries and mutations.

And then try out your subscriptions with GraphQL Playground. So remember, you have to open up one tab in Chrome or whatever your browser is, and you have to open up an entirely different tab. You can't just make a new tab in GraphQL Playground, it won't work, at least in my experience it didn't.

So you have to open up a whole other tab. Just hit play in the subscription one, and then do some mutations in the next and then observe. And what I'll do is I'll leave up this file, I don't know what part would be the most helpful, but maybe this part here.

So again, you're creating subscriptions for when a new post is created, that's it. You wanna subscribe to that. And in a social network or something, that would be like a public feed. If you were listening on a feed, that's when you would listen for some new posts or something like that.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now