/gdg19-prisma-ts

A Prisma server build with TypeScript using Nexus

Primary LanguageTypeScript

GraphQL Server with Authentication & Permissions

This example shows how to implement a GraphQL server with an email-password-based authentication workflow and authentication rules, based on Prisma, graphql-yoga, graphql-shield & GraphQL Nexus.

How to use

1. Download example & install dependencies

Clone the prisma2 branch of this repository:

git clone --single-branch --branch prisma2 git@github.com:prisma/prisma-examples.git

Install Node dependencies:

cd prisma-examples/typescript/graphql-auth
npm install

2. Set up database

For this example, you'll use a simple SQLite database. To set up your database, run:

npx prisma2 lift save --name 'init'
npx prisma2 lift up

Note: You're using npx to run the Prisma Framework CLI that's listed as a development dependency in package.json. Alternatively, you can install the CLI globally using npm install -g prisma2.

You can now use the SQLite Browser to view and edit your data in the ./prisma/dev.db file that was created when you ran prisma2 lift up.

Alternative: Connect to your own database

Prisma supports MySQL and PostgreSQL at the moment. If you would like to connect to your own database, you can do so by specifying a different data source in the Prisma schema file.

For a MySQL provider:

datasource mysql {
    provider = "mysql"
    url      = "mysql://johndoe:secret42@localhost:3306/mydatabase"
}

OR

For a PostgreSQL provider:

datasource postgresql {
  provider = "postgresql"
  url      = "postgresql://johndoe:secret42@localhost:5432/mydatabase?schema=public"
}

Note: In the above example connection strings, johndoe would be the username to your database, secret42 the password, mydatabase the name of your database, and public the PostgreSQL schema.

Then to migrate your database, run:

npx prisma2 lift save --name 'init'
npx prisma2 lift up

3. Generate Photon (type-safe database client)

Run the following command to generate Photon.js:

npx prisma2 generate

Now you can seed your database using the seed script from package.json:

npm run seed

4. Start the GraphQL server

Launch your GraphQL server with this command:

npm run start

Navigate to http://localhost:4000 in your browser to explore the API of your GraphQL server in a GraphQL Playground.

5. Using the GraphQL API

The schema that specifies the API operations of your GraphQL server is defined in ./src/schema.graphql. Below are a number of operations that you can send to the API using the GraphQL Playground.

Feel free to adjust any operation by adding or removing fields. The GraphQL Playground helps you with its auto-completion and query validation features.

Retrieve all published posts and their authors

query {
  feed {
    id
    title
    content
    published
    author {
      id
      name
      email
    }
  }
}
See more API operations

Register a new user

You can send the following mutation in the Playground to sign up a new user and retrieve an authentication token for them:

mutation {
  signup(name: "Sarah", email: "sarah@prisma.io", password: "graphql") {
    token
  }
}

Log in an existing user

This mutation will log in an existing user by requesting a new authentication token for them:

mutation {
  login(email: "sarah@prisma.io", password: "graphql") {
    token
  }
}

Check whether a user is currently logged in with the me query

For this query, you need to make sure a valid authentication token is sent along with the Bearer-prefix in the Authorization header of the request:

{
  "Authorization": "Bearer __YOUR_TOKEN__"
}

With a real token, this looks similar to this:

{
  "Authorization": "Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiJjanAydHJyczFmczE1MGEwM3kxaWl6c285IiwiaWF0IjoxNTQzNTA5NjY1fQ.Vx6ad6DuXA0FSQVyaIngOHYVzjKwbwq45flQslnqX04"
}

Inside the Playground, you can set HTTP headers in the bottom-left corner:

Once you've set the header, you can send the following query to check whether the token is valid:

{
  me {
    id
    name
    email
  }
}

Create a new draft

You need to be logged in for this query to work, i.e. an authentication token that was retrieved through a signup or login mutation needs to be added to the Authorization header in the GraphQL Playground.

mutation {
  createDraft(
    title: "Join the Prisma Slack"
    content: "https://slack.prisma.io"
  ) {
    id
    published
  }
}

Publish an existing draft

You need to be logged in for this query to work, i.e. an authentication token that was retrieved through a signup or login mutation needs to be added to the Authorization header in the GraphQL Playground. The authentication token must belong to the user who created the post.

mutation {
  publish(id: "__POST_ID__") {
    id
    published
  }
}

Note: You need to replace the __POST_ID__-placeholder with an actual id from a Post item. You can find one e.g. using the filterPosts-query.

Search for posts with a specific title or content

You need to be logged in for this query to work, i.e. an authentication token that was retrieved through a signup or login mutation needs to be added to the Authorization header in the GraphQL Playground.

{
  filterPosts(searchString: "graphql") {
    id
    title
    content
    published 
    author {
      id
      name
      email
    }
  }
}

Retrieve a single post

You need to be logged in for this query to work, i.e. an authentication token that was retrieved through a signup or login mutation needs to be added to the Authorization header in the GraphQL Playground.

{
  post(id: "__POST_ID__") {
    id
    title
    content
    published
    author {
      id
      name
      email
    }
  }
}

Note: You need to replace the __POST_ID__-placeholder with an actual id from a Post item. You can find one e.g. using the filterPosts-query.

Delete a post

You need to be logged in for this query to work, i.e. an authentication token that was retrieved through a signup or login mutation needs to be added to the Authorization header in the GraphQL Playground. The authentication token must belong to the user who created the post.

mutation {
  deletePost(id: "__POST_ID__") {
    id
  }
}

Note: You need to replace the __POST_ID__-placeholder with an actual id from a Post item. You can find one e.g. using the filterPosts-query.

5. Changing the GraphQL schema

To make changes to the GraphQL schema, you need to manipulate the Query and Mutation types.

Note that the start script also starts a development server that automatically updates your schema every time you save a file. This way, the auto-generated GraphQL schema updates whenever you make changes in to the Query or Mutation types inside your TypeScript code.

Next steps