![[iOS][SwiftUI] AsyncImage のリトライ処理](https://devio2024-media.developers.io/image/upload/f_auto,q_auto,w_3840/v1765879868/user-gen-eyecatch/frml0j0rvwqxnbls7crd.png)
[iOS][SwiftUI] AsyncImage のリトライ処理
題字・次男
2025.12.16
はじめに
スターバックスデジタルテクノロジー部のけいすけです。
SwiftUI の AsyncImage における画像取得失敗時のリトライ方法を解説します。
AsyncImage とは
AsyncImage は非同期で画像を取得して表示する SwiftUI の View です。
iOS SDK に組み込まれている API のため、特定の URL から画像を取得して画面に表示することが簡単に実現できます。
サンプルコード
AsyncImage(url: URL(string: "https://example.com/icon.png"))
問題点
この AsyncImage には画像取得に失敗した際のリトライ処理の機構が用意されていません。
画像の再取得を試みたい場合は自前でコードを書く必要があります。
リトライ対応
リトライ処理を施したコードは以下。
import SwiftUI
struct ContentView: View {
@State private var idForRetry = UUID()
var body: some View {
AsyncImage(url: URL(string: "https://example.com/icon.png")) { phase in
switch phase {
case .success(let image):
image
case .failure:
// エラーが発生した場合は次回の View 表示時にリトライできるよう id を変更する
Spacer()
.task { idForRetry = UUID() }
default:
EmptyView()
}
}
.id(idForRetry) // <- id を指定
}
}
解説
ここで重要なのは以下 2 点です。
- AsyncImage に
idを指定していること - 取得エラーが発生した場合に
idを変更していること
これによって View の状態がリセットされ、改めて画像の取得が実行されるようになります。
おわりに
AsyncImage のリトライ処理は id を利用することで対応可能です。
id の変更による View の状態リセットは AsyncImage 以外でも使える場面があるかもしれませんね。
リンク
採用情報
スターバックスデジタルテクノロジー部では iOS アプリエンジニアを募集しています。
一緒にスタバのアプリを作りませんか？
