I'm trying to use WKWebView
to display one embedded timeline from Twitter.
Almost all links are working after the WKWebView
has loaded the embedded content successfully, but the redirect link for each tweet which displays on the timeline does not.
Here is the embedded tweet link:
https://publish.twitter.com/?query=%40Google&widget=Timeline
This is the embedded twitter timeline:
< a class="twitter-timeline" href="https://twitter.com/Google?ref_src=twsrc%5Etfw">Tweets by Google< /a>
< script async src="https://platform.twitter.com/widgets.js" charset="utf-8">< /script>
If you scroll it down and try to click one of the tweets, you will be lead to the current tweet, but this will not work when you display with WKWebView
.
During my test round, I tried to use the same embedded timeline and tested on an Android device which worked.
I think the embedded link is fine and it must be something wrong with how I implemented WKWebView
or the WKWebView
itself has issues with displaying a Twitter Embedded Timeline.
Here is my code for using WKWebView
to display the embedded Twitter timeline:
import UIKit
import WebKit
class ViewController: UIViewController {
private var mWebView: WKWebView!
let embeddedTwittContent = "<a class='twitter-timeline' href='https://twitter.com/Google?ref_src=twsrc%5Etfw'>Tweets by Google</a>"
let scriptValue = "<script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>"
let redirectLink = "https://twitter.com/Smaforetagarna/status/"
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
let preferences = WKPreferences()
preferences.javaScriptEnabled = true
let configuration = WKWebViewConfiguration()
configuration.websiteDataStore = WKWebsiteDataStore.nonPersistent()
configuration.preferences = preferences
self.mWebView = WKWebView(frame: CGRect.zero, configuration: configuration)
self.mWebView.translatesAutoresizingMaskIntoConstraints = false
self.mWebView.allowsLinkPreview = true
self.mWebView.allowsBackForwardNavigationGestures = true
self.mWebView.navigationDelegate = self
self.view.addSubview(self.mWebView)
// Add Constraints
self.mWebView.topAnchor.constraint(equalTo: self.view.topAnchor, constant: 100).isActive = true
self.mWebView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor, constant: 0).isActive = true
self.mWebView.rightAnchor.constraint(equalTo: self.view.rightAnchor, constant: 0).isActive = true
self.mWebView.leftAnchor.constraint(equalTo: self.view.leftAnchor, constant: 0).isActive = true
loadTweetNews()
}
func loadTweetNews(){
let htmlHeader = "<!DOCTYPE html> <html><meta name=\'viewport\' content=\'initial-scale=1.0\'/> <head> \(scriptValue) </head> <body>"
let htmlFooter = "</body> </html>"
let orderHtml = htmlHeader + embeddedTwittContent + htmlFooter
let url: URL = URL(string: "https:")!
self.mWebView.loadHTMLString(orderHtml, baseURL: url)
}
}
extension ViewController: WKNavigationDelegate{
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
print("page finished load")
}
func webView(_ webView: WKWebView, didReceiveServerRedirectForProvisionalNavigation navigation: WKNavigation!) {
print("didReceiveServerRedirectForProvisionalNavigation: \(navigation.debugDescription)")
}
func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
print("didStartProvisionalNavigation")
}
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void) {
if navigationAction.navigationType == .linkActivated {
if let url = navigationAction.request.url,
UIApplication.shared.canOpenURL(url) {
UIApplication.shared.open(url)
print(url)
decisionHandler(.cancel)
} else {
decisionHandler(.allow)
}
} else {
decisionHandler(.allow)
}
}
}
If you run this code, you will be able to click almost all links, but as soon you trying to click one of these tweets, nothing will happen.
My project deployment target is 10.0
My Xcode version is 10.2.1
My Swift version is 4.2