14. Oktober 2019

Tutorial: JSON-Daten mit URLSession laden und in einem UITableView anzeigen

Dieses Tutorial für zeigt Schritt für Schritt, wie JSON-Daten im Hintergrund mit der URLSession geladen werden, mit der JSONDecoder-Klasse dekodiert werden und in einem UITableView zur Anzeige gebracht werden:

  1. Verwende für dieses Tutorial die aktuelle Version von Xcode (dieses Tutorial wurde zuletzt getestet am 14.10.2019 mit Xcode 11).

  2. Verwende das Projekt aus dem UITableViewController-Tutorial oder lade das zugehörige Beispielprojekt Countries. Dieses enthält einen UITableViewController der Daten aus einem Swift-Array zur Anzeige bringt:

    Beispielprojekt Countries für UITableViewController
  3. Rufe im Browser die Beispiel-JSON-Daten auf und mache Dich mit dem Format der Daten vertraut:

    Anzeige der JSON-Beispieldaten im Browser

    Hinweis: Für dieses Beispiel wird eine HTTPs-URL verwendet, da unverschlüsselte HTTP-URLs seit iOS 9 eine gesonderte Konfiguration erfordern.

  4. Öffne CountriesTableViewController.swift. Verwende die URLSession um einen dataTask zu erzeugen und zu starten:

    class CountriesTableViewController: UITableViewController {
    
    	override func viewDidLoad() {
    		super.viewDidLoad()
    	
    		let url = URL(string: "https://www.ralfebert.de/examples/countries.json")!
    		
    		let urlSession = URLSession.shared
    		
    		let task = urlSession.dataTask(with: url) { (data, response, error) in
    			
    		}
    		
    		task.resume()
    	}
    
    	// ...
    
    }
    

    Hinweis: Verwende die Code-Vervollständigung um den Aufruf zu tippen und achte darauf, die richtige Methode mit NSURL + completionHandler auszuwählen:

    Vervollständigung für NSURLSession.dataTask

    Hinweis: Bestätige Sie den Xcode-Vorschlag mit Enter. Springe mit Tab zu dem completionHandler-Parameter und bestätige den Vorschlag ebenfalls mit Enter um den Block-Code zu erzeugen. Vergib hier die Variablennamen data, response, error für die Parameter:

    Xcode Code-Vervollständigung für den completionHandler-Block
  5. Entferne in Countries.swift die Eigenschaft allCountries mit den Beispieldaten und deklariere den Typ als Codable:

    struct Country : Codable {
    
    	var iso2: String
    	var name: String
    
    }
    
  6. Passe die countries-Eigenschaft im CountriesTableViewController so an, dass diese zunächst mit einer leeren Liste initialisiert wird. Implementiere den completionHandler des dataTask so, dass die Daten mittels JSONDecoder dekodiert werden und aktualisiere die Darstellung (dies muss auf dem Main-Thread erfolgen, der completionHandler wird auf dem Hintergrund-Thread ausgeführt, der die Daten geladen hat):

    let task = urlSession.dataTask(with: url) { (data, response, error) in
    	// Fehlerbehandlung für den Fall, das ein Fehler aufgetreten ist und data nicht gesetzt ist
    	guard let data = data else {
    		debugPrint("Fehler beim Laden", error ?? "Unbekannter Fehler")
    		return
    	}
    	
    	// JSON parsen
    	self.countries = try! JSONDecoder().decode([Country].self, from: data)
    	
    	// UI-Darstellung aktualisieren
    	OperationQueue.main.addOperation {
    	    self.tableView.reloadData()
    	}
    }
    
  7. Starte die App mit Product » Run ⌘R und prüfe, dass die Länder geladen und angezeigt werden:

    Ergebnis Länderanzeige via JSON