【Swift】Stringで取得したHTMLやJavaScriptをWebViewに表示させる方法


こんにちは。マっさんです。
タイトル通り、HTMLやJavaScriptのソースコードの文字列をWebViewに表示させる方法を書きます。 またこの方法はWebViewだけではなく、WebKit Viewでも動作します。

今回は以下の様な Twitter の画面を表示させる事をゴールとします。

以下がソースコードとなっています。

import UIKit
import WebKit

class ViewController: UIViewController, UIWebViewDelegate {
     // StoryBoard で接続されている事
    @IBOutlet weak var webView: UIWebView!

    let htmlTwitterString = """
    <blockquote class="twitter-tweet tw-align-center"><p lang="en" dir="ltr"><a href="https://twitter.com/hashtag/Turkey?src=hash&amp;ref_src=twsrc%5Etfw">#Turkey</a> hints at pulling access to <a href="https://twitter.com/hashtag/Incirlik?src=hash&amp;ref_src=twsrc%5Etfw">#Incirlik</a> ABand if US acts over <a href="https://twitter.com/hashtag/Russian?src=hash&amp;ref_src=twsrc%5Etfw">#Russian</a> weapons purchase <a href="https://t.co/tp7Oa5w0zO">https://t.co/tp7Oa5w0zO</a></p>&mdash; Michael Abrams (@stripes_photog) <a href="https://twitter.com/stripes_photog/status/1153671797843398657?ref_src=twsrc%5Etfw">July 23, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script><br/>
"""

    override func viewDidLoad() {

        super.viewDidLoad()

        // htmlTwitterString変数を渡す
        webView.loadHTMLString(htmlTwitterString, baseURL: nil)

    }

}

このloadHTMLStringメソッドにHTMLのCode、もしくはURLを引数として渡すと、UIWebViewに表示させることができます。

・補足

もし、Twitterでタイムラインを取得したい場合は、以下のリンクへ飛んでください。

What would you like to embed?
https://publish.twitter.com

そして以下の様に、埋め込みたいタイムラインのURLを貼り、画面を進むと・・・ f:id:MasayaStripes:20191115152344p:plain
f:id:MasayaStripes:20191115152509p:plain

上記の写真の様に埋め込み様のCodeを取得する事ができます。 取得したURLをHTMLに記載したら、指定したタイムラインを埋め込むことができます。

以上です!今日はこの辺で!