BlueCompassっていうWebview用のPodsを公開したというのをメモする雑記
どうも、こがです。
noteの初公開記事なのにという内容という気がしないでもないですが、せっかくという感じで記事を書くことにしました。
BlueCompass is 何?
需要がニッチなのはわかっているけど、ネイティブ側とWKWebViewとでJavascriptを使ってやりとりするときに、ネイティブ側に渡されるデータの型が変容するのが面倒だなと思って、それを解決しようっていうライブラリになります。
Javascript側からは JSON.stringify( { data: "hogehoge" } ) みたいにstringifyしたデータをもらって、ネイティブ側で適切なCodableに落とすって流れですね。
Githubにもあげてますが、サンプルコードはこちら
// format for receive json.
class MessageEntity: Decodable {
var message: String
}
class ExampleViewController: UIViewController {
var disposeBag = DisposeBag()
let blueCompass = BlueCompass()
// create configuration and set BlueCompass to userContentController.
lazy var configuration: WKWebViewConfiguration = {
let config = WKWebViewConfiguration()
config.userContentController = blueCompass
return config
}()
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear( animated )
let webView = WKWebView( frame: view.frame, configuration: configuration )
view.addSubview( webView )
// "test" is custom specified name.
// Json data is converted in internal.
blueCompass.receive( "test", MessageEntity.self ).subscribe{
print( $0.element!.message )
}.disposed(by: disposeBag )
// javascript sample.
webView.evaluateJavaScript( "webkit.messageHandlers.test.postMessage( JSON.stringify( { message: \"hello world\" } ) )" )
}
}
webView.evaluateJavaScriptにそのまま呼び出しを書いちゃってますが、メッセージハンドラ名に"test"を指定しています。
また、コードの最初に定義しているMesssageEntryクラスと合わせたJSONをpostMessageでネイティブ側へ送っています。
JSONから変換する型はreceive関数部分で指定しています。また、ライブラリ側でJSONから変換を行っていますので、受け取るときにはすでに指定したクラスになっています。
はい、ということで解説おわりっ!
Githubのリンクはこちら
かる〜〜い記事でした。
この記事が気に入ったらサポートをしてみませんか?