[SWIFT] WKWebView

 

 

WKWebView

- WebView 기능 제공해주는 라이브러리

- 기존 UIWebView 대체하여 적용 (UIWebView는 iOS 9 기준으로 deprecate)

- 더 빠른 자바스크립트 엔진인 Nitro 사용

- iOS 9 이상 버전 필요. 하위 버전과의 호환 이슈 있을 수 있음

- 로컬로 저장된 파일에 대한 Ajax 요청 지원 안함.

- 쿠키 허용 설정 지원 안함, 고급 캐시 설정 지원 안함, 앱 종료 시 HTML 5 로컬 스토리지 삭제

 

 

 

WKUIDelegate, WKNavigationDelegate

- WKUIDelegate : JavaScript, 기타 플러그인 컨텐츠 이벤트 캐치하여 동작. 웹 페이지 기본 사용자 인터페이스 요소 제공

- WKNavigationDelegate : 프로토콜로 페이지의 start, loading, finish, error 트리거 이벤트 캐치하여 사용자 정의 동작 구현 가능

 

1. WebKit View 선택

 

 

 

2-1. 프로젝트명 클릭 ▶ 기본 설정 화면에서 Build Phases

 

 

 

2-2. Link Binary With Libraries 클릭 ▶ + 버튼 클릭

 

 

 

2-3. WebKit 검색 ▶ WebKit.framework 선택 ▶ Add

 

 

2-4. Library 잘 추가되었는지 확인

 

 

 

2-5. import 해보기

 

 

 

320x100

 

 

3. viewDidLoad()

override func viewDidLoad() {
   super.viewDidLoad()
        
   print("viewDidLoad Call")
        
   loadUrl()
}

 

 

 

4. loadUrl() - view와의 Interface Setting

func loadUrl() {
  view.addSubview(webView)
        
  //WKWebview Setting
  let url = URL(string: "https://www.google.co.kr")
  let request = URLRequest(url: url!)
        
  webView.load(request)
        
  webView.uiDelegate = self
  webView.navigationDelegate = self
}

- WebView의 여러 delegate 처리를 현재(self) Class(ViewController)로 등록 ▶ delegate 등록하지 않으면 정상적인 이벤트 처리 불가능

 

 

 

5. WKNavigationDelegate Protocal Method

///WKNavigationDelegate 중복적으로 리로드 방지 (iOS 9 이후지원)
public func webViewWebContentProcessDidTerminate(_ webView: WKWebView) {
   webView.reload()
}

- 중복적으로 reload 방지 위한 함수

 

 

 

6-1. Network 연결 상태 체크

override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(true)
        
        print("viewDidAppear Call")
        
        checkNetworkConnect()
    }

- 네트워크 검사는 iOS 생애주기에 맞춰서 적절하게 해주면 됨!

 

 

 

6-2. checkNetworkConnect()

func checkNetworkConnect() {
        //Alert 사용한 Network Check --> viewDidAppear
        if Reachability.isConnectedToNetwork() {
            print("Network Connect")
        } else {
            print("Network Not Connect")
            
            let networkCheckAlert = UIAlertController(title: "Network Error", message: "앱 종료", preferredStyle: UIAlertController.Style.alert)
            
            networkCheckAlert.addAction(UIAlertAction(title: "OK", style: .default, handler: {(_: UIAlertAction!) in
                print("App exit")
                
                exit(0)
            }))
            
            self.present(networkCheckAlert, animated: true, completion: nil)
        }
    }

- 네트워크 연결상태에 따른 값 반환.
- 네트워크 연결 되어있지 않으면 UIAlertController 이용하여 Alert  창 띄우고 OK 누를 시 앱 종료

 

 

 

6-3. Reachability class

import Foundation
import SystemConfiguration

public class Reachability {
    class func isConnectedToNetwork() -> Bool {
        var zeroAddress = sockaddr_in(sin_len: 0, sin_family: 0, sin_port: 0, sin_addr: in_addr(s_addr: 0), sin_zero: (0,0,0,0,0,0,0,0))
        zeroAddress.sin_len = UInt8(MemoryLayout.size(ofValue: zeroAddress))
        zeroAddress.sin_family = sa_family_t(AF_INET)
                
        let defaultRouteReachability = withUnsafePointer(to: &zeroAddress) {
            $0.withMemoryRebound(to: sockaddr.self, capacity: 1) {zeroSockAddress in
                SCNetworkReachabilityCreateWithAddress(nil, zeroSockAddress)
            }
        }
                
        var flags: SCNetworkReachabilityFlags = SCNetworkReachabilityFlags(rawValue: 0)
                
        if SCNetworkReachabilityGetFlags(defaultRouteReachability!, &flags) == false {
                return false
        }
                
        // Working for Cellular and WIFI
        let isReachable = (flags.rawValue & UInt32(kSCNetworkFlagsReachable)) != 0
        let needsConnection = (flags.rawValue & UInt32(kSCNetworkFlagsConnectionRequired)) != 0
        let ret = (isReachable && !needsConnection)
                
        return ret
    }
}

- SystemConfiguration import하여 Network 설정 정보 얻어와 판단

 

 

 

7-1. 뒤로가기 Interface

@IBAction func backBtn(_ sender: UIButton) {
   if(webView.canGoBack) {
      webView.goBack()
   } else {
      print("no back page")
   }
}

 

 

 

7-2. 앞으로가기 Interface

@IBAction func forwardBtn(_ sender: UIButton) {
   if(webView.canGoForward) {
      webView.goForward()
   } else {
      print("no forward page")
   }
}

 

 

 

7-3. 새로고침 Interface

@IBAction func refreshBtn(_ sender: UIButton) {
   print("refresh page")
        
   webView.reload()
}

 

 

 

7-4. 홈 Interface

@IBAction func homeBtn(_ sender: UIButton) {
   print("home page reload")
        
   let url = URL(string: "https://www.google.co.kr")
   let request = URLRequest(url: url!)
   webView.load(request)
}

 

 

 

 

 

8. Info.plist 수정

- 기본적으로 HTTPS 접속은 암호화가 되어있어 접근 허용 가능하나, HTTP의 경우 암호화가 되어있지 않아 접근에 제약 있음.

- HTTP 접근 허용하기 위해서는 App Transport Security Setting > Allow Arbitray Loads : YES로 허용. (iOS 9 버전부터)

 

 

 

9. 결과

 

 

 

 

 

참고 : m.blog.naver.com/PostView.nhn?blogId=scw0531&logNo=221683538588&proxyReferer=https:%2F%2Fwww.google.com%2F

[iOS / Swift - WKWebView]