De communicatie en gegevensoverdracht tussen de front-end en back-end van elke applicatie vindt plaats via API's (Application Programming Interface). Er zijn veel verschillende soorten API's die worden gebruikt om te communiceren tussen de front- en back-end-applicaties, zoals RESTful API, SOAP API, GraphQL API, enz. De GraphQL API is een relatief nieuwe technologie, en het is veel sneller dan andere beschikbare soorten API's. Het ophalen van gegevens uit de database met behulp van GraphQL api is veel sneller dan de REST API. Tijdens het gebruik van GraphQL API heeft de klant de controle om alleen de vereiste gegevens op te halen in plaats van alle details te krijgen; daarom werkt GraphQL API sneller dan REST API.
Pakketten installeren
We gaan een knooppunt bouwen.js-toepassing met GraphQL API, dus we moeten node installeren.js en npm hiervoor voordat u het project start.
[e-mail beveiligd]:~$ sudo apt-get update -y[e-mail beveiligd]:~$ sudo apt-get install nodejs
[e-mail beveiligd]:~$ sudo apt-get install npm
Project opzetten
We zullen het 'express'-framework van node . gebruiken.js om onze applicatie te bouwen. Maak een map met de naam 'graphql' en start het project.
[e-mail beveiligd]:~$ mkdir graphql[e-mail beveiligd]:~$ cd graphql/
[e-mail beveiligd]:~$ npm init -y
MongoDB-configuratie
In ons GraphQL-project zullen we MongoDB als onze database gebruiken. MongoDB is een schemaloze database en slaat gegevens op in de vorm van sleutelparen. Volg de gegeven stappen om mongoDB te installeren:.
Importeer de openbare GPG-sleutel voor MongoDB.
[e-mail beveiligd]:~$ wget -qO - https://www.mongodb.org/static/pgp/server-4.4.asc | sudo apt-key add -
Maak het lijstbestand voor mongodb.
Lokale opslagplaatsen bijwerken.
[e-mail beveiligd]:~$ sudo apt-get update -yMongodb-pakket installeren.
[email protected]:~$ sudo apt-get install -y mongodb-orgStart en activeer mongod.onderhoud.
[email protected]:~$ sudo systemctl start mongod.onderhoud[email protected]:~$ sudo systemctl enable mongod.onderhoud
Npm-modules installeren
Voor onze GraphQL-toepassing moeten we enkele npm-pakketten installeren. We installeren cors, express, body-parser, mangoest, enz.
[e-mail beveiligd]:~$ cd graphql/[email protected]:~$ npm install cors express body-parser mangoest --save
Om een GraphQL-api te maken, moeten we een extra npm-pakket installeren met de naam 'apollo-server-express.' Dit npm-pakket wordt gebruikt om de graphQL-server uit te voeren met alle Node.js HTTP-frameworks zoals 'express'.'
[email protected]:~$ npm install apollo-server-express --saveMongoDB-schema definiëren
Nu hebben we onze omgeving ingesteld voor onze GraphQL-toepassing in Node.js, en het is tijd om een schema voor onze applicatie te definiëren. Maak een bestand 'modellen/student' aan.js' in de hoofdmap van het project.
// studentenschema definiërenconst mangoest = vereisen('mangoest');
const studentSchema = nieuwe mangoest.Schema(
naam:
type: String,
vereist: waar
,
klas:
type: Nummer,
vereist: waar
,
hoofdvak:
type: String,
vereist: waar
,
tijdstempels: waar
);
const Student = mangoest.model('Student', studentSchema);
module.exports = Student, studentSchema
In het hierboven gedefinieerde schema moet elke student een naam, klas en major hebben.
GraphQL API bouwen
Nadat we het studentenschema hebben gemaakt, gaan we nu GraphQL API bouwen. Maak een 'schema'.js' om GraphQL-parameters te schrijven. Er zijn twee parameters, 'types' en 'resolvers', die worden gebruikt in GraphQL API. In 'types' specificeren we ons schema, de queries (e.g., GET-verzoeken maken), en mutaties (e.g., UPDATE- of DELETE-verzoeken maken) naar het opgegeven schema. We zullen de verschillende methoden schrijven die zijn gedefinieerd in 'types' om de query's en mutaties te koppelen aan de database in 'resolvers'.'
// importeren van schema en moduleconst gql = vereisen('apollo-server-express');
const Student = vereisen('./modellen/student').Leerling;
// Schema, query en mutatietype definiëren
const typeDefs = gql '
typ leerling
ik deed!,
naam: String!,
klas: Int!,
majeur: String!
typ zoekopdracht
getStudents: [Student],
getStudentById(id: ID!): Leerling
type Mutatie
addStudent( naam: String!, klasse: Int!, majeur: String! ): Leerling
updateStudent( naam: String!, klasse: Int!, majeur: String! ): Leerling
deleteStudent( id: ID! ): Leerling
'
// Oplossers definiëren
const oplossers =
Vraag:
getStudents: (ouder, argumenten) =>
terug Student.vind();
,
getStudentById: (ouder, argumenten) =>
terug Student.findById(args.ID kaart);
,
Mutatie:
addStudent: (ouder, argumenten) =>
laat student = nieuwe student(
naam: args.naam,
klasse: args.klasse,
majeur: args.majoor
);
terugkerende student.sparen();
,
updateStudent: (ouder, argumenten) =>
als(!argumenten.id) retour;
terug Student.findOneAndUpdate(
_id: argumenten.ID kaart
,
$set:
naam: args.naam,
klasse: args.klasse,
majeur: args.majoor
,
nieuw: waar , (err, student) =>
als (fout)
troosten.log (fout);
anders ;
)
module.export =
typeDefs,
oplossers
GraphQL API-server maken
Nu zijn we bijna klaar met het maken van de GraphQL-toepassing. De enige stap die overblijft is het maken van de server. Maak een bestand met de naam 'app'.js' om serverparameters te configureren.
// vereiste pakketten importerenconst express = vereisen('express');
const mangoest = vereisen('mangoest');
const bodyParser = vereisen('body-parser');
const cors = vereisen('cors');
const ApolloServer = vereisen('apollo-server-express');
// schema importeren
const typeDefs, resolvers = vereisen('./schema');
// verbinding maken met MongoDB
const url = "mongodb://127".0.0.1:27017/studenten”;
const connect = mangoest.connect(url, useNewUrlParser: true );
aansluiten.dan((db) =>
troosten.log('Verbinding geslaagd');
, (fout) =>
troosten.log (fout);
);
// server maken
const server = nieuwe ApolloServer(
typeDefs: typeDefs,
oplossers: oplossers
);
const-app = express();
app.gebruik (bodyParser).json());
app.gebruik('*', cors());
server.ApplyMiddleware( app );
app.luister( 8000, () =>
troosten.log('luisteren naar 8000');
)
De GraphQL API testen
We hebben onze graphQL-server in gebruik op poort 8000, en het is tijd om de GraphQL API te testen. Open de GraphQL-webpagina in de browser door de volgende url . te bezoeken.
http://localhost:8000/graphql
En het zal de volgende webpagina openen.
Voeg de student toe aan de database met behulp van graphQL API.
Voeg op dezelfde manier meer studenten toe en laat na het toevoegen van de student alle studenten de GraphQL API gebruiken.
Noteer de ID van een van de studenten en haal de specifieke student op met zijn id.
Conclusie
Het ophalen van gegevens uit de database met behulp van de standaard REST API maakt de query traag, omdat we soms meer gegevens krijgen dan nodig is. Met GraphQL kunnen we precies de benodigde gegevens ophalen die de GraphQL API sneller maken. In dit demoproject hebben we maar één schema, dus hebben we GraphQL API gemaakt voor dat ene schema. We hebben ook drie tot vier methoden voor het schema gedefinieerd:. U kunt meer dan één query of mutaties maken op basis van uw toepassing.