如何使用 Prisma 和 GraphQL 快速建立数据服务-JavaScript中文网-JavaScript教程资源分享门户

在现代化的 Web 应用程序中，数据服务是一个必不可少的组件。Prisma 和 GraphQL 是两个流行的工具，它们可以帮助我们快速地建立数据服务。本文将介绍如何使用 Prisma 和 GraphQL 来快速建立数据服务，并提供示例代码。

Prisma 和 GraphQL 简介

Prisma

Prisma 是一个现代化的 ORM（对象关系映射）工具，它可以帮助我们轻松地访问和管理数据库。Prisma 支持多种数据库，包括 MySQL、PostgreSQL 和 MongoDB。使用 Prisma 可以轻松地定义数据模型、创建数据库迁移和执行查询。

GraphQL

GraphQL 是一个现代化的数据查询和操作语言。与传统的 REST API 不同，GraphQL 允许客户端指定需要的数据，从而避免了过度获取不需要的数据。GraphQL 还支持数据变更，例如创建、更新和删除数据。

使用 Prisma 和 GraphQL 建立数据服务

使用 Prisma 和 GraphQL 建立数据服务非常简单。我们将使用 Node.js 和 TypeScript 作为开发环境，并使用 Prisma 来访问数据库，使用 GraphQL 来查询和操作数据。

步骤 1：安装依赖

我们需要安装以下依赖：

prisma: Prisma 的主要依赖。
graphql: GraphQL 的主要依赖。
apollo-server: Apollo Server 是一个流行的 GraphQL 服务器库，它可以帮助我们轻松地创建 GraphQL 服务器。

可以使用以下命令安装这些依赖：

npm install prisma graphql apollo-server

步骤 2：定义数据模型

我们需要定义数据模型，以便 Prisma 可以生成数据库迁移和访问代码。我们将使用一个简单的博客应用程序作为示例，其中包含帖子和评论。

在项目根目录中创建一个 schema.prisma 文件，然后添加以下内容：

// javascriptcn.com 代码示例
datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}

generator client {
  provider = "prisma-client-js"
}

model Post {
  id        Int      @id @default(autoincrement())
  title     String
  content   String
  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
  comments  Comment[]
}

model Comment {
  id        Int      @id @default(autoincrement())
  content   String
  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
  post      Post     @relation(fields: [postId], references: [id])
  postId    Int
}

这个数据模型定义了两个实体：Post 和 Comment。每个实体都有一个 id 属性作为主键，以及其他属性。Post 实体还有一个 comments 属性，它是一个关系属性，表示一个帖子可以有多个评论。Comment 实体有一个 postId 属性，它是一个外键属性，表示一个评论属于哪个帖子。

步骤 3：生成数据库迁移

我们需要使用 Prisma 来生成数据库迁移。可以使用以下命令生成迁移：

npx prisma migrate dev --name init

这个命令将会创建一个数据库迁移，它会在数据库中创建两个表：Post 和 Comment。

步骤 4：定义 GraphQL 模式

我们需要定义 GraphQL 模式，以便客户端可以查询和操作数据。在项目根目录中创建一个 schema.graphql 文件，然后添加以下内容：

// javascriptcn.com 代码示例
type Post {
  id: Int!
  title: String!
  content: String!
  createdAt: DateTime!
  updatedAt: DateTime!
  comments: [Comment!]!
}

type Comment {
  id: Int!
  content: String!
  createdAt: DateTime!
  updatedAt: DateTime!
  post: Post!
}

type Query {
  posts: [Post!]!
  post(id: Int!): Post
}

type Mutation {
  createPost(title: String!, content: String!): Post!
  updatePost(id: Int!, title: String!, content: String!): Post!
  deletePost(id: Int!): Post!
}

这个 GraphQL 模式定义了一个 Post 类型和一个 Comment 类型，以及 Query 和 Mutation 类型。Query 类型定义了两个查询：posts 和 post，它们可以用于获取所有帖子或单个帖子。Mutation 类型定义了三个变更：createPost、updatePost 和 deletePost，它们可以用于创建、更新和删除帖子。

步骤 5：实现 GraphQL 服务器

