UIWebView Javascript와 통신하기

Swift의 앱과 웹의 통신은 기본적으로 Objective-C와 같다.

하지만 문법이 다르니 조금 달라진다.

ViewController에서 UIWebViewDelegate 클래스를 상속받는다.

1. Javascript -> Swift는

func webView(webView: UIWebView, shouldStartLoadWithRequest request: NSURLRequest,
navigationType: UIWebViewNavigationType) -> Bool {}
 

함수를 사용할 것이고,

2. 반대는 웹뷰의 stringByEvaluatingJavaScriptFromString()를 사용할 것이다.

1번은 자바스크립트 내에서 리퀘스트를 캐치했을 때 호출되는 함수로, 이것을 이용해서 자바스크립트 내에서 특정 리퀘스트(document.location)에 특정 스키마를 설정하는 방법을 사용한다.

예를 들어 자바스크립트 내에

function test(){
    document.location = "myScheme://customfuncname";
} 

이란 함수를 작성하고 해당 함수를 호출하면 location값이 1번에 기술된 함수(ViewController에 위치한)의 request로 들어온다.

그러면 유저는 customfuncname 부분을 특정해서 각각 수행할 함수를 연결하면 된다.

사용 방법은 아래와 같다. 위에 기술한 webView() 함수 코드이다. 코드의 위치는 여러 군데에서 사용되겠지만, 일단 ViewController에 기술했다.

// Run that received request from javascript
    func webView(webView: UIWebView, shouldStartLoadWithRequest request: NSURLRequest,
        navigationType: UIWebViewNavigationType) -> Bool {
        if let s = request.URL?.absoluteString {
            if s.hasPrefix("js:"){
                var array = s.componentsSeparatedByString("://")
                let funcName = array[1] // array[0] value is 'js'
                
                switch(funcName){
                case "showAlert" :
                    NSLog("call this function from javascript")
                    let ran : UInt32 = arc4random_uniform(4) + 1
                    showAlert("show alert", message: "call this function from javascript")
                    break;
                default:
                    break;
                }
                
                return false
            }
        }
        return true
    }

먼저 파라미터로 들어온 request의 URL(myScheme://함수명)을 문자열 형태로 바꿔주고 스키마명을 찾는다. 위에 기술된 부분에서는 js가 되겠다. 찾은 뒤, 함수명을 switch문을 이용해 구분했다. 보면 알겠지만 스키마 뒤에 오는 구분자 문자열이 꼭 함수명이어야 하는 것은 아니다. 그냥 편하게 구분하기 위해서 사용했다.

위 코드는 리퀘스트를 받아 구분자 문자열이 showAlert일 경우 앱 내의 showAlert()을 호출하는 코드이다.

2번은 더 간단하다. 특정 함수에

myUiWebView.stringByEvaluatingJavaScriptFromString("자바스크립트에서 수행할 함수 이름()")

을 기술하고 앱 내에서 해당 함수를 호출하면 웹의 스크립트에서 해당 함수를 찾아 호출한다.