Meine Reaktionsreise: Tag 19

Üben Sie mit JSON-APIs und Mock-Servern

Die Arbeit mit JSON-Server ist eine großartige Möglichkeit, einen Backend-Server zu simulieren und API-Interaktionen wie GET, POST, PUT, PATCH und DELETE zu üben.

Was ist ein JSON-Server?

• Ein Tool, mit dem Sie schnell einen Scheinserver erstellen können, um mit einer JSON-Datenbank zu arbeiten.
• Ideal für das Prototyping und Testen von APIs, ohne dass ein voll funktionsfähiges Backend erforderlich ist.

Einrichtung und Installation

1. Voraussetzung: Node.js

• Stellen Sie sicher, dass Node.js auf Ihrem System installiert ist. Überprüfen Sie mit:

node -v
npm -v

2. JSON-Server installieren

• Globale Installation mit npm:

npm install -g json-server@0.17.4

So verwenden Sie den JSON-Server

1. Starten Sie den Server
Erstellen Sie in Ihrem Arbeitsverzeichnis eine db.json-Datei mit einigen Anfangsdaten. Beispiel:

{
  "posts": [
    { "id": 1, "title": "First Post", "content": "Hello World!" },
    { "id": 2, "title": "Second Post", "content": "Learning JSON-Server" }
  ]
}

• Starten Sie den Server und achten Sie auf Änderungen in der db.json-Datei:

json-server --watch db.json

• Standardmäßig läuft der Server unter http://localhost:3000.

2. Endpunkte erkunden
Der Server erstellt automatisch RESTful-Endpunkte für jede Sammlung in db.json:

• GET /posts → Alle Beiträge abrufen
• GET /posts/1 → Beitrag mit ID 1 abrufen
• POST /beiträge → Neuen Beitrag hinzufügen
• PUT /posts/1 → Ersetzen Sie den gesamten Beitrag durch ID 1
• PATCH /posts/1 → Bestimmte Felder im Beitrag mit ID 1 aktualisieren
• DELETE /posts/1 → Den Beitrag mit der ID 1 löschen

Mit Postman

Postman ist ein Tool zum Senden von HTTP-Anfragen zum Testen von APIs. So führen Sie die einzelnen Vorgänge mit Postman aus:

1. GET (Daten abrufen)

• Anfragetyp: GET
• URL: http://localhost:3000/posts
• Ruft die Liste der Beiträge ab.

2. POST (Neue Daten hinzufügen)

• Anfragetyp: POST
• URL: http://localhost:3000/posts
• Header: Content-Type: application/json
• Körper (JSON):

{
  "id": 3,
  "title": "New Post",
  "content": "This is a new post"
}

• Fügt einen neuen Beitrag zur Beitragssammlung hinzu.

3. PUT (Gesamte Ressource ersetzen)

• Anfragetyp: PUT
• URL: http://localhost:3000/posts/2
• Header: Content-Type: application/json

• Körper (JSON):
  {
  „title“: „Aktualisierter Titel“
  }

• Ergebnis: Ersetzt die gesamte Ressource durch die bereitgestellten Daten.

Vorher:

{
  "id": 2,
  "title": "Second Post",
  "content": "Learning JSON-Server"
}

Nachher:

{
  "title": "Updated Title"
}

4. PATCH (Bestimmte Felder aktualisieren)

• Anfragetyp: PATCH
• URL: http://localhost:3000/posts/1
• Header: Content-Type: application/json
• Körper (JSON):

node -v
npm -v

Ergebnis: Aktualisiert nur das angegebene Feld in der Ressource.

Vorher:

npm install -g json-server@0.17.4

Nachher:

{
  "posts": [
    { "id": 1, "title": "First Post", "content": "Hello World!" },
    { "id": 2, "title": "Second Post", "content": "Learning JSON-Server" }
  ]
}

5. DELETE (Daten entfernen)

• Anfragetyp: DELETE
• URL: http://localhost:3000/posts/1
• Löscht den Beitrag mit der ID 1.

Hauptunterschiede zwischen PUT und PATCH

PUT

• Ersetzt die gesamte Ressource.
• Lasst alle Felder weg, die nicht im Text enthalten sind.

PATCH

• Aktualisiert nur bestimmte Felder.
• Behält Felder bei, die nicht im Textkörper erwähnt werden.

Abschluss

Was ich gelernt habe:

• JSON-Server installiert und verwendet, um einen Schein-API-Server zu erstellen.
• Grundlegende API-Operationen geübt: GET, POST, PUT, PATCH, DELETE.
• Verstanden den Unterschied zwischen PUT und PATCH.

Tag 19 am Boden zerstört.

Das obige ist der detaillierte Inhalt vonMeine Reaktionsreise: Tag 19. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!