Loading Images from URLRequest using Alamofire responseImage IOS swift

Question

Good day.

I am currently using Alamofire version 4.5 and xcode version 9.3. I am trying to load images from URLrequest with custom headers to a collection view with image from a fileserver using this code

var imageRequest = URLRequest(url: URL(string: "myurl here ")!)
imageRequest.addValue(MyVariables.accountToken, forHTTPHeaderField: "accountToken")

imageRequest.addValue("header value 1", forHTTPHeaderField: "header field 1")

imageRequest.addValue("header value 2", forHTTPHeaderField: "header field 2")

imageRequest.addValue(imageurl from fileserver, forHTTPHeaderField: "file")

After adding headers to the urlrequest I use this alamofire responseimage to set value to the image

            Alamofire.request(imageURLRequest).responseImage { response in
            if let image = response.result.value {
                self.count += 1
                print("image  \(self.count )", image)
            } else {
                print("unable to load   \(self.count)")
            }
        }

The problem I am encountering is that not all images are loading at once eventhough I have already looped in the alamofire request with the number of urlrequests I have. Another thing, when I scroll the collectionview the photos I have loaded from the alamofire call jumbles in order not following the indexpath.row. Moreover, I have also tried to append the image response from my alamofire response image and set it to cell.imageView.image = self.imageArray[indexPath.row]

but it goes out of bounds. When I log the the alamofire imageresponse it only loads until index 7. I have tried different approach like appending the urlrequest to array and loading it to collection view cell via

cell.imageView.af_setImage(withURLRequest: imageURLRquest)

but it only loads the first item in the image array. Sorry for the long question as I have tried most of the solutions I have found so far but it doesnt fix the problem I have right now. Please provide suggestions to fix this. Thank you in advance.

UPDATE:

Here is the code for the datasource from alamofire request. It returns 10 urlrequest that is being appended to the array

var imageRequest = URLRequest(url: URL(string: "myurl here ")!)
imageRequest.addValue(MyVariables.accountToken, forHTTPHeaderField: "accountToken")

imageRequest.addValue("header value 1", forHTTPHeaderField: "header field 1")

imageRequest.addValue("header value 2", forHTTPHeaderField: "header field 2")

imageRequest.addValue(imageurl from fileserver, forHTTPHeaderField: "file")

self.imageArray.append(imageRequest)

This is for the cellForItemAt

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "BooksCell", for: indexPath) as! LibraryCollectionViewCell

        cell.imageView.af_setImage(withURLRequest: self.imageArray[indexPath.row])
        cell.bookName.text = self.booksObject[indexPath.row].object(forKey: "title") as! String
        cell.cosmosRatingView.rating = self.booksObject[indexPath.row].object(forKey: "rating") as! Double

        return cell
    }

Answer 1

Good day. I have already found the solution for this. You would need to reset the value of the imageView to nil at cellForItemAt then assign it to the indexPath.row

 if let image = self.bookImages[indexPath.row]  {
        cell.imageView.image = image
    } else {
        Alamofire.request(imageURLRequest).responseImage { response in
            if let image = response.result.value {
                cell.imageView.image = image
                self.bookImages[indexPath.row]  = image
            } else {
                cell.imageView.image = placeholderImage
            }
        }
    }

Thank you for all your help. Hope this also helps someone who encountered the same problem.