【swift】iOSでWebViewのjavascriptと連携する方法メモ

はじめに

以下のような問題があってWebViewの使用を検討
・開発中のアプリのある画面のデザインがけっこう複雑で実装するのに時間かかりそう。
・HTML、CSSで実装するとそんなでもなさそう。

問題点としてはこの画面でのユーザー操作によってアプリの他の画面の表示内容にも影響がある。
なので、Web上での操作(javascriptのonclickとか)をアプリ側でハンドリングする必要がある。

で、調べたらけっこう簡単にできるぽかった。。。

実装

手順としては以下
・URLスキームを設定する(xcode)
・Webページを用意してswiftにデータを通知する処理を実装(web)
・Webページを表示する処理とユーザ操作をハンドリングする処理を実装(swift)

URLスキームを設定(xcode)

xcodeでプロジェクト > TARGETS > infoのURL Typesを追加
この画面から「identifier」と「URL Schemes」を設定
今回は「test」として、「test://」の形でアプリを起動できるようにした

Webページを用意してswiftにデータを通知する処理を実装(web)

http://example.com/test.html

<a onclick="onClick();">リンクとか</a>
<script>
 function onClick() {
     // webアプリと同じように?以降にパラメータをつけてswift側へわたす
     document.location = "test://?param=xxxxx";
 }
</script>

Webページを表示する処理とユーザ操作をハンドリングする処理を実装(swift)

swift

import UIKit

class ViewController: UIViewController,UIWebViewDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()

        let webView: UIWebView = UIWebView()
	webView.delegate = self
        webView.frame = view.bounds
        view.addSubview(webView)

        let url = NSURL(string: "http://example.com/test.html")!
	webView.loadRequest(NSURLRequest(url: url as URL) as URLRequest)
    }

    func webView(_ webView: UIWebView, shouldStartLoadWith request: URLRequest, navigationType: UIWebViewNavigationType) -> Bool {
        if request.url?.scheme == "test" {
            print(request.url?.query) // => ?param=xxxxx
        } else {
            return true
        }
    }
}

ずらずら書いたけどこんな感じでいけた。
以上です