Skip to content

GraphQL: Add File & LogInWith #702

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Mar 2, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
69 changes: 61 additions & 8 deletions _includes/graphql/files.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

The GraphQL API supports file upload via [GraphQL Upload](https://github.com/jaydenseric/graphql-upload), to send a `File` through `GraphQL` it's recommended to use the [Apollo Upload Client](https://github.com/jaydenseric/apollo-upload-client).

## Add a File field
## Add a File field to a Class
First of all we will update our `GameScore` class with a `screenshot` field of type `File`.

```js
Expand Down Expand Up @@ -42,9 +42,9 @@ mutation updateGameScoreClass {
}
```

## Create and add File
## Create a File

Currently the GraphQL API does not support nested mutation for the `File` type, so we need to send the file and then create/update the `GameScore` object with the returned information.
The GraphQL API supports nested mutation for the `File` type, so you can send the file along with the Parse Object or just upload the file and get the returned information.

```js
// Header
Expand Down Expand Up @@ -79,7 +79,10 @@ mutation createFile($file: Upload!) {
}
```

Then add the file to a new `GameScore` object.
## Add an existing file

You can add an existing file to an object.

```js
// Header
{
Expand All @@ -94,10 +97,60 @@ mutation createGameScore {
input: {
fields: {
playerName: "John"
screenshot: {
__type: "File",
name: "6a4d43c3f0512bcb6bf05b6b0e7db47d_file.png"
url: "http://localhost:1337/graphq/files/APPLICATION_ID/6a4d43c3f0512bcb6bf05b6b0e7db47d_file.png"
screenshot: {
file :{
__type: "File",
name: "6a4d43c3f0512bcb6bf05b6b0e7db47d_file.png"
url: "http://localhost:1337/graphq/files/APPLICATION_ID/6a4d43c3f0512bcb6bf05b6b0e7db47d_file.png"
}
}
}
}
) {
gameScore {
screenshot {
name
url
}
}
}
}
```
```js
// Response
{
"data": {
"createGameScore": {
"gameScore": {
"screenshot": {
"name": "6a4d43c3f0512bcb6bf05b6b0e7db47d_file.png",
"url": "http://localhost:1337/graphq/files/APPLICATION_ID/6a4d43c3f0512bcb6bf05b6b0e7db47d_file.png"
}
}
}
}
}
```

## Create and add a file
Lets create a new `GameScore` object and upload the file.
```js
// Header
{
"X-Parse-Application-Id": "APPLICATION_ID",
"X-Parse-Master-Key": "MASTER_KEY" // (optional)
}
```
```graphql
# GraphQL
# $file is a GraphQL Variable, see https://github.com/jaydenseric/apollo-upload-client
mutation createGameScore($file: Upload! ) {
createGameScore(
input: {
fields: {
playerName: "John"
screenshot: {
upload : $file
}
}
}
Expand Down
2 changes: 1 addition & 1 deletion _includes/graphql/objects.md
Original file line number Diff line number Diff line change
Expand Up @@ -161,7 +161,7 @@ The code above should resolve to something similar to this:

## Nested Mutation

The GraphQL API supports nested mutations (except for `File`), so you can create objects with complex relationships in one request. Assuming that we have classes `Country`, `City` and `Company`.
The GraphQL API supports nested mutations, so you can create objects with complex relationships in one request. Assuming that we have classes `Country`, `City` and `Company`.

```js
// Header
Expand Down
55 changes: 54 additions & 1 deletion _includes/graphql/users.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ To sign up a new user, use the `signUp` mutation. For example:
mutation signUp {
signUp(
input: {
userFields: {
fields: {
username: "johndoe"
password: "ASuperStrongPassword"
email: "[email protected]"
Expand Down Expand Up @@ -72,6 +72,7 @@ After you allow users to sign up, you need to let them log in to their account w
}
```
```graphql
# GraphQL
mutation logIn {
logIn(input: { username: "johndoe", password: "ASuperStrongPassword" }) {
viewer {
Expand Down Expand Up @@ -103,6 +104,58 @@ mutation logIn {

Note that, when the user logs in, Parse Server generates a new `sessionToken` for future operations.

## 3rd Party Authentication

You can log in a user via a [3rd party authentication](https://docs.parseplatform.org/parse-server/guide/#supported-3rd-party-authentications) system (Facebook, Twitter, Apple and many more) with the `logInWith` mutation.

```js
// Header
{
"X-Parse-Application-Id": "APPLICATION_ID",
"X-Parse-Master-Key": "MASTER_KEY" // optional
}
```
```graphql
# GraphQL
mutation LoginWithFacebook {
logInWith(
input: {
authData: {
facebook: {
id: "user's Facebook id number as a string"
access_token: "Facebook access token for the user"
expiration_date: "token expiration date"
}
}
fields: { email: "[email protected]" }
}
) {
viewer {
sessionToken
user {
id
email
}
}
}
}
```
```js
// Response
{
"data": {
"logInWith": {
"viewer": {
"sessionToken": "r:b0dfad1eeafa4425d9508f1c0a15c3fa",
"user": {
"email": "[email protected]"
}
}
}
}
}
```

## Using Session Token

For authenticating an operation as a specific user, you need to pass the `X-Parse-Session-Token` header with its valid session token.
Expand Down