WKWebViewのSample

ゆう@あんのうんです。

ATSの問題で、WKWebViewが流行ってきました。 (WKWebViewでもUIWebViewでもNSAllowsArbitraryLoadsInWebContentが使えるので、ATSだから…と言うのは色々とミスリードな気がしてますが)

ただ、ChromeアプリもWKWebViewに乗り換えたという話も出ていますし、今後の世の流れはWKWebViewに移っていくだろうと、想定してやろうやろうと思っていたWKWebViewの勉強を始めたので、そのメモ的なものです。

最初に

WKWebViewはInterfaceBuilderで作成できません。

ココらへんで、昔ながらのiOSエンジニアなら問題ないのでしょうが、Storyboard台頭以降のiOSエンジニアに取っては敷居の高いものと鳴っているかと思います。
かくいう私もすっかりIBに慣れてしまった為、中々勉強しなかった原因がこれなのですが…。

話を戻すと、現状(XCode8.0段階)でもIBは用意されていなかったので、自前でコツコツとコードを書いていきます。

XCode8.0 iOS10ではすでに設定を入れないとHTTP通信は出来ません。

なので、作っていてViewが真っ白の場合は、これに引っかかっているケースが多いので、設定をいじりましょう。 Info.plistに以下の用に設定します

コードを書く

単純にWebページを表示させるだけならUIWebViewと使用感は変わりません。

以下に、ViewControllerの画面いっぱいにWKWebViewでWebページを読み込むコードを記載します。

class ViewController: UIViewController, WKNavigationDelegate, WKUIDelegate {

    @IBOutlet var ibWKWebView: WKWebView?
    
    required init?(coder aDecoder: NSCoder) {
        super.init(nibName: nil, bundle: nil)
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
    
        self.ibWKWebView = WKWebView()
        self.ibWKWebView!.navigationDelegate = self
        self.ibWKWebView!.translatesAutoresizingMaskIntoConstraints = false
        
        self.view.addSubview(self.ibWKWebView!)
        
        var viewBindingsDict = [String: AnyObject]()
        viewBindingsDict["webView"] = self.ibWKWebView
        self.view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|[webView]|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: viewBindingsDict))
        self.view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[webView]|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: viewBindingsDict))
        
        let url = NSURL(string: "http://project-unknown.hatenablog.com/entry/2015/04/18/201907")
        let request = NSURLRequest(url: url! as URL)
        
        self.ibWKWebView!.load(request as URLRequest)
        
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        
    }


}

やっていることは

self.ibWKWebView = WKWebView()

で、WKWebViewのオブジェクトを作って、

self.ibWKWebView!.load(request as URLRequest)

で、NSURLRequestを読んでいるだけとなります。

Sampleコードについて

以下のGitにUploadしていますので、参考にしてください https://github.com/yxuyxu/WkWebViewSample/blob/master/WKWebViewSample/ViewController.swift

この後は、Delegateやら色々あるのですが、今日はここまでで。