使用 SFSafariController 來開啟我們 QRCode 獲取的網址連結吧!
iPhone 內建的瀏覽器 - Safari
天瓏書局自助刷卡說明
前面我們有實作過在 App 中透過 WebView 顯示出書局網站內容,這次教學我們將使用上次 QR Code 掃描過後的結果,如果是網址我們就透過 SFSafariController 來在 App 中開啟網站掃描到的網站吧。
SFSafariController 跟使用 URL 一般跳出 Safari 瀏覽器的功能是不太一樣的,SFSafariController 是在 App 中使用完整的 Safari 瀏覽器功能,並沒有離開 App 本身,如此一來就能讓使用者存留在 App,並且也能夠使用 Safari 的完整功能。
要使用 SFSafariController 之前,我們需要先 import SafariServices
之後才能開始我們的實作,這邊我們想仿照 Line 的 QR Code 掃描的方式:
Line 掃描 QR Code 過程所以我們打算在我們掃描 QR Code 的 ScannerViewController
掃描後,透過 Delegate 將我們掃描到的結果傳回首頁跳出讀取結果的 AlertController,並且詢問使用者是否開啟。
首先我們先到我們的 ScannerViewController
的 metadataOutput 方法,在我們獲取到 QR Code 的字串值後,新增下面這段程式碼:
// dismiss ScannerViewController,並且在 dismiss 後
// 執行我們自定義的 qrCodeDelegate 方法
self.dismiss(animated: false) {
self.qrCodeDelegate?.getUrlString(urlString: string)
}
接著我們到我們的首頁 HomeViewController 實作我們 QRCodeDelegate 的 getUrlString 的方法:
// MARK: QRCode Delegate
extension HomeViewController: QRCodeDelegate {
func getUrlString(urlString: String) {
let alertController = UIAlertController(title: "讀取資訊", message: "確認要開啟以下連結嗎?\n\(urlString)", preferredStyle: .alert)
let cancelAction = UIAlertAction(title: "取消", style: .cancel, handler: nil)
let comfirmAction = UIAlertAction(title: "開啟", style: .default) { (_) in
// 當使用者按下開啟後,判斷是否能夠轉換為 url
// 如果成功轉換成 url,初始化 SFSafariViewController,並且 present 它
if let url = URL(string: urlString) {
let safariVC = SFSafariViewController(url: url)
self.present(safariVC, animated: true, completion: nil)
} else {
// 若無法轉換為 url,跳出 errorAlertController
let errorAlertController = UIAlertController(title: "開啟失敗", message: "無效的 URL,請確認後在試一次", preferredStyle: .alert)
let okAction = UIAlertAction(title: "OK", style: .cancel, handler: nil)
errorAlertController.addAction(okAction)
self.present(errorAlertController, animated: true, completion: nil)
}
}
alertController.addAction(cancelAction)
alertController.addAction(comfirmAction)
self.present(alertController, animated: true, completion: nil)
}
}
如此一來我們就完成整個 QR Code 掃碼流程了,接著我們實際運行一次吧!
成功在 App 中使用 SFSafariController 功能
透過這次教學後,大家對於能夠在 App 中應用 Web 瀏覽器又多了一項,但至於要使用跳出瀏覽器、WKWebView 或是 SFSafariController 完全都是看個人的需求,根據你的需求決定你要使用的方法,我們下次教學見~