我们需要使用 Apollo Server 来实现 GraphQL 服务器。在项目根目录中创建一个 index.ts 文件，然后添加以下内容：

// javascriptcn.com 代码示例
import { ApolloServer } from 'apollo-server'
import { PrismaClient } from '@prisma/client'
import fs from 'fs'
import path from 'path'
import { resolvers } from './resolvers'

const prisma = new PrismaClient()

const server = new ApolloServer({
  typeDefs: fs.readFileSync(path.join(__dirname, 'schema.graphql'), 'utf8'),
  resolvers,
  context: () => ({ prisma }),
})

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

这个文件创建了一个 Apollo Server 实例，并使用 typeDefs 和 resolvers 参数来定义 GraphQL 模式和解析器。我们还将 Prisma 客户端实例添加到上下文中，以便解析器可以使用它来访问数据库。

步骤 6：实现解析器

我们需要实现解析器，以便客户端可以查询和操作数据。在项目根目录中创建一个 resolvers.ts 文件，然后添加以下内容：

// javascriptcn.com 代码示例
import { PrismaClient } from '@prisma/client'

const prisma = new PrismaClient()

export const resolvers = {
  Query: {
    async posts() {
      return prisma.post.findMany()
    },
    async post(_parent, { id }) {
      return prisma.post.findUnique({ where: { id } })
    },
  },
  Mutation: {
    async createPost(_parent, { title, content }) {
      return prisma.post.create({ data: { title, content } })
    },
    async updatePost(_parent, { id, title, content }) {
      return prisma.post.update({ where: { id }, data: { title, content } })
    },
    async deletePost(_parent, { id }) {
      return prisma.post.delete({ where: { id } })
    },
  },
  Post: {
    async comments(parent) {
      return prisma.comment.findMany({ where: { postId: parent.id } })
    },
  },
  Comment: {
    async post(parent) {
      return prisma.post.findUnique({ where: { id: parent.postId } })
    },
  },
}

这个文件实现了解析器，它包含 Query 和 Mutation 类型的解析器，以及 Post 和 Comment 类型的解析器。每个解析器都使用 Prisma 客户端来访问数据库。

步骤 7：启动服务器

我们可以使用以下命令启动服务器：

npm run dev

这个命令将会启动服务器，并在控制台输出服务器的 URL。

步骤 8：测试服务器

我们可以使用 GraphQL Playground 来测试服务器。在浏览器中打开服务器的 URL，然后使用 Playground 进行测试。以下是一些示例查询和变更：

查询所有帖子：

// javascriptcn.com 代码示例
query {
  posts {
    id
    title
    content
    createdAt
    updatedAt
    comments {
      id
      content
      createdAt
      updatedAt
    }
  }
}

查询单个帖子：

// javascriptcn.com 代码示例
query {
  post(id: 1) {
    id
    title
    content
    createdAt
    updatedAt
    comments {
      id
      content
      createdAt
      updatedAt
    }
  }
}

创建帖子：

// javascriptcn.com 代码示例
mutation {
  createPost(title: "Hello", content: "World") {
    id
    title
    content
    createdAt
    updatedAt
  }
}

更新帖子：

// javascriptcn.com 代码示例
mutation {
  updatePost(id: 1, title: "Hello", content: "World") {
    id
    title
    content
    createdAt
    updatedAt
  }
}

删除帖子：

// javascriptcn.com 代码示例
mutation {
  deletePost(id: 1) {
    id
    title
    content
    createdAt
    updatedAt
  }
}

总结

本文介绍了如何使用 Prisma 和 GraphQL 来快速建立数据服务。我们首先定义了数据模型，然后使用 Prisma 生成数据库迁移和访问代码。接下来，我们定义了 GraphQL 模式，并实现了解析器。最后，我们启动了服务器，并使用 GraphQL Playground 进行了测试。

使用 Prisma 和 GraphQL 可以帮助我们轻松地建立数据服务，从而加快 Web 应用程序的开发速度。如果您想深入学习 Prisma 和 GraphQL，请查阅官方文档。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/6587bd2aeb4cecbf2dcfde04