iOS WebView(feat. Swift)

WebView란?

웹 컨텐츠를 앱에서 보여주기 위한 객체

 

언제 써야할까?

애플 문서를 보면 네이티브 뷰보다 웹으로 더 쉽게 만들 수 있으면 사용해라, 예를들면 앱의 컨텐츠가 빈번하게 바뀌는 경우에 사용하라고 합니다. 구체적으로 서비스로 예를 들자면 이벤트 UI 팝업 같은 경우 거의 일회성이나 화면이 자주 바뀌기 때문에 WebView로 만드는게 효율이 좋습니다. 웹뷰는 앱 배포 없이 바꿀 수 있으니까요. ㅎ_ㅎ

 

코드 

import UIKit
import WebKit
class ViewController: UIViewController, WKUIDelegate {
    
    var webView: WKWebView!
    
    override func loadView() {
        let webConfiguration = WKWebViewConfiguration()
        webView = WKWebView(frame: .zero, configuration: webConfiguration)
        webView.uiDelegate = self
        view = webView
    }
    override func viewDidLoad() {
        super.viewDidLoad()
        
        let myURL = URL(string:"https://www.apple.com")
        let myRequest = URLRequest(url: myURL!)
        webView.load(myRequest)
    }}

애플 문서의 기본 예제 입니다. 실행하게 되면 화면 전체에 web content가 뜨는 것을 볼 수 있습니다.

그러나 구현해야 하는것은 언제나 응용해서 조금씩 바꿔야하죠 +_+

 

저는 웹뷰 + 헤더에 Bearer Token 추가 (로그인 인증 토큰) 을 넣어줘야 해서 약간 바꿨습니다.

class ViewController: UIViewController {

	let webView = WKWebView()
    
    // header에 Bearer Token 추가
    private var headers: [String:String] {
    	var header: [String:String] = []
        header["Authorization"] = "Bearer \(userToken)"
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()

        configureUI()
        setup()

    }
    
    func setup() {
          if let url = URL(string: "https://developer.apple.com/documentation/webkit/wkwebview") {
            var request = URLRequest(url: url)
            
            // header 설정 
            headers.forEach { request.setValue($0.value, forHTTPHeaderField: $0.key) }
            webView.load(request)
        }
    }
    
    func configureUI() {
      self.view.addSubview(webView)
        
        // SnapKit 오토레이아웃 설정
      self.webView.snp.makeConstraints { view in
            view.top.leading.trailing.bottom.equalToSuperview()
      }
    }
}

 

---

참고자료

Apple 문서 - https://developer.apple.com/documentation/webkit/wkwebview