[iOS] WKWebView 쿠키 데이터 가져오기 (자동로그인)

네이티브와 웹뷰를 연동하여 개발 중 크롬과 사파리와 같은 브라우저에서는 별다른 설정 없이도 자동로그인이 가능했지만 네이티브로 연결된 WKWebView에서는 자동로그인 기능을 사용할 수 없었다.

이유는 WKWebView에서는 쿠키 값을 따로 설정해주어야만 자동로그인이 가능했기 때문이였고, 안드로이드와 동일한 사용자 경험을 제공하기 위해서 자동로그인을 위해 쿠키 값을 직접 설정해주었다.

또한 쿠키 value가 기존 값을 유지하지 않고 새로 만들어주는 상황이였기 때문에 자동로그인이 정상적으로 작동하지 않는 것 같았다.

 

사파리 개발자 도구를 사용해 휴대폰 모바일 웹 페이지를 개발자 도구로 디버깅하였다. (크롬도 동일하게 사용 가능하지만 그냥 사파리 써본적이 없어서 사용해보았다! 써보니까 사파리가 좀 더 편한것 같기도..? ㅎ.ㅎ)

 

Application 카테고리에서 쿠키를 확인한 후 개발자 도구 콘솔에 다음과 같이 입력한다.

document.cookie

 

만약 아무것도 나오지 않는다. 그 이유는 쿠키에 HttpOnly 옵션을 주었기 때문이다.

HttpOnly는 간단히 말해 스크립트를 통해 쿠키를 탈취하는 방법을 막고자 브라우저에서 쿠키에 직접 접근할 수 없도록 보안을 위해 기본적으로 적용해주는 옵션이다.

이 옵션때문에 직접 쿠키에 엑세스 할 수 없으므로 WKWebView에서 쿠키에 접근하려면 웹 서버와의 통신을 통해 쿠키 값을 앱으로 전달하거나, 웹뷰의 쿠키 저장소를 확인하여 관련된 쿠키를 추출해야 한다.

 

나는 두번째 방법을 사용하였다. 

 

먼저 쿠키의 값을 설정하는 코드를 작성한다.

func setCookie() {
    let cookie: [HTTPCookiePropertyKey: Any] = [
        .domain: // host (String),
        .path: // path (String),
        .name: "JSESSIONID",
        .value: // cookie name에 해당하는 value (String)
    ]

    if let cookie = HTTPCookie(properties: cookie) {
        webView.configuration.websiteDataStore.httpCookieStore.setCookie(cookie)
    }
}

 

다음으로 웹에 저장된 쿠키를 앱에 저장하는 코드를 작성한다.

 

func saveCookie() {
    let cookieStore = webView.configuration.websiteDataStore.httpCookieStore

    cookieStore.getAllCookies { cookies in
        for cookie in cookies {
            if cookie.name == "JSESSIONID" {
                // UserDefault를 통해 앱 내에 쿠키 값 저장
            }
            print("cookie name: \(cookie.name), cookie value: \(cookie.value)")
        }
    }
}

웹에 저장된 모든 쿠키들을 탐색하며 내가 원하는 쿠키 이름을 가진 쿠키의 값을 저장해둔다.

 

 

func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void) {
    saveCookie()
}

 나는 위와 같은 위치에서 각 함수를 실행시켜주었다.

 

만약 이 방법이 불가능하다면 다음과 같은 방법을 생각해 볼 수 있다.

1. 클라이언트에서 session id를 고정해서 올려준다. (기기 아이디와 같은 고유값으로 설정)

2. 일반적으로 사용하는 방법이 무엇인지 파악해 클라이언트와 서버 간 의견을 조율한다.

 

...  :)