FireBase - Webkit

import UIKit
import WebKit

class WebViewerController: UIViewController {

    // MARK: - Variables
    private let urlString: String
    
    // MARK: - UI Components
    private let webView = WKWebView()
    
    
    // MARK: - Initializations
    init(with urlString: String) {
        self.urlString = urlString
        super.init(nibName: nil, bundle: nil)
    }
    
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    // MARK: - Life Cycle
    override func viewDidLoad() {
        super.viewDidLoad()
        configureConstraints()

        guard let url = URL(string: self.urlString) else {
            self.dismiss(animated: true, completion: nil)
            return
        }
        
        self.webView.load(URLRequest(url: url))
    }
    
    // MARK: - Constraints
    private func configureConstraints() {
        
        self.navigationItem.rightBarButtonItem = UIBarButtonItem(title: "Done", style: .done, target: self, action: #selector(didTapDone))
        self.navigationController?.navigationBar.backgroundColor = .secondarySystemBackground
        
        
        self.view.addSubview(webView)
        
        self.webView.translatesAutoresizingMaskIntoConstraints = false
        
        NSLayoutConstraint.activate([
            
            self.webView.topAnchor.constraint(equalTo: self.view.topAnchor),
            self.webView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor),
            self.webView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor),
            self.webView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor)
        ])
    }
    
    // MARK: - Selectors
    @objc private func didTapDone() {
        self.dismiss(animated: true, completion: nil)
    }
}

 

위 코드는 WebViewerController라는 이름의 UIViewController를 사용하여 웹 페이지를 표시하는 웹 뷰 컨트롤러를 구현한 코드입니다. 사용자는 특정 URL을 전달받아 WKWebView를 통해 해당 URL의 콘텐츠를 볼 수 있습니다.

 

 

주요 구성 요소 설명

1. 클래스 구조

• WebViewerController는 UIViewController를 상속받아 웹 콘텐츠를 표시하기 위한 기능을 제공합니다.
• WKWebView를 사용하여 웹 페이지를 로드하고 표시합니다.

 

2. 프로퍼티

1. urlString:
   • 타입: String
   • URL 문자열을 저장합니다.
   • 생성자에서 값을 초기화하며, 이후 웹 페이지 로드에 사용됩니다.
2. webView:
   • 타입: WKWebView
   • 웹 콘텐츠를 표시하는 WebKit 뷰입니다.
   • 이를 통해 URL 요청을 로드하고 결과를 화면에 표시합니다.

 

3. 초기화 메서드

1. init(with urlString: String):
   • URL 문자열을 매개변수로 받아 urlString 프로퍼티를 초기화합니다.
   • super.init(nibName: nil, bundle: nil)을 호출하여 기본 설정을 완료합니다.
2. required init?(coder: NSCoder):
   • 인터페이스 빌더를 통한 초기화는 지원하지 않으므로 fatalError를 사용해 방지합니다.

 

4. 생명주기 메서드

1. viewDidLoad():
   • 뷰가 메모리에 로드되었을 때 호출됩니다.
   • 이 메서드에서 다음 작업을 수행합니다:
     1. configureConstraints() 호출:
        • 레이아웃 및 UI 설정을 수행합니다.
     2. URL 유효성 검사 및 로드:
        • urlString을 URL 객체로 변환하고, 변환 실패 시 컨트롤러를 닫습니다.
        • 유효한 URL은 webView.load(URLRequest(url: url))을 통해 로드합니다.

 

5. UI 설정 및 제약 조건

configureConstraints():

• UI 구성과 Auto Layout 제약 조건을 설정하는 메서드입니다.

1. Done 버튼 추가:
   • 네비게이션 바의 우측에 "Done" 버튼을 추가합니다.
   • 버튼 클릭 시 didTapDone() 메서드를 호출하여 컨트롤러를 닫습니다.
2. WebView 추가:
   • webView를 뷰에 추가하고, 전체 화면에 맞게 제약 조건을 설정합니다.
   • 뷰의 모든 가장자리에 고정(top, bottom, leading, trailing)합니다.

 

6. 액션 메서드

1. @objc didTapDone():
   • "Done" 버튼 클릭 시 호출됩니다.
   • self.dismiss(animated: true, completion: nil)을 통해 모달 방식으로 표시된 뷰 컨트롤러를 닫습니다.

 

let urlString = "https://www.apple.com"
let webViewer = WebViewerController(with: urlString)
let navigationController = UINavigationController(rootViewController: webViewer)
present(navigationController, animated: true, completion: nil)

 

기능 동작 흐름

1. init(with urlString: String)으로 URL 문자열을 전달받아 초기화.
2. viewDidLoad()에서 URL이 유효하면 WKWebView를 통해 해당 URL의 콘텐츠 로드.
3. Done 버튼으로 dismiss(animated:)를 통해 컨트롤러 종료 가능.

 

장점

1. 재사용성:
   • 다른 URL을 전달받아 재사용이 가능.
2. 다크 모드 지원:
   • 시스템 색상(secondarySystemBackground)을 사용하여 다크 모드 지원.
3. 안전성:
   • URL 유효성을 검사하고, 실패 시 자동으로 화면을 닫아 오류 방지.