mirror of
https://github.com/retailcrm/graphql-php.git
synced 2024-11-23 05:16:05 +03:00
341 lines
11 KiB
HTML
341 lines
11 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<!--[if IE 8]><html class="no-js lt-ie9" lang="en" > <![endif]-->
|
||
|
|
<!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
|
||
|
|
|
||
|
|
<link rel="shortcut icon" href="../img/favicon.ico">
|
||
|
|
<title>Overview - graphql-php</title>
|
||
|
|
<link href='https://fonts.googleapis.com/css?family=Lato:400,700|Roboto+Slab:400,700|Inconsolata:400,700' rel='stylesheet' type='text/css'>
|
||
|
|
|
||
|
|
<link rel="stylesheet" href="../css/theme.css" type="text/css" />
|
||
|
|
<link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
|
||
|
|
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// Current page data
|
||
|
|
var mkdocs_page_name = "Overview";
|
||
|
|
var mkdocs_page_input_path = "concepts.md";
|
||
|
|
var mkdocs_page_url = null;
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<script src="../js/jquery-2.1.1.min.js" defer></script>
|
||
|
|
<script src="../js/modernizr-2.8.3.min.js" defer></script>
|
||
|
|
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
|
||
|
|
<script>hljs.initHighlightingOnLoad();</script>
|
||
|
|
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body class="wy-body-for-nav" role="document">
|
||
|
|
|
||
|
|
<div class="wy-grid-for-nav">
|
||
|
|
|
||
|
|
|
||
|
|
<nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
|
||
|
|
<div class="wy-side-nav-search">
|
||
|
|
<a href=".." class="icon icon-home"> graphql-php</a>
|
||
|
|
<div role="search">
|
||
|
|
<form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
|
||
|
|
<input type="text" name="q" placeholder="Search docs" title="Type search term here" />
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="main navigation">
|
||
|
|
<ul class="current">
|
||
|
|
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="..">About</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="../getting-started/">Getting Started</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="../complementary-tools/">Complementary Tools</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<span class="caption-text">Type Definitions</span>
|
||
|
|
<ul class="subnav">
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/">Introduction</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/object-types/">Object Types</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/scalar-types/">Scalar Types</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/enum-types/">Enumeration Types</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/lists-and-nonnulls/">Lists and Non-Null</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/interfaces/">Interfaces</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/unions/">Unions</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/input-types/">Mutations and Input Types</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/directives/">Directives</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/schema/">Schema</a>
|
||
|
|
</li>
|
||
|
|
<li class="">
|
||
|
|
|
||
|
|
<a class="" href="../type-system/type-language/">Using Type Language</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="../executing-queries/">Executing Queries</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="../data-fetching/">Fetching Data</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="../error-handling/">Handling Errors</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="../security/">Security</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="../how-it-works/">How it works</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="toctree-l1">
|
||
|
|
|
||
|
|
<a class="" href="../reference/">Class Reference</a>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</nav>
|
||
|
|
|
||
|
|
<section data-toggle="wy-nav-shift" class="wy-nav-content-wrap">
|
||
|
|
|
||
|
|
|
||
|
|
<nav class="wy-nav-top" role="navigation" aria-label="top navigation">
|
||
|
|
<i data-toggle="wy-nav-top" class="fa fa-bars"></i>
|
||
|
|
<a href="..">graphql-php</a>
|
||
|
|
</nav>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="wy-nav-content">
|
||
|
|
<div class="rst-content">
|
||
|
|
<div role="navigation" aria-label="breadcrumbs navigation">
|
||
|
|
<ul class="wy-breadcrumbs">
|
||
|
|
<li><a href="..">Docs</a> »</li>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<li>Overview</li>
|
||
|
|
<li class="wy-breadcrumbs-aside">
|
||
|
|
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
<hr/>
|
||
|
|
</div>
|
||
|
|
<div role="main">
|
||
|
|
<div class="section">
|
||
|
|
|
||
|
|
<h1 id="overview">Overview</h1>
|
||
|
|
<p>GraphQL is data-centric. On the very top level it is built around three major concepts:
|
||
|
|
<strong>Schema</strong>, <strong>Query</strong> and <strong>Mutation</strong>.</p>
|
||
|
|
<p>You are expected to express your application as <strong>Schema</strong> (aka Type System) and expose it
|
||
|
|
with single HTTP endpoint (e.g. using our <a href="../executing-queries/#using-server">standard server</a>).
|
||
|
|
Application clients (e.g. web or mobile clients) send <strong>Queries</strong>
|
||
|
|
to this endpoint to request structured data and <strong>Mutations</strong> to perform changes (usually with HTTP POST method).</p>
|
||
|
|
<h2 id="queries">Queries</h2>
|
||
|
|
<p>Queries are expressed in simple language that resembles JSON:</p>
|
||
|
|
<pre><code class="graphql">{
|
||
|
|
hero {
|
||
|
|
name
|
||
|
|
friends {
|
||
|
|
name
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</code></pre>
|
||
|
|
|
||
|
|
<p>It was designed to mirror the structure of expected response:</p>
|
||
|
|
<pre><code class="json">{
|
||
|
|
"hero": {
|
||
|
|
"name": "R2-D2",
|
||
|
|
"friends": [
|
||
|
|
{"name": "Luke Skywalker"},
|
||
|
|
{"name": "Han Solo"},
|
||
|
|
{"name": "Leia Organa"}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</code></pre>
|
||
|
|
|
||
|
|
<p><strong>graphql-php</strong> runtime parses Queries, makes sure that they are valid for given Type System
|
||
|
|
and executes using <a href="../data-fetching/">data fetching tools</a> provided by you
|
||
|
|
as a part of integration. Queries are supposed to be idempotent.</p>
|
||
|
|
<h2 id="mutations">Mutations</h2>
|
||
|
|
<p>Mutations use advanced features of the very same query language (like arguments and variables)<br />
|
||
|
|
and have only semantic difference from Queries:</p>
|
||
|
|
<pre><code class="graphql">mutation CreateReviewForEpisode($ep: Episode!, $review: ReviewInput!) {
|
||
|
|
createReview(episode: $ep, review: $review) {
|
||
|
|
stars
|
||
|
|
commentary
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</code></pre>
|
||
|
|
|
||
|
|
<p>Variables <code>$ep</code> and <code>$review</code> are sent alongside with mutation. Full HTTP request might look like this:</p>
|
||
|
|
<pre><code class="json">// POST /graphql-endpoint
|
||
|
|
// Content-Type: application/javascript
|
||
|
|
//
|
||
|
|
{
|
||
|
|
"query": "mutation CreateReviewForEpisode...",
|
||
|
|
"variables": {
|
||
|
|
"ep": "JEDI",
|
||
|
|
"review": {
|
||
|
|
"stars": 5,
|
||
|
|
"commentary": "This is a great movie!"
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</code></pre>
|
||
|
|
|
||
|
|
<p>As you see variables may include complex objects and they will be correctly validated by
|
||
|
|
<strong>graphql-php</strong> runtime.</p>
|
||
|
|
<p>Another nice feature of GraphQL mutations is that they also hold the query for data to be
|
||
|
|
returned after mutation. In our example mutation will return:</p>
|
||
|
|
<pre><code>{
|
||
|
|
"createReview": {
|
||
|
|
"stars": 5,
|
||
|
|
"commentary": "This is a great movie!"
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</code></pre>
|
||
|
|
|
||
|
|
<h1 id="type-system">Type System</h1>
|
||
|
|
<p>Conceptually GraphQL type is a collection of fields. Each field in turn
|
||
|
|
has it's own type which allows to build complex hierarchies.</p>
|
||
|
|
<p>Quick example on pseudo-language:</p>
|
||
|
|
<pre><code>type BlogPost {
|
||
|
|
title: String!
|
||
|
|
author: User
|
||
|
|
body: String
|
||
|
|
}
|
||
|
|
|
||
|
|
type User {
|
||
|
|
id: Id!
|
||
|
|
firstName: String
|
||
|
|
lastName: String
|
||
|
|
}
|
||
|
|
</code></pre>
|
||
|
|
|
||
|
|
<p>Type system is a heart of GraphQL integration. That's where <strong>graphql-php</strong> comes into play.</p>
|
||
|
|
<p>It provides following tools and primitives to describe your App as hierarchy of types:</p>
|
||
|
|
<ul>
|
||
|
|
<li>Primitives for defining <strong>objects</strong> and <strong>interfaces</strong></li>
|
||
|
|
<li>Primitives for defining <strong>enumerations</strong> and <strong>unions</strong></li>
|
||
|
|
<li>Primitives for defining custom <strong>scalar types</strong></li>
|
||
|
|
<li>Built-in scalar types: <code>ID</code>, <code>String</code>, <code>Int</code>, <code>Float</code>, <code>Boolean</code></li>
|
||
|
|
<li>Built-in type modifiers: <code>ListOf</code> and <code>NonNull</code></li>
|
||
|
|
</ul>
|
||
|
|
<p>Same example expressed in <strong>graphql-php</strong>:</p>
|
||
|
|
<pre><code class="php"><?php
|
||
|
|
use GraphQL\Type\Definition\Type;
|
||
|
|
use GraphQL\Type\Definition\ObjectType;
|
||
|
|
|
||
|
|
$userType = new ObjectType([
|
||
|
|
'name' => 'User',
|
||
|
|
'fields' => [
|
||
|
|
'id' => Type::nonNull(Type::id()),
|
||
|
|
'firstName' => Type::string(),
|
||
|
|
'lastName' => Type::string()
|
||
|
|
]
|
||
|
|
]);
|
||
|
|
|
||
|
|
$blogPostType = new ObjectType([
|
||
|
|
'name' => 'BlogPost',
|
||
|
|
'fields' => [
|
||
|
|
'title' => Type::nonNull(Type::string()),
|
||
|
|
'author' => $userType
|
||
|
|
]
|
||
|
|
]);
|
||
|
|
</code></pre>
|
||
|
|
|
||
|
|
<h1 id="further-reading">Further Reading</h1>
|
||
|
|
<p>To get deeper understanding of GraphQL concepts - <a href="http://graphql.org/learn/">read the docs on official GraphQL website</a></p>
|
||
|
|
<p>To get started with <strong>graphql-php</strong> - continue to next section <a href="../getting-started/">"Getting Started"</a></p>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<footer>
|
||
|
|
|
||
|
|
|
||
|
|
<hr/>
|
||
|
|
|
||
|
|
<div role="contentinfo">
|
||
|
|
<!-- Copyright etc -->
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
Built with <a href="http://www.mkdocs.org">MkDocs</a> using a <a href="https://github.com/snide/sphinx_rtd_theme">theme</a> provided by <a href="https://readthedocs.org">Read the Docs</a>.
|
||
|
|
</footer>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="rst-versions" role="note" style="cursor: pointer">
|
||
|
|
<span class="rst-current-version" data-toggle="rst-current-version">
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
<script>var base_url = '..';</script>
|
||
|
|
<script src="../js/theme.js" defer></script>
|
||
|
|
<script src="../search/main.js" defer></script>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|