Can anybody explain how Apollo serves both the Sandbox's html and the graphql query handler simultaneously on the same route endpoint?
SPECIFICALLY, What protocol(s), method(s), and how is the body content used? Is this all done via headers? Thanks for the semi-technical deep dive.
The answer is a bit more complicated. These blog posts: Making GraphQL Requests using HTTP Methods and Configuring CSRF Cross-Site Request Forgery prevention in the Apollo Router give an insight into GET and POST, along with nuances of headers in a GraphQL client/server context.
It seems the differentiator is a combination of headers and url query string that Apollo server "intelligently" interprets to return a graphQL result, or sandbox html.
This is a valid GET based query from the browser: http://localhost:4000/api/v1/pub?query={hello}
Excerpts:
GET METHOD
You can make GraphQL requests using the GET HTTP method. The rules for making GraphQL requests this way are almost the same as the POST version — there are just slight differences:
• Each property is provided as an HTTP query parameter (values separated by an ampersand — &)
• Limitation (variables): Because they need to be parsed as JSON, GraphQL requests with variables don’t work in GET requests.
• Limitation (operations): You can only execute query operations (mutation operations don’t work)
POST METHOD
To make a GraphQL request using the POST HTTP method, we pass the following properties into the JSON body of the request.
• query — the full GraphQL query containing the operation type (can be either query or mutation), the types & fields requested, and any variables included
• operationName — optional, but if included, must be present in the query
• variables — optional if there are no variables included in the query