웹 페이지의 자바스크립트 통신(JS <-> Swift)

웹페이지의 객체에 대한 동작을 네이티브에서 작업 해야한다면 ,

자바스크립트의 messageHandler에서 네이티브에서 사용할 이름을 넣어주고

네이티브에서는 이 이름을 이용하여 해당 객체에 대한 동작을 구현 해줄 수 있다.

 

네이티브에 웹 연결

1. 'WKScriptMessageHandler'를 채택해준다.

class ViewController: WKScriptMessageHandler

 

2. 이 프로토콜 채택하게 되면 필수적으로 구현해주어야 하는 함수를 추가해준다.

func userContentController( _userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
   // 웹 페이지의 작업을 처리하는 곳
}

3. 자바스크립트와 연결

  webView에 add해주는 작업은 정의해준 messageHandler 수만큼 해주어야 한다.

override func viewDidLoad() {
    생성한wevView.configuration.userContentController.add(self, name: 자바스크립트에 정의해준 이름)
}

 

웹과 통신하기

추가해줬던 함수 'userContentController'에 messageHandler에 따라 구분하여 작업 해준다.

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
  // 메세지의 body가 필요하다면
  guard let body = message.body as? String else { return }
  
  if message.name == "정의한 이름 1" {
    // 필요한 동작
  } else if message.name == "정의한 이름 2" {
    // 필요한 동작
  }
}

 

참고: 

https://developer.apple.com/documentation/webkit/wkscriptmessagehandler

http://yoonbumtae.com/?p=3953 

 

 

오류

1. 만약, 코드 및 설정에 전혀 문제가 없음에도 userContentController 함수가 실행되지 않는다면

    자바스크립트에 messageHandler의 postmessage에 파라미터가 없는지 확인 해야한다. iOS의 경우 postmessage에 파라미터가 꼭 들어가야 동작한다.