【Swift】Cell上のUIImageViewにAPIから取得した画像(URL)を表示させたこと

概要

Cell上のUIImageViewにAPIから取得した画像(URL)を表示するということが結構難しかったのでメモします。
※URLSessionを使用します。

作業の順序

1.APIから取得したURLを使ってサーバーから画像を取得

2.imageviewに取得した画像をセットする

実装

SongTableViewCell.swift

class SongTableViewCell: UITableViewCell {
    
    @IBOutlet weak var trackImage: UIImageView!
    
    override func awakeFromNib() {
        super.awakeFromNib()
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

    }

//"Result", "artworkUrl100"はAPI実装のファイルから取得している値
    func setup(set: Result) {
//2:imageviewに取得した画像をセットする
        trackImage.setImageByDefault(with: set.artworkUrl100)

    }
}

//1:APIから取得したURLを使ってサーバーから画像を取得
extension UIImageView {

    func setImageByDefault(with url: URL) {
        URLSession.shared.dataTask(with: url) { [weak self] data, response, error in
            if error == nil, case .some(let result) = data, let image = UIImage(data: result) {
               //ここでメインスレッド実行するように記述(無いとサブスレッドで実行されて落ちる)
                DispatchQueue.main.async {
                    self?.image = image
                }

            } else {
                // error handling

            }
        }.resume()
    }

}

ListTableViewController.swift

 override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        guard let cell = tableView.dequeueReusableCell(withIdentifier: "SongTableViewCell") as? SongTableViewCell else {
            return SongTableViewCell()
        }
        let info = resultsCount?.results?[indexPath.row] else {
             return SongTableViewCell()
        }
        cell.setup(set: info)
        return cell
    }

ひとまず画像は取得できるようになりました。

終わりに

以下の記事などを参考にして実装しました。

https://qiita.com/H_Crane/items/422811dfc18ae919f8a4
https://qiita.com/nbapps_dev/items/d22837b04d8bb0a3127d