[iOS/Swift] RxSwift - Observable / Observer

Observable 과 Observer

• Observer : observable을 subscribe하여 감시하고, 전달받게 되는 이벤트를 처리한다
• Observable : 이벤트를 전달해주는 역할.

Observable이 방출하는 이벤트

• Next : 데이터를 전달할 때 사용
• Error : 에러가 발생하면 Error 이벤트가 전달된다
• Completed: Observable이 정상적으로 종료되면 Completed 이벤트가 전달된다

---

예제 따라하기

곰튀김님의 영상을 보며 따라한 예제인데,
LOAD 버튼을 클릭할 시에 Rx로 처리하는 과정을 작성해보려고 한다

버튼을 누르면 onLoad함수가 실행된다.

onLoad 함수

@IBAction func onLoad() {
        editView.text = ""
        
        downloadJson(MEMBER_LIST_URL)
            .subscribe { event in
                switch event {
                case let .next(json):
                    self.editView.text = json
                    self.setVisibleWithAnimation(self.activityIndicator, false)
                case .completed:
                    break
                case .error:
                    break
                }
            }
    }

여기서 downloadJson은 observer의 역할을 한다.
그래서 subscribe 했던 observable에서 이벤트를 전달하자 이벤트를 처리해줄 코드를 같이 작성해주었다

downloadJson 함수

func downloadJson(_ url: String) -> Observable<String?> {
        return Observable.create() { emitter in
            emitter.onNext("Hello") // 데이터 전달
            emitter.onNext("Rx 공부중입니다")
            emitter.onCompleted() // 데이터 전달이 완료 되었다는 의미
            
            return Disposables.create() // observable을 종료하면서 아무런 처리가 필요없을 때 
        }
    }

이해를 돕기위해 onNext에는 실제 json이 아닌
내가 넣고 싶은 값을 넣었고

observable이 발생시킨 next이벤트는 observer에서 case .next에서 처리해줄 것이다 !

---

이제 실제 json을 받아와보자면

downloadJson 함수

url session을 사용하였고,
error가 나면 onError 이벤트를 전달해주었고
값을 정상적으로 받아온 경우는 onNext 이벤트로 데이터를 전달해주었다

Observable의 끝은 onCompleted가 실행되거나 onError가 실행된 경우이므로
에러가 나지 않은 경우에도 onNext로 데이터를 전달하고 나서
onCompleted 이벤트를 실행시켰다

중간중간 주석은 urlSession에 관련된 내용이므로 넘어가도 상관없다 😇

func downloadJson(_ url: String) -> Observable<String?> {
        return Observable.create() { emitter in
            let url = URL(string: url)!
            let task = URLSession.shared.dataTask(with: url) { (data, _, err) in
                guard err == nil else {
                    emitter.onError(err!)
                    return
                }
                
                if let dat = data,
                   let json = String(data: dat, encoding: .utf8) {
                    emitter.onNext(json)
                }
                
                emitter.onCompleted() // observable의 끝은 complete이 불렸을 때
            }
            // 근데 url session은 다른 스레드에서 실행이 되니까 .onError / onNext/ onCompleted 모두 다른 스레드에서 실행됨
            // 최종적으로는 cancel 했을 때 실행함
            // url session 이 실행되는 스레드와 ui를 바꾸는 메인 스레드는 다르다
            
            task.resume()
            return Disposables.create() {
                task.cancel() //취소했을 때 사용될 행동
            }
        }
    }

onLoad 함수

downloadJson(MEMBER_LIST_URL)
            .subscribe { event in
                switch event {
                case let .next(json):
                    DispatchQueue.main.async {
                        self.editView.text = json
                        self.setVisibleWithAnimation(self.activityIndicator, false)
                    }
                case .completed:
                    break
                case .error:
                    break
                }
            }

아까와 달라진 부분은 .next case의 경우인데
urlSession이 실행되는 쓰레드와 ui가 변경되는 메인 쓰레드와 다르기 때문에,
ui가 변경되는 부분은 main 쓰레드에서 실행시켜 주었다

---

Observable의 생명주기

1. create 했을 때 만들어진다
2. subscribe 했을 때 실행이 되고
3. onNext 로 데이터 전달을 한다 
---- 끝 ----
4. onCompleted , onError인 경우 생명주기가 끝남 
5. Disposed

---

Reference

전적으로 따라한 곰튀김님의 Rx강의.. 가려운 곳을 시원하게 긁어주셨다
https://yeonduing.tistory.com/60