I am using Apollo server to implement a GraphQL API, which automatically gives me a GraphQL Playground. According to the GraphQL Playground docs I should have (or at least be able to enable) a "Share" feature that will create a GraphQL Bin link (e.g. https://graphqlbin.com/OksD) that I could send to a colleague so they can view and run my same query.
Unfortunately this isn't available from Apollo server out of the box. How can I enable this feature? If this is not possible, is there another simple way for me to export my query from GraphQL Playground for someone else to import it? (I see the "copy curl" option, but I don't see an easy way to import from curl.)
Add shareEnabled: true to your playground options, e.g.
const apolloServer = new ApolloServer({
schema,
debug: isDevelopment,
introspection: isDevelopment,
playground: {
shareEnabled: true,
},
});
You might also want to fix CORS origin headers, allowing requests from https://graphqlbin.com
Related
I’m new to Strapi and to GraphQL.
I successfully created a website that uses Apollo to query data from my Strapi website.
So functionally I have everything I need.
For my DX I’m wondering:
Since I installed the GraphQL IntelliJ plugin: Where do I find the schemas for it? I read something about remote schema detection - is that supported with Strapi GraphQL Plugin? Where can I read about it? Otherwise how can I export GraphQL schema files from Strapi?
If I got 1) to work: Will TypeScript types work out of the box? Would I use one of the GraphQL schema to TS converters out there? It feels like there might be something working automatically, but I can’t tell till I get 1) to work.
First, you asked two separate questions and should therefore separate then in two separate threads.
To answer your first question: Here is how you can utilise the GraphQL IntelliJ plugin:
You need to create a .graphlconfig file. In Webstorm select your project folder and go to 'File' -> 'New' -> 'GraphQl Configuration File'.
Change the endpoint url to your strapi endpoint.
Visit the GraphQl Tool Window, double click your endpoint and select 'Get GraphQl Schema from Endpoint (introspection)'. This will retrieve the schema file from strapi and save it to schema.graphql.
Now you can run queries against your endpoint, e.g. create a new Scratch File scratch.graphql and run queries against your endpoint or try to figure out how to solve your second question ;)
Thank you for the answer! This was helpful!
Further to this, one query - typically, is .graphlconfig committed to git repo and scratch.graphql ignored from the git repo?
In addition for others looking for a similar solution - you could use values from .env. using the format below:
{
"name": "Strapi GraphQL Schema",
"schemaPath": "schema.graphql",
"extensions": {
"endpoints": {
"Default GraphQL Endpoint": {
"url": "${env:GRAPHQL_HOST}/graphql",
"headers": {
"Authorization": "Bearer ${env:GRAPHQL_TOKEN}",
"user-agent": "JS GraphQL"
},
"introspect": false
}
}
}
}
When I follow the ApolloGraphQL docs here:
https://www.apollographql.com/docs/apollo-server/performance/apq/#setup
It says that the Apollo Server automatically handles AQP requests with no changes. Yet, when my client calls:
http://localhost:4000/graphql
I get a 404 file not found.
Shouldn't that automatically be working on an apollo graphql server?
I didn't realize for localhost testing I need to set full uri.
const link = ApolloLink.from([
createPersistedQueryLink({ useGETForHashedQueries: true }),
createHttpLink({ uri: "http://localhost:4000/graphql" })
]);
I'm working on an express backend that use graphql ajd I don't know if I need to use the express-graphql or appolo-server-graphql lib.
Thank you for your help!
I suggest using apollo-server-express over express-graphql. They are very similar, but apollo-server-express has more bells and whistles all while having a simpler and clearer API IMO.
The biggest improvement in apollo-server-express, for me, is the playground: https://github.com/prisma/graphql-playground
The playground is better than express-graphql's graphiql for several reasons, but one big one is that it allows you to put HTTP headers in the request, which is more appropriate for handling session.
www.graphqlbin.com will allow you to use the playground on any endpoint which does not have cors. If you have cors, then you will need to run playground directly from your server.
Here is a sample of code to get you started:
const { ApolloServer } = require('apollo-server-express')
const graphqlServer = new ApolloServer({
schema,
introspection: true,
playground: true,
})
graphqlServer.applyMiddleware({
app
})
I wanted to change the graphql websocket end point inside graphql, anyone know how to do this?
by default it pings
wss://localhost/graphql
I need to change it to pusher url
thanks :-)
If you are running a standalone instance of GraphQL Playground, the URL is passed directly to the component as a prop:
<Playground
endpoint="http://localhost/graphql"
subscriptionEndpoint="wss://localhost/graphql"
/>
If you're using apollo-server, the endpoint URL should be derived from the subscriptionsPath, but it can also be set directly in the config:
const server = new ApolloServer({
typeDefs,
resolvers,
playground: {
subscriptionEndpoint: 'wss://localhost/graphql',
},
});
EDIT:
It doesn't appear there's a way to configure the desktop client with a specific subscription URL, unless you're using it with a local repo that contains a .graphqlconfig. In that case, you can provide additional information about your environment, including the subscription url, in the config file as outlined here.
with apollo 1.9.2 I'm used to make introspection of the graphql schema using a file as endpoint (that way the server does not need to run).
Here the 1.9 command:
apollo schema:download --endpoint ./schema/def/app.graphql ./schema/lib/schema.json
then thanks to the generated json file I can generate the types that will be used in the client and server code:
apollo codegen:generate --queries ./schema/*.graphql --schema ./schema/lib/schema.json
Now with apollo 2, the apollo schema:download command, renamed apollo service:download, supports only an url. If I do not have that types the server can not start. chicken & eggs issue.
I did not find in the doc how to do that now.
thanks for your help.
I got the answer on gitHub
I must use a config file apollo.config.js with the following
module.exports = {
service: {
localSchemaFile: './path/to/schema.graphql',
},
};
then call
apollo service:download -c ./path/to/apollo.config.js ./schema/lib/schema.json