SwiftでAPIを一緒に叩いてみよう！(前編)

Last updated at 2024-04-06Posted at 2024-04-06

この記事を読んで貰えば、apiをとってくるおおまかな流れが掴めると思います

APIを叩く練習として地球の日付を入れると、その時刻の火星探査車の画像を出力するアプリを一緒に作っていきましょう！そのためにNASAのMars rover photosのapiを叩きます

宇宙は浪漫！

とってくるAPIの紹介

NASA Open APIsのMars rover Photosを使います
NASA Open APIs

Mars rover とは、火星探査車らしいですね。今回はこの画像を取得できるapiを使います

ウィキペディア↓
https://ja.wikipedia.org/wiki/マーズ・ローバー

これから作るもの

モデル

//MarsModels.swift
import Foundation
import Alamofire

struct Welcome: Codable {
    let photos: [Photo]
}

// MARK: - Photo
struct Photo: Codable {
    let id, sol: Int
    let camera: PhotoCamera
    let imgSrc: String
    let earthDate: String
    let rover: Rover

    enum CodingKeys: String, CodingKey {
        case id, sol, camera
        case imgSrc = "img_src"
        case earthDate = "earth_date"
        case rover
    }
}

// MARK: - PhotoCamera
struct PhotoCamera: Codable {
    let id: Int
    let name: String
    let roverID: Int
    let fullName: String

    enum CodingKeys: String, CodingKey {
        case id, name
        case roverID = "rover_id"
        case fullName = "full_name"
    }
}

// MARK: - Rover
struct Rover: Codable {
    let id: Int
    let name, landingDate, launchDate, status: String
    let maxSol: Int
    let maxDate: String
    let totalPhotos: Int
    let cameras: [CameraElement]

    enum CodingKeys: String, CodingKey {
        case id, name
        case landingDate = "landing_date"
        case launchDate = "launch_date"
        case status
        case maxSol = "max_sol"
        case maxDate = "max_date"
        case totalPhotos = "total_photos"
        case cameras
    }
}

// MARK: - CameraElement
struct CameraElement: Codable {
    let name, fullName: String

    enum CodingKeys: String, CodingKey {
        case name
        case fullName = "full_name"
    }
}

Web APIの仕組みを学ぼう

まず、アプリ側からWebサーバーにリクエストを投げます。つまり、アプリ側から https://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos にアクセスします。

アプリ側からリクエストすると、WebサーバーがJSONを返してくれます。これがレスポンス

APIキーを取得しよう

https://api.nasa.gov/
NASAのapiサイトから自分の情報を入力して、APIキーを取得しましょう。Signupの後にメールでAPIキーが送られてきます

メールはこんな感じ

NASAのapiサイトの下の方にある”Mars Rover Photos”を選択。真ん中あたりにあるQuerying by Earth dateのapiをとってきます。地球の日付を指定すると、火星探査車がその日に撮影した写真を取得できるapiです

Web APIの仕組みを学ぼうここでの画像を思い出してください。

アプリからURLを送り(アプリからWebサーバーにリクエストを投げる)、WebサーバーがJSONを返す(Webサーバーからアプリにレスポンスを返す)

今、NASAのサイトからリクエストを投げるためのURLが得られたので、次はサーバーから帰ってくるJSONについて調べましょう!
Example queryのhttps://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos?earth_date=2015-6-3&api_key=DEMO_KEY は後で使います

Talend APIからJSONを取得しよう

Talend APIとはChromeの拡張機能であり、apiのレスポンスを確認することができます。なんとTalendAPIを使うことでWebサーバーから返ってくるJSONを調べることができます

APIキーを取得しようのメールで送られてきたAPIキーとExample queryのURLを使います！
DEMO_KEYの部分をメールで送られてきた自分のAPIキーに変えてSendをクリック
すると、Responseの部分にJSONが返ってきました。それでCopyしてください。
次のquicktypeを使ってJSONから構造体に変換していきます！

https://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos?earth_date=2015-6-3&api_key=DEMO_KEY