読んでほしい人

SwiftUIを勉強している人
郵便番号検索APIを使ってみたい人

補足情報

こちらのサイトのAPIを使って今回はアプリを作っていこうと思います。
https://zipcloud.ibsnet.co.jp/doc/api

記事の内容

SwiftUIでAPIを使ったアプリの学習をしていて、アウトプットのために色々作ってみたいなと思い入門レベルの郵便番号検索ができるアプリを作ってみました。

今回はこんな構造のJSONに合わせて、structを定義します。

{
	"message": null,
	"results": [
		{
			"address1": "東京都",
			"address2": "三鷹市",
			"address3": "",
			"kana1": "ﾄｳｷｮｳﾄ",
			"kana2": "ﾐﾀｶｼ",
			"kana3": "",
			"prefcode": "13",
			"zipcode": "1810000"
		}
	],
	"status": 200
}

モデルを作成する。構造体をネストして、JSONがresults: [{}]ネストしている構造に合わせて、２個作成する。

struct ZipCode: Codable {
    var message: String?
    var results: [Result]
    var status: Int
}

struct Result: Codable {
    var address1: String
    var address2: String
    var address3: String
    var kana1: String
    var kana2: String
    var kana3: String
    var prefcode: String
    var zipcode: String
}

View側に今回は、ロジックも書いてます。練習用のアプリということで、メソッドをクラスに書いて分けるのまではやってないです。検索Formがあって、郵便番号-なしの7桁ではなかったら、エラーメッセージを表示する正規表現を使っております。入力してボタンを押すと、検索をするメソッドが実行されます。

struct ContentView: View {
    @State private var zipCode = ""
    @State private var results = [Result]()
    @State private var errorMessage = ""
    
    var body: some View {
        VStack {
            TextField("郵便番号を入力してください", text: $zipCode)
                .textFieldStyle(RoundedBorderTextFieldStyle())
                .padding()
            
            Button(action: {
                if validate(zipCode: zipCode) {
                    fetchResults()
                }
            }) {
                Text("Search")
            }
            
            if !errorMessage.isEmpty {
                Text(errorMessage)
                    .foregroundColor(.red)
            }
            
            List(results, id: \.zipcode) { result in
                VStack(alignment: .leading) {
                    Text("郵便番号: \(result.zipcode + result.prefcode)")
                    Text("都道府県コード: \(result.prefcode)")
                    Text("住所カナ: \(result.kana1 + result.kana2 + result.kana3)")
                    Text("住所: \(result.address1 + result.address2 + result.address3)")
                }
            }
        }
    }
    
    func validate(zipCode: String) -> Bool {
        let zipCodePattern = "^[0-9]{3}-?[0-9]{4}$"
        let zipCodePredicate = NSPredicate(format: "SELF MATCHES %@", zipCodePattern)
        let isValid = zipCodePredicate.evaluate(with: zipCode)
        if !isValid {
            errorMessage = "郵便番号は-なしで7桁で入力してください!"
        } else {
            errorMessage = ""
        }
        return isValid
    }
    
    func fetchResults() {
        guard let url = URL(string: "https://zipcloud.ibsnet.co.jp/api/search?zipcode=\(zipCode)") else {
            return
        }
        URLSession.shared.dataTask(with: url) { data, response, error in
            if let data = data {
                do {
                    let decodedData = try JSONDecoder().decode(ZipCode.self, from: data)
                    DispatchQueue.main.async {
                        self.results = decodedData.results
                    }
                } catch {
                    print("Failed to decode JSON: \(error.localizedDescription)")
                }
            }
        }.resume()
    }
}

こちらが全体のコード

import SwiftUI

struct ZipCode: Codable {
    var message: String?
    var results: [Result]
    var status: Int
}

struct Result: Codable {
    var address1: String
    var address2: String
    var address3: String
    var kana1: String
    var kana2: String
    var kana3: String
    var prefcode: String
    var zipcode: String
}

struct ContentView: View {
    @State private var zipCode = ""
    @State private var results = [Result]()
    @State private var errorMessage = ""
    
    var body: some View {
        VStack {
            TextField("郵便番号を入力してください", text: $zipCode)
                .textFieldStyle(RoundedBorderTextFieldStyle())
                .padding()
            
            Button(action: {
                if validate(zipCode: zipCode) {
                    fetchResults()
                }
            }) {
                Text("Search")
            }
            
            if !errorMessage.isEmpty {
                Text(errorMessage)
                    .foregroundColor(.red)
            }
            
            List(results, id: \.zipcode) { result in
                VStack(alignment: .leading) {
                    Text("郵便番号: \(result.zipcode + result.prefcode)")
                    Text("都道府県コード: \(result.prefcode)")
                    Text("住所カナ: \(result.kana1 + result.kana2 + result.kana3)")
                    Text("住所: \(result.address1 + result.address2 + result.address3)")
                }
            }
        }
    }
    
    func validate(zipCode: String) -> Bool {
        let zipCodePattern = "^[0-9]{3}-?[0-9]{4}$"
        let zipCodePredicate = NSPredicate(format: "SELF MATCHES %@", zipCodePattern)
        let isValid = zipCodePredicate.evaluate(with: zipCode)
        if !isValid {
            errorMessage = "郵便番号は-なしで7桁で入力してください!"
        } else {
            errorMessage = ""
        }
        return isValid
    }
    
    func fetchResults() {
        guard let url = URL(string: "https://zipcloud.ibsnet.co.jp/api/search?zipcode=\(zipCode)") else {
            return
        }
        URLSession.shared.dataTask(with: url) { data, response, error in
            if let data = data {
                do {
                    let decodedData = try JSONDecoder().decode(ZipCode.self, from: data)
                    DispatchQueue.main.async {
                        self.results = decodedData.results
                    }
                } catch {
                    print("Failed to decode JSON: \(error.localizedDescription)")
                }
            }
        }.resume()
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

最後に

今回は、郵便番号検索アプリを作ってAPIの使い方について学習してみました。ご興味あるかたは参考にして使ってみてください。