Qiita 기사 보기 및 LGTM 수를 표시하는 iOS 앱 만들기

이 기사의 내용에 대해

오픈 소스 소스 코드/오픈 소스 : htps : // 기주 b. 코 m / msz 토끼 c / 쿠타타 - 혼 트 리부치 온 - 코 r

이 기사에서는 몇 가지 팁과 내가 앱에서 사용한 기술에 대해 설명합니다. 어느 쪽인가 하면 케이스 스터디와 같은 것입니다.

로컬 장치에 사용자 토큰 저장

기존 웹 쿠키를 사용하여 모바일 응용 프로그램에 사용자를 로그인합니다.

URLSession 를 사용하여 GET requests 만들기

Swift에서 JSON 응답 분석

원격 서버에서 이미지로드

물론, 여기서는 이미 존재하는 것을 재발명하지 않았으며 기존의 오픈 소스 프레임 워크를 사용했습니다. 기사의 다음 부분에서 그것을 소개합니다.

개요

Github과 마찬가지로 Qiita 기여를보고 싶었습니다.



그래서 다음을 할 수 있는 오픈 소스 iOS 앱을 만들었습니다.

1. 각 기사의 총 읽기 횟수와 읽기 횟수 제공

2. 각 기사의 총 LGTMs 및 views 제공

3. Github와 비슷한 기여 블록을 표시하여 이달에 기사를 게시한 날을 표시합니다.

코드 구조

View Controller

여기서 사용자는 Qiita APIページに進む를 클릭하여 새 API 토큰을 만들 수 있습니다. Safari 쿠키를 자동으로 사용합니다.

ASWebAuthenticationSession

사용자의 기존 브라우저 세션 쿠키를 여기에서 사용할 수 있도록 ASWebAuthenticationSession 를 사용합니다. 그러면 사용자는 다시 로그인하지 않아도 됩니다.

guard let authURL = URL(string: "https://qiita.com/settings/tokens/new") else { return }
let session = ASWebAuthenticationSession(url: authURL, callbackURLScheme: "")
{ callbackURL, error in
    // Handle the callback.
}
session.presentationContextProvider = self
session.start()

또한 presentationContextProvider를 설정하여 ASWebAuthenticationSession가 뷰를 표시하는 위치를 인식 할 수 있어야합니다.

/*
 ASWebAuthenticationSession がどこにビューを表示すべきか判断するためです
 */
extension ViewController: ASWebAuthenticationPresentationContextProviding {
    func presentationAnchor(for session: ASWebAuthenticationSession) -> ASPresentationAnchor {
        return view.window!
    }
}

사용자의 토큰을 키체인에 저장하여 다음에 사용자가 토큰 값을 다시 입력하지 않아도 됩니다.

일반적으로 앱은 기밀 정보(예: 토큰)를 키체인에 저장합니다. 키 체인 사용에 대한 Apple의 공식 문서는 다음과 같습니다. htps : //로 ゔぇぺぺr. 아 ぇ. 코 m / Dokumen ON / Sekuri ty / Ke y Chan _ Se r ゔ ぃ 세 s

키체인 서비스를 사용하려면 약간의 코드가 필요하기 때문에 Github에서 오픈 소스 키체인 도우미를 사용했습니다.

let keychain = KeychainSwift()
keychain.set(tokenTextField.text ?? "", forKey: "qiitaToken")
tokenTextField.text = keychain.get("qiitaToken") ?? ""

userTableView

원격 이미지 페치

여기서는 Kingfisher라는 오픈 소스 프레임 워크를 사용했습니다.

@IBOutlet weak var profileImageView: UIImageView!
//画像をダウンロードして読み込みます
if let imagePath = profileImagePath,
    let convertedURL = URL(string: imagePath) {
    DispatchQueue.main.async {
        self.profileImageView.kf.setImage(with: convertedURL)
    }
}

self.profileImageView.kf.setImage(with: convertedURL)

requestHelper.swift

여기서는 URLSession를 사용하여 요청합니다.

let sessionConfig = URLSessionConfiguration.default
let session = URLSession(configuration: sessionConfig, delegate: nil, delegateQueue: nil)

guard let URL = URL(string: "https://qiita.com/api/v2/authenticated_user/items") else {
    delegate?.onTaskFailed(reason: "URL convertion failed!")
    return
}

var request = URLRequest(url: URL)
request.httpMethod = "GET"

// Headers

request.addValue("Bearer \(userID ?? "")", forHTTPHeaderField: "Authorization")

/* Start a new Task */
let task = session.dataTask(with: request, completionHandler: { (data: Data?, response: URLResponse?, error: Error?) -> Void in
    if let httpResponse = response as? HTTPURLResponse {
        let statusCode = httpResponse.statusCode
        if error == nil && statusCode >= 200 && statusCode < 400 {
            //成功
            let allItems = try! JSON(data: data!).array
            for item in allItems ?? [] {
                if let id = (item.dictionary?["id"])?.stringValue {
                    self.fetchIndividualArticle(id: id)
                }
            }
            return
        }
    }
    // 失敗
    self.delegate?.onTaskFailed(reason: error?.localizedDescription ?? "Unknown error. Please check your token and try again.")
})

task.resume()
session.finishTasksAndInvalidate()

수신 결과 분석:

if let fetchedData = data {
    if let parsedData = try? JSON(data: fetchedData).dictionary {
        //ユーザー名
        let name = parsedData["name"]?.stringValue
        //説明 description
        let description = parsedData["description"]?.stringValue
        //プロフィール画像のURLパス
        let profileImage = parsedData["profile_image_url"]?.stringValue
        //
        completionHandler(profileImage, name, description, nil)
    }
}

여기서는 SwiftyJSON라는 오픈 소스 프레임 워크를 사용했습니다.

Github과 마찬가지로 Qiita 기여를 표시하고 싶었습니다.

여기서는 LSHContributionView라는 오픈 소스 프레임 워크를 사용했습니다.



트위터 @MszPro

내 게시된 Qiita 기사 목록을 카테고리별로 확인할 수 있습니다.