SwiftUI で単純な非同期 GET REST API 呼び出しを行う方法

初心者向けのこのチュートリアルでは、SwiftUI を使用して、人気のある Internet Chuck Norris DataBase (ICNDB) を例として使用して API 呼び出しを行う基本を学びます。 Swift と SwiftUI を使用して、ジョークをすばやく簡単に表示します。

クロスプラットフォーム フレームワークの SwiftUI を使用すると、iOS、iPadOS、macOS、watchOS、App Clip、tvOS でまったく同じコードを使用できるようになります。これは、他の方法では不可能でした。

それに加えて、Swift 5.5 で導入された async-await を使用します。これは、iOS> v15.0 を実行している iPhone を含む新しいオペレーティング システムで機能します。これにより、UI スレッドをフリーズすることなく、ボタンのクリック時に非同期でデータ ネットワーク呼び出しを行う作業が大幅に簡素化されます。

最初に行う必要があるコードの変更を共有します。次のセクションでは、コードの簡単な分析を共有して、初心者でも何が起こっているのかを理解できるようにします。

Swift および SwiftUI で API 呼び出しを行う方法

まず、Xcode をインストールするための Mac が必要です。インストールしたら、Xcode を開いて新しいプロジェクトを作成します。次に、iOS、macOS、tvOS、または watchOS の「アプリ」を選択します。

コンテンツ ビュー

既存の ContentView SwiftUI ファイルを更新してボタンを追加し、State を使用するだけです ジョークが ICNDB API から返されたときに表示されるテキストを更新する変数:

import Foundation
import SwiftUI
struct ContentView: View {
    @State private var joke: String = ""
    var body: some View {
        Text(joke)
        Button {
            Task {
                let (data, _) = try await URLSession.shared.data(from: URL(string:"https://api.chucknorris.io/jokes/random")!)
                let decodedResponse = try? JSONDecoder().decode(Joke.self, from: data)
                joke = decodedResponse?.value ?? ""
            }
        } label: {
            Text("Fetch Joke")
        }
    }
}
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
struct Joke: Codable {
    let value: String
}

冗談を言いましょう!

build/play を押すと、上で選択したプラットフォームでアプリがビルドされます:

コード分析

ランダムなジョークの URL にアクセスすると、データが JSON 形式であることがわかります。それをコピーし、JSON Linter を使用してその構造を表示し、 Joke オブジェクトのどのプロパティが必要かを判断できます。

それに基づいて、上記のコードを決定します。 Codable プロトコル (別名インターフェイス) を使用して、JSON データ オブジェクトから実際の Swift クラスまたは構造体に移動し、保存するデータ (この場合は値) のプロパティを作成します。

JSONDecoder は、Codable オブジェクトを使用して JSON 文字列を解析するのに役立ちます。アプリの起動時に読み込まれるページの名前は ContentView と同じであるため、これはプラットフォームに関係なく機能します。 プラットフォームに関係なく。

アプリ クリップ

App Clip は、App Store からアプリケーション全体をダウンロードすることなく、「App Clip コード」を使用してネイティブ アプリ機能を使用する Apple の最新の方法です。

App Clip は iOS アプリと同様に機能します。唯一の違いは、新しい App Clip プロジェクトを作成しないことです。既存の iOS アプリが Xcode で開いているときに、[ファイル] -> [新規] -> [ターゲット] -> [iOS] -> [アプリ クリップ] に移動して、既存の iOS アプリにターゲットとしてアプリ クリップを追加するだけです。

iPhone/iPad のウィジェットについて疑問に思っているなら、それらはアニメーションしません。したがって、ボタンをクリックすると、対応するアプリが開くだけで、外部 API を介して独立してテキストを更新することはできません。

結論

この記事では、SwiftUI から最も簡単な方法で RESTful GET API 呼び出しを行う方法を学びました。

ご不明な点がございましたら、お気軽にお問い合わせください。別の記事を使用してこれを理解し、さらに単純化することを考えました。このコードをより複雑にする詳細と方法については、次の記事をご覧ください:

async/await in SwiftUISwiftUI アプリを変換して、新しい Swift 同時実行性を使用し、光沢のある表面の下で何が起こっているかを調べます。 Audrey Tamraywenderlich.com