GraphQL

Mirage 提供一流的輔助函式來模擬 RESTful API，但目前尚未提供開箱即用的 GraphQL 支援。這就是 Mirage GraphQL 函式庫的用途。

Mirage GraphQL 提供有用的函式來為您的 GraphQL 端點建立請求處理器，並可選擇建立您自己的自訂解析器。

要開始使用，請從 Mirage GraphQL 匯入 createGraphQLHandler 函式，並傳入您的 GraphQL 和 Mirage 綱要。Mirage GraphQL 將盡可能自動為您解析 GraphQL 查詢。

在以下範例中，您不需要為任何查詢或變更提供自己的解析器。此外，您也不需要建立任何 Mirage 模型。Mirage GraphQL 將根據您的 GraphQL 綱要為您建立模型。

在 REPL 中試試這個範例!
import { createServer } from "miragejs"
import { createGraphQLHandler } from "@miragejs/graphql"

const graphQLSchema = `
  input MovieInput {
    title: String
  }

  type Movie {
    id: ID!
    title: String!
  }

  type Mutation {
    createMovie(input: MovieInput!): Movie
    deleteMovie(id: ID!): Movie
    updateMovie(id: ID!, input: MovieInput!): Movie
  }

  type Query {
    movies(title: String): [Movie]
    movie(id: ID, title: String): Movie
  }
`

createServer({
  routes() {
    this.post("/graphql", createGraphQLHandler(graphQLSchema, this.schema))
  },
  
  seeds(server) {
    server.create("Movie", {
      title: "The Lord of the Rings: The Fellowship of the Ring"
    })
    server.create("Movie", {
      title: "The Lord of the Rings: The Two Towers"
    })
    server.create("Movie", {
      title: "The Lord of the Rings: The Return of the King"
    })
  },
})

// Get a movie by its title
const movieQuery = `
query Movie($id: ID, $title: String) {
  movie(id: $id, title: $title) {
    id
    title
  }
}
`

request(
  "/graphql",
  movieQuery,
  { variables: { title: "The Lord of the Rings: The Two Towers" } }
).then(/* ... */)

// Add a movie
const createMovieMutation = `
mutation CreateMovie($input: MovieInput!) {
  createMovie(input: $input) {
    id
    title
  }
}
`

request(
  "/graphql",
  createMovieMutation,
  { variables: { title: "The Hobbit: An Unexpected Journey" } }
).then(/* ... */)

注意：此範例在單一檔案中，以簡化操作。在實際的應用程式中，您應該從單獨的檔案匯入您的 GraphQL 綱要。

Mirage GraphQL 可以做的事情還有很多。例如，您可以

  • 提供您自己的解析器，以便您可以執行諸如排序結果或在一個變更中新增三部電影之類的操作
  • 將上下文物件提供給處理器，以便您可以模擬諸如使用者驗證之類的事情
  • 為處理器提供一個根物件，以處理後端具有根物件且您需要模擬的情況

以及更多。

Mirage GraphQL 是 v0.1.x，但它是從多年來在 ember-cli-mirage-graphql 函式庫上的工作中所提取的。

若要瞭解更多資訊，請查看 Mirage GraphQL 的 README。另請查看整合測試，以取得更多關於選項、查詢和變更的深入範例。

Mirage & graphql-mocks

作為使用 Mirage 和 GraphQL 進行模擬的非官方社群替代方案，請查看 graphql-mocks 及其 Mirage 中介軟體。

考慮將 graphql-mocks 與 Mirage 搭配使用，以達到以下目的

  • 用於管理和建立不同情境和狀態的可組合中介軟體
  • 用於擴充查詢解析的解析器和解析器地圖抽象
  • 在 Node 環境中進行模擬
  • 使用不同的網路抽象（Mock Service Worker、Nock 等）彈性地進行模擬
  • 完全支援 Typescript，並與 graphql 類型具有類型相容性