[사카마카] 앱 내에서 웹을 보여주는 방법에 대해 알아보자.

 

앱에서 선택사항으로 상품의 링크를 등록하는 경우가 있다. 링크가 있을 경우 링크 이벤트를 처리해야하는데, 어떻게 처리해야하는지 알아보자.

 

Safari

기기에서 사파리 앱을 실행시켜 웹을 보여주는 방법이다.

guard let url = URL(string: "https://yeoseongil.tistory.com/") else { return }

UIApplication.shared.open(url, options: [:])

✅ 직접 사파리 앱을 실행시켜 웹을 보여주기 때문에, 현재 앱과 상호작용이 불가능하다.

 

SFSafariViewController

SafariServices 프레임워크를 사용하여 현재 앱에서 웹을 보여주는 방법이다.

import SafariServices

guard let url = URL(string: "https://yeoseongil.tistory.com/") else { return }

let safariViewController: SFSafariViewController = SFSafariViewController(url: url)
present(safariViewController, animated: true)

✅ 현재 앱에서 웹을 보여주기 때문에 상호작용이 가능하다. (앞 & 뒤로가기 버튼, 사파리 열기, 완료 버튼 등)

✅ 앱과 사파리 간의 데이터 공유는 불가능하다.

✅ 브라우저 주소(주소 텍스트 필드)는 수동으로 편집할 수 없다.

 

WKWebView

앱 내부에서 WebView를 직접 설정해줘야 웹이 열리는 방법이다.

import WebKit

guard let url = URL(string: "https://yeoseongil.tistory.com/") else { return }

let request = URLRequest(url: url)
webView.load(request)

let webViewController = WebViewController()
webViewController.url = URL(string: url)
present(webViewController, animated: true)

✅Web의 커스터 마이징이 필요하거나 컨텐츠와 상호 작용해야 할 경우 사용한다. 

 

적용하기

사카마카에서는 간단히 상품의 정보를 담고 있는 웹만 보여주면 되기 때문에 SFSafariViewController를 사용했다.

 

1. 이벤트를 처리할 버튼 만들기

각 셀마다 링크 버튼을 추가했다.

사용자가 링크를 입력하지 않았을 땐, isHidden을 활성화 해서 링크 버튼을 보이지 않게 했다.

 

Cell에서의 버튼 이벤트이기 때문에 클로저로 ViewController에서 이벤트를 처리하게 했다.

 

링크 버튼

 

2. 이벤트 처리하기

버튼 이벤트를 구현하고, 

 

클로저에 버튼 이벤트를 담아주면 끝이다.