When updating UI with json response, "Thread 1: Fatal error: Index out of range." is received - Swift - swift

Question

Attempting to update a menu item to return all fixtures from api.
I've got a list of fixtures being returned.
How do I go about updating the fixtureMenuItem in the MenuController with all fixtures returned from the JSON? I thought I might be able to do something along the lines of fixtureMenuItem.title = fixtures.description
, but I'm getting "Thread 1: Fatal error: Index out of range."
Model
struct LiveScores: Codable {
let success: Bool
let fixturesData: FixturesData?
enum CodingKeys: String, CodingKey {
case fixturesData = "data"
case success
}
}
struct FixturesData: Codable {
let fixtures: [Fixture]
let nextPage, prevPage: Bool
enum CodingKeys: String, CodingKey {
case fixtures
case nextPage = "next_page"
case prevPage = "prev_page"
}
}
struct Fixture: Codable, CustomStringConvertible {
let id, date, time, round: String
let homeName, awayName, location, leagueID: String
let homeID, awayID: Int?
enum CodingKeys: String, CodingKey {
case id, date, time, round
case homeName = "home_name"
case awayName = "away_name"
case location
case leagueID = "league_id"
case homeID = "home_id"
case awayID = "away_id"
}
var description: String {
return "\(time): \(homeName) vs. \(awayName)"
}
}
// MARK: Convenience initializers
extension LiveScores {
init(data: Data) throws {
self = try JSONDecoder().decode(LiveScores.self, from: data)
}
}
Menu Controller - this is where I want to update the fixture menu item, to include the time, home and away team names. "Here is where all the fixtures will be populated!" - this is the hardcoded text I wish to replace with the fixture data.
var fixtures = [Fixture]()
func updateScores() {
liveScoreApi.fetchFixtures()
if let fixtureMenuItem = self.Menu.item(withTitle: "Fixtures") {
fixtureMenuItem.title = "Here is where all the fixtures will be populated!"
// TODO - populate the UI with fixtures returned from JSON response
}
}
Fetch Fixtures - here's where the fixtures are retrieved.
func fetchFixtures() {
let session = URLSession.shared
let url = URL(string: "\(baseUrl)fixtures/matches.json?key=\
(apiKey)&secret=\(apiSecret)&date=2018-06-02")
let task = session.dataTask(with: url!) { data, response, err in
// check for a hard error
if let error = err {
NSLog("Live Scores Api Error: \(error)")
}
// check the response code
if let httpResponse = response as? HTTPURLResponse {
switch httpResponse.statusCode {
case 200: // perfecto!
if let liveScores = try? LiveScores.init(data: data!),
let fixture = liveScores.fixturesData
{
NSLog("\(fixture)")
}
case 401: // unauthorised
NSLog("Live Score Api returned an 'unauthorised' response.")
default:
NSLog("Live Scores Api returned response: %d %#", httpResponse.statusCode, HTTPURLResponse.localizedString(forStatusCode: httpResponse.statusCode))
}
}
}
task.resume()
}
In this example fixture data there are 26 fixtures and I want to show all of these.

Answer 1

Variations of this question come up constantly on SO.
Async functions don't wait for their results to be available. You give them a callback, which is a closure (a block of code you provide) that gets executed once the operation is complete.
You should rewrite your fetchFixtures() function to take a completion handler, and then refactor your updateScores() function to pass the code that updates your menu item into the completion handler for FetchFixtures.
See my answer to the question in the thread below for a simple example of this approach:
Swift: Wait for Firebase to load before return a function

Answer 2

As Duncan said in his answer, the issue was that the results weren't actually available.
I've implemented a completion handler of handleCompletion: on the fetchFixtures() function, which takes a true/false value plus the fixtures data. This is then returned in each http response case as shown below:
func fetchFixtures(handleCompletion:#escaping (_ isOK:Bool,_ param:
FixturesData?)->()) {
let session = URLSession.shared
let url = URL(string: "\(baseUrl)fixtures/matches.json?key=\
(apiKey)&secret=\(apiSecret)&date=2018-06-04")
let task = session.dataTask(with: url!) { data, response, err in
// check for a hard error
if let error = err {
NSLog("Live Scores Api Error: \(error)")
}
// check the response code
if let httpResponse = response as? HTTPURLResponse {
switch httpResponse.statusCode {
case 200: // perfecto!
if let liveScores = try? LiveScores.init(data: data!),
let fixture = liveScores.fixturesData
{
//NSLog("\(fixture)")
handleCompletion(true, fixture)
}
case 401: // unauthorised
NSLog("Live Score Api returned an 'unauthorised' response.")
handleCompletion(false, nil)
default:
NSLog("Live Scores Api returned response: %d %#", httpResponse.statusCode, HTTPURLResponse.localizedString(forStatusCode: httpResponse.statusCode))
handleCompletion(false, nil)
}
}
}
task.resume()
}
After implementing the above, I refactored the updateScores() to use this completion handler.
func updateScores() {
liveScoreApi.fetchFixtures() { (
isOK, fixture) in
if isOK == true {
if let fixtureMenuItem = self.Menu.item(withTitle: "Fixtures") {
fixtureMenuItem.title = (fixture?.fixtures.description)!
}
}
else {
NSLog("error fetching!")
}
}
}
The fixtureMenuItem now successfully displays the data if available.