30
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

updated at

[Swift]WebViewをキャッシュでオフライン閲覧

オフライン時にもキャッシュからWebViewを表示したかった時の思い出をメモ。
「ウェブページをキャッシュで保存してオフライン閲覧するためのシンプルな実装」
参考にさせていただいたこちらの記事のSwift版(やってることほとんど変わらない...)

ライブラリ・フレームワーク

RNCachingURLProtocol

https://github.com/rnapier/RNCachingURLProtocol
NSURLProtocolというネットワークプロトコルをカスタムするライブラリ。
このライブラリを使うと,以下のことが可能に。

  • 初めて読み込んだページは普通に開く
  • 読み込みが完了したらキャッシュする
  • 次回読み込み時,キャッシュがあればそれを読み込む

SystemConfiguration.framework

デバイスのネットワーク状況を取得することができるフレームワーク。

実装

1. フレームワークを入れてからAppDelegateにimport

AppDelegate.swift
import SystemConfiguration

2. RNCachingURLProtocolをSwiftで使えるようにする

RNCachingURLProtocolはObjective-Cのライブラリなので,Swiftで使えるようにする必要がある。方法は,{プロジェクト名}-Bridging-Header.hを作成し,そこに使うObjective-Cのライブラリのヘッダーファイルをimport。

Bridging-Header.h
#import "RNCachingURLProtocol.h"

3. NSURLProtocolをRNCachingURLProtocolでカスタム

AppDelegateに NSURLProtocol.registerClass(RNCachingURLProtocol) を記述。この1行でNSURLProtocolが,今回の目的を満たす処理にカスタムされる。

AppDelegate.swift
func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
        NSURLProtocol.registerClass(RNCachingURLProtocol)
        return true
}

4. WebViewを普通に表示

1~3までの手順で終わりだが,一応WebViewのコードも。

ViewController.swift
class ViewController: UIViewController {

    @IBOutlet weak var webview: UIWebView!

    var url="https://www.google.com/"

    override func viewDidLoad() {
        super.viewDidLoad()

        let request=NSURL(string: url)
        let requestURL=NSURLRequest(URL: request!)
        webview.loadRequest(requestURL)
    }

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

@IBOutlet weak var webview: UIWebView!はstoryboardに配置したWebViewをcontrol+ドラッグしてコードにドロップしたもの。

以上でWebViewをオフラインでも扱うことが可能に!

おまけ

このライブラリだとhttps通信はキャッシュされないようになっている。そのため,https://www.google.com/とか手頃なURLでテストしてた人は,「オフライン時表示されないじゃん!」ってなるはず。(なりました)
https通信をキャッシュしたいなら,RNCachingProtocol.minitializeメソッドの@httpと記述されてる部分を@httpsに書き換えればいい。

参考

swiftでwebViewアプリを作ってみた

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
30
Help us understand the problem. What are the problem?