BETA

Part 8: Graph QL 学習記録

投稿日:2019-10-09
最終更新:2019-10-10

【8-a】

REST -> リソースベース
リソースに対するすべての操作は、対応するURLへのHTTPリクエストにより成される。

GraphQL: 常にPOSTで、同一のアドレスに対してリクエストされる

・スキーマ

GraphQLの中心は、スキーマ。

type Person {  
  name: String!  
  phone: String  
  street: String!  
  city: String!  
  id: ID!   
}  

type Query {  
  personCount: Int!  
  allPersons: [Person!]!  
  findPerson(name: String!): Person  
}  

! = 必ず値がある。non-null。逆にないとオプショナル。
ID型: String! だが、常に一意にならないといけない。

type Query = 必ず定義する型。このAPIに対し、どんな命令が来るか(と、その返り値)を定義。

・オブジェクト型・配列型は、そのクラスのどのプロパティを返すか指定する

// 配列型  
query {  
  allPersons {  
    name  
    phone  
  }  
}  

// オブジェクト型  
query {  
  findPerson(name: "Arto Hellas") {  
    phone   
    city   
    street  
    id  
  }  
}  

・Apollo-server

基本実装

const { ApolloServer, gql } = require('apollo-server')  

let persons = [  
  {  
    name: "Arto Hellas",  
    phone: "040-123543",  
    street: "Tapiolankatu 5 A",  
    city: "Espoo",  
    id: "3d594650-3436-11e9-bc57-8b80ba54c431"  
  },  
  {  
    name: "Matti Luukkainen",  
    phone: "040-432342",  
    street: "Malminkaari 10 A",  
    city: "Helsinki",  
    id: '3d599470-3436-11e9-bc57-8b80ba54c431'  
  },  
  {  
    name: "Venla Ruuska",  
    street: "Nallementie 22 C",  
    city: "Helsinki",  
    id: '3d599471-3436-11e9-bc57-8b80ba54c431'  
  },  
]  

const typeDefs = gql`  
  type Person {  
    name: String!  
    phone: String  
    street: String!  
    city: String!   
    id: ID!  
  }  

  type Query {  
    personCount: Int!  
    allPersons: [Person!]!  
    findPerson(name: String!): Person  
  }  
`  

const resolvers = {  
  Query: {  
    personCount: () => persons.length,  
    allPersons: () => persons,  
    findPerson: (root, args) =>  
      persons.find(p => p.name === args.name)  
  }  
}  

const server = new ApolloServer({  
  typeDefs,  
  resolvers,  
})  

server.listen().then(({ url }) => {  
  console.log(`Server ready at ${url}`)  
})  

この引数は、

(root, args) => persons.find(p => p.name === args.name)

args: 引数に渡したパラメータ

実は、すべてのリゾルバ関数は、引数を4つ与えられる。ここ に詳しい。

・default resolver

実は Person型に対しては、デフォルトのリゾルバが内部的に定義されていた。

const resolvers = {  
  Query: {  
    personCount: () => persons.length,  
    allPersons: () => persons,  
    findPerson: (root, args) => persons.find(p => p.name === args.name)  
  },  
  Person: {  ← ここから  
    name: (root) => root.name,  
    phone: (root) => root.phone,  
    street: (root) => root.street,  
    city: (root) => root.city,  
    id: (root) => root.id  
  }  ← ここまで  
}  

特定の型に対するリゾルバの挙動を変えたいときのみ、リゾルバを独自定義すればよい。

技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
駆け出しエンジニアからエキスパートまで全ての方々のアウトプットを歓迎しております!
or 外部アカウントで 登録 / ログイン する
クランチについてもっと詳しく

この記事が掲載されているブログ

備忘録ほどの価値もない走り書き

よく一緒に読まれる記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう
目次をみる
技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
or 外部アカウントではじめる
10秒で技術ブログが作れます!