diff --git a/examples/defer-example/README.md b/examples/defer-example/README.md new file mode 100644 index 00000000..54b98459 --- /dev/null +++ b/examples/defer-example/README.md @@ -0,0 +1,17 @@ +# Example usage + +This is the bare minimum that one needs in order to setup GraphQL server that supports @defer and a client that consumes it. + +## Server setup + +1. cd to /server +2. use ``npm install`` +3. start the server with `` node server.js `` + +## Client setup + +1. cd to /client +2. use ``node client.js`` to execute the example deferred query + +Have fun! + diff --git a/examples/defer-example/client/client.js b/examples/defer-example/client/client.js new file mode 100644 index 00000000..7800233f --- /dev/null +++ b/examples/defer-example/client/client.js @@ -0,0 +1,44 @@ +import http from 'http'; + +const data = `query defer_test { + deferTest { + text + ... on GraphQLDeferTest @defer { + defferedText + } + } +}` + +const options = { + hostname: 'localhost', + port: 4040, + path: '/graphql', + method: 'POST', + headers: { + 'Content-Type': 'application/graphql', + 'Content-Length': Buffer.byteLength(data) + } +}; + +const req = http.request(options, (res) => { + console.log(`STATUS: ${res.statusCode}`); + console.log(`HEADERS: ${JSON.stringify(res.headers)}`); + + res.setEncoding('utf8'); + + res.on('data', (chunk) => { + console.log(`BODY: ${chunk}`); + }); + + res.on('end', () => { + console.log('No more data in response.'); + }); +}); + +req.on('error', (e) => { + console.error(`problem with request: ${e.message}`); +}); + +// Write data to request body +req.write(data); +req.end(); \ No newline at end of file diff --git a/examples/defer-example/server/package.json b/examples/defer-example/server/package.json new file mode 100644 index 00000000..afa7644f --- /dev/null +++ b/examples/defer-example/server/package.json @@ -0,0 +1,7 @@ +{ + "dependencies": { + "express": "^4.17.1", + "express-graphql": "0.12.0-experimental-stream-defer.1", + "graphql": "15.4.0-experimental-stream-defer.1" + } +} diff --git a/examples/defer-example/server/server.js b/examples/defer-example/server/server.js new file mode 100644 index 00000000..5c5b0847 --- /dev/null +++ b/examples/defer-example/server/server.js @@ -0,0 +1,50 @@ +const express = require('express'); +const { graphqlHTTP } = require('express-graphql'); +const { buildSchema } = require('graphql'); + +// Construct a schema, using GraphQL schema language +var schema = buildSchema(` + type Query { + hello: String + deferTest: GraphQLDeferTest + } + + type GraphQLDeferTest { + text: String + defferedText: String + } +`); + +const sleep = (t = 1000) => new Promise((res) => setTimeout(res, t)); + +// Model +class GraphQLDeferTest { + constructor() {} + + async text() { + return "Peter Parker" + } + + async defferedText() { + await sleep(5000) + + return 'Took a long time, he?' + } +} + +// Query resolvers +var root = { + hello: () => 'Hello World', + deferTest: async () => new GraphQLDeferTest(), +}; + +var app = express(); + +app.use('/graphql', graphqlHTTP({ + schema: schema, + rootValue: root, + graphiql: true, +})); + +app.listen(4040) +console.log('Running a GraphQL API server at http://localhost:4040/graphql'); diff --git a/examples/index.ts b/examples/index.ts index cb742cf1..2b1d97ff 100644 --- a/examples/index.ts +++ b/examples/index.ts @@ -3,16 +3,40 @@ import { buildSchema } from 'graphql'; import { graphqlHTTP } from '../src'; +// Model +class GraphQLDeferTest { + constructor() {} + + // Child resolvers + async text() { + return "Peter Parker" + } + + async defferedText() { + await sleep(5000) + + return 'Took a long time, he?' + } +} + + // Construct a schema, using GraphQL schema language const schema = buildSchema(` type Query { hello: String + deferTest: GraphQLDeferTest + } + + type GraphQLDeferTest { + text: String + defferedText: String } `); // The root provides a resolver function for each API endpoint const rootValue = { hello: () => 'Hello world!', + deferTest: async () => new GraphQLDeferTest(), }; const app = express();