Slide 1

Slide 1 text

2 024 / 0 1 / 2 5 SAW Postman で GraphQL のクエリを 送ってみよう Postman Osaka Meetup 2 0 2 4 . 1

Slide 2

Slide 2 text

$(whoami) • ⽒名: 加藤 宗⼀郎 (29歳) • ハンドルネーム: SAW • ⼤阪在住‧愛知出⾝ • X (旧 Twitter): @azuki_eater • 得意分野: Web アプリケーション開発 • Laravel, Vue

Slide 3

Slide 3 text

⼿軽に GraphQL のクエリを送りたい • GraphQL の API サーバーを構築 • クエリを投げてサーバーからのレスポンスの内容を確認したい • GraphiQL • ブラウザから GraphQL のクエリが送信できる IDE • クエリの補完や syntax highlighting が利⽤可能 • パッケージのインストールなどの環境構築が必要

Slide 4

Slide 4 text

Postman でも GraphQL のクエリを ⼿軽に送信できます

Slide 5

Slide 5 text

Postman で GraphQL のクエリを送信 • Body から GraphQL を選択 • QUERY のフォームに GraphQL のクエリを⼊⼒ • GRAPHQL VARIABLES のフォームにクエリ変数の定義を⼊⼒ • JSON 形式で変数名と値を指定

Slide 6

Slide 6 text

Postman を使うメリット • GraphiQL のような環境構築が不要 • GraphiQL と同様にクエリの補完や syntax highlighting が利⽤可能 • Schema 情報を取得 • 更新ボタンを押すことで 更新された schema 情報を取得 • クエリの補完にも反映される • Schema や resolver の設定が正しくないと警告マークが表⽰される • セッション認証などの認証情報も設定可能 • Postman で Cookie が利⽤可能

Slide 7

Slide 7 text

GraphQL のクエリ補完機能 • API サーバーから fetch した schema 情報に基づいて補完を表⽰

Slide 8

Slide 8 text

• Cookie を送信することでセッション認証が利⽤可能 • Postman が保持している Cookie をリクエスト送信時に⾃動的に設定 セッション認証の利⽤ 認証前 認証後

Slide 9

Slide 9 text

総括 • Postman は GraphQL クライアントとしても有⽤ • クエリの補完や syntax highlighting が利⽤可能 • クエリ変数の設定も可能 • Schema 情報を取得してクエリ補完機能に反映 • セッション認証も利⽤可能 • クエリ送信時にセッション認証の Cookie を送信

Slide 10

Slide 10 text

Postman は GraphQL の APIクライアントとしても便利!!

Slide 11

Slide 11 text

ご清聴ありがとうございました

Slide 12

Slide 12 text

宣伝 • PHPカンファレンス関⻄2024 開催予定✨ • ⽇付: 2024/2/11 (⽇) • 開催場所: グランフロント⼤阪 • ⼀般参加チケット発売中 • お誘いチケットで周りの⼈も誘おう! • PHPerシール の特典は 1/26 まで! • 詳細は 公式サイト をご確認ください PHPerシール イメージ図