GraphQL API mit Swift: Schritt-für-Schritt-Tutorial in der Praxis

Online Python-Trainer für Anfänger

Lernen Sie Python einfach ohne theoretische Überlastung. Lösen Sie praktische Aufgaben mit automatischer Überprüfung und schreiben Sie Code direkt im Browser.

Kurs starten

Einführung in GraphQL und Swift

\n

GraphQL ist eine Abfragesprache für APIs, die es Clients ermöglicht, genau die Daten zu erhalten, die sie benötigen, und nichts Überflüssiges. Für iOS- und macOS-Entwickler eröffnet die Integration von GraphQL neue Möglichkeiten zur Erstellung effizienter und flexibler mobiler Anwendungen. In diesem Tutorial werden wir in der Praxis durchgehen, wie man eine GraphQL API in ein Swift-Projekt einbindet, grundlegende Abfragen und Mutationen durchführt und mögliche Fehler behandelt.

\n

Im Gegensatz zu traditionellem REST ermöglicht GraphQL das Abfragen mehrerer Ressourcen in einer einzigen Anfrage, was besonders für mobile Geräte mit begrenztem Datenvolumen wichtig ist. Wir werden die beliebte Bibliothek Apollo iOS verwenden – die stabilste und am besten dokumentierte Lösung für die Arbeit mit GraphQL in Swift.

\n\n

Projektvorbereitung und Installation von Apollo iOS

\n

Schritt 1: Projekt erstellen und Abhängigkeiten installieren

\n

Öffnen Sie Xcode und erstellen Sie ein neues iOS-Projekt (oder macOS). Für die Arbeit mit GraphQL installieren wir Apollo iOS über den Swift Package Manager (SPM).

\n
    \n
  1. Wählen Sie in Xcode File → Add Packages
  2. \n
  3. Fügen Sie die Repository-URL ein: https://github.com/apollographql/apollo-ios.git
  4. \n
  5. Wählen Sie die neueste stabile Version (zum Zeitpunkt der Erstellung – 1.15+)
  6. \n
  7. Fügen Sie das Paket zu Ihrem Target hinzu
  8. \n
\n\n

Schritt 2: Codegenerierung basierend auf dem GraphQL-Schema

\n

Apollo iOS verwendet Codegenerierung: Sie beschreiben Abfragen in .graphql-Dateien, und das Dienstprogramm erstellt typisierten Swift-Code. Dazu ist Folgendes erforderlich:

\n
    \n
  1. Erstellen Sie einen Ordner GraphQL im Projekt
  2. Platzieren Sie dort die Datei schema.graphqls (das Schema Ihrer API) – diese kann normalerweise durch Introspection bezogen werden
  3. Erstellen Sie eine Abfragedatei, z. B. GetUser.graphql:
\n\n
query GetUser($id: ID!) {\n  user(id: $id) {\n    id\n    name\n    email\n    posts {\n      title\n    }\n  }\n}
\n\n

Fügen Sie dann eine Build Phase mit dem Start des Codegenerators hinzu. Am einfachsten installieren Sie die Apollo CLI über Homebrew:

\n
brew install apollo-ios-cli
\n\n

Und führen Sie den Befehl im Projektstammverzeichnis aus:

\n
./apollo-ios-cli generate
\n\n

Danach erscheinen im Ordner Sources/API die generierten Swift-Dateien mit den Datenmodellen.

\n\n

Durchführen grundlegender GraphQL-Abfragen

\n

Einrichtung des Apollo-Clients

\n

Erstellen Sie eine Instanz des Apollo-Clients und geben Sie die URL Ihres GraphQL-Endpunkts an. Dies geschieht normalerweise im AppDelegate oder in einer separaten Service-Klasse:

\n\n
import Apollo\n\nclass NetworkService {\n    static let shared = NetworkService()\n    private(set) lazy var apollo: ApolloClient = {\n        let url = URL(string: "https://your-api.com/graphql")!\n        return ApolloClient(url: url)\n    }()\n}
\n\n

Datenabfrage (Query)

\n

Führen wir nun eine Abfrage zum Abrufen eines Benutzers durch. Der generierte Code erstellt eine Struktur GetUserQuery:

\n\n
import Foundation\n\nclass UserViewModel: ObservableObject {\n    @Published var user: User?\n    @Published var errorMessage: String?\n    \n    func fetchUser(id: String) {\n        NetworkService.shared.apollo.fetch(query: GetUserQuery(id: id)) { [weak self] result in\n            DispatchQueue.main.async {\n                switch result {\n                case .success(let graphQLResult):\n                    if let userData = graphQLResult.data?.user {\n                        self?.user = User(\n                            id: userData.id,\n                            name: userData.name,\n                            email: userData.email\n                        )\n                    }\n                case .failure(let error):\n                    self?.errorMessage = "Fehler: \\(error.localizedDescription)"\n                }\n            }\n        }\n    }\n}
\n\n

Beachten Sie: Wir verwenden @Published für die reaktive Aktualisierung der Benutzeroberfläche in

Blogs

Buchempfehlungen