Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to call a GraphQL query/mutation from an Express server backend?

My frontend is localhost:3000, and my GraphQL server is localhost:3333.

I've used react-apollo to query/mutate in JSX land, but haven't made a query/mutation from Express yet.

I'd like to make the query/mutation here in my server.js.

server.get('/auth/github/callback', (req, res) => {
  // send GraphQL mutation to add new user
});

Below seems like the right direction, but I'm getting TypeError: ApolloClient is not a constructor:

const express = require('express');
const next = require('next');
const ApolloClient = require('apollo-boost');
const gql = require('graphql-tag');


// setup
const client = new ApolloClient({
  uri: 'http://localhost:3333/graphql'
});
const app = next({dev});
const handle = app.getRequestHandler();

app
  .prepare()
  .then(() => {
    const server = express();

    server.get('/auth/github/callback', (req, res) => {
      // GraphQL mutation
      client.query({
        query: gql`
          mutation ADD_GITHUB_USER {
            signInUpGithub(
              email: "[email protected]"
              githubAccount: "githubusername"
              githubToken: "89qwrui234nf0"
            ) {
              id
              email
              githubToken
              githubAccount
            }
          }
        `,
      })
        .then(data => console.log(data))
        .catch(error => console.error(error));
    });

    server.listen(3333, err => {
      if (err) throw err;
      console.log(`Ready on http://localhost:3333`);
    });
  })
  .catch(ex => {
    console.error(ex.stack);
    process.exit(1);
  });

This post mentions Apollo as the solution, but doesn't give an example.

How do I call a GraphQL mutation from Express server :3000 to GraphQL :3333?

like image 372
Chance Smith Avatar asked Feb 06 '19 18:02

Chance Smith


1 Answers

This is more likely to be what you're looking for:

const { createApolloFetch } = require('apollo-fetch');

const fetch = createApolloFetch({
    uri: 'https://1jzxrj179.lp.gql.zone/graphql',
});

fetch({
    query: '{ posts { title } }',
}).then(res => {
    console.log(res.data);
});

// You can also easily pass variables for dynamic arguments
fetch({
    query: `
        query PostsForAuthor($id: Int!) {
            author(id: $id) {
                firstName
                posts {
                    title
                    votes
                }
            }
        }
    `,
    variables: { id: 1 },
}).then(res => {
    console.log(res.data);
});

Taken from this post, might be helpful to others as well: https://blog.apollographql.com/4-simple-ways-to-call-a-graphql-api-a6807bcdb355

like image 102
opuzzz Avatar answered Sep 22 '22 05:09

opuzzz