WKWebView issues with tel: links - ios

I've looked though a lot of the answers for this question but they seem to be outdated now and none of the solutions are working for me and just give lots of errors.
I'm just gettign into xcode and apps and am loading a local html file "index.html" into a WKWebView. This is fine, loads fine, displays as it should, BUT I have some tel: links on the page which don't work, I tap on them and nothing. I am using fraework7 for my html files and have added the "external" class, which works in safari etc.
UPDATE: Using the following code I can click on a link and it will try and call, but then gives a fatal error
import UIKit
import WebKit
class ViewController: UIViewController, WKNavigationDelegate{
#IBOutlet weak var webview: WKWebView!
override func viewDidLoad() {
webview.navigationDelegate = self
super.viewDidLoad()
let htmlpath = Bundle.main.path(forResource: "index", ofType: "html")
let url = URL(fileURLWithPath: htmlpath!)
let request = URLRequest(url: url)
webview.load(request)
webview.scrollView.bounces = false
webview.configuration.dataDetectorTypes = .phoneNumber
// Do any additional setup after loading the view, typically from a nib.
}
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: #escaping (WKNavigationActionPolicy) -> Swift.Void) {
if navigationAction.request.url?.scheme == "tel" {
UIApplication.shared.openURL(navigationAction.request.url!)
decisionHandler(.cancel)
}
decisionHandler(.allow)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
and html looks like:
<tr>
<td>Police / Fire / Ambulance</td>
<td>Emergency Services</td>
<td>999</td>
</tr>
obviously part of a larger table but this is the example.
Any pointers would be greatly appreciated as I've been going round in circles for ages.

Managed to find a solution finally:
import UIKit
import WebKit
class ViewController: UIViewController, WKNavigationDelegate, WKUIDelegate{
#IBOutlet weak var webView: WKWebView!
override func viewDidLoad() {
webView.navigationDelegate = self
webView.uiDelegate = self
super.viewDidLoad()
let htmlpath = Bundle.main.path(forResource: "index", ofType: "html")
let url2 = URL(fileURLWithPath: htmlpath!)
let request = URLRequest(url: url2)
webView.load(request)
webView.scrollView.bounces = false
//webview.configuration.dataDetectorTypes = .phoneNumber
}
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: #escaping (WKNavigationActionPolicy) -> Void) {
if navigationAction.request.url?.scheme == "tel" {
UIApplication.shared.openURL(navigationAction.request.url!)
decisionHandler(.cancel)
} else {
decisionHandler(.allow)
}
}
Using this seems to pick up the tel: links fine, an answer I found on here previously didn't have the else statement so fired decisionHandler more than once which created the error, the else statement fixed that and now seems fine.

It's not just tel: links that aren't handled out of the box by WKWebView. Other links like mailto: and facetime: aren't handled either. For a complete list of these kinds of special links, see Apple's documentation.
You should decide which of Apple's special links you want handled (see the link above), and override the navigation handler in a manner similar to the following:
webView.navigationDelegate = self
...
extension ViewController: WKNavigationDelegate {
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: #escaping (WKNavigationActionPolicy) -> Void) {
guard let url = navigationAction.request.url else {
decisionHandler(.allow)
return
}
if ["tel", "sms", "facetime"].contains(url.scheme) && UIApplication.shared.canOpenURL(url) {
UIApplication.shared.open(url, options: [:], completionHandler: nil)
decisionHandler(.cancel)
} else {
decisionHandler(.allow)
}
}
}
The only reason I can think of why Apple didn't include this in the first place is because when you try launching one of these links in Mobile Safari, it shows you a dialog such as the following:
This website has been blocked from automatically starting a call.
[Ignore] [Allow Call]
Thus, they may expect you want to implement something similar in your app instead of just launching the call.
Note however, that each type of link behaves differently:
tel: dialog that shows the phone number with call/cancel buttons.
sms: launches the Messages app.
mailto: launches the Mail app.
So if you do want to have some kind of modal that allows the user to cancel if they didn't mean to perform the action, depending on which actions you support it might already have similar behavior (e.g. tel:).

Just use WKNavigationDelegate and dataDetectorTypes for WKWebView configuration like below:
webView.navigationDelegate = self
webView.configuration.dataDetectorTypes = [.link, .phoneNumber]
extension PDFWebViewController: WKNavigationDelegate {
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: #escaping (WKNavigationActionPolicy) -> Void) {
if let requestUrl = navigationAction.request.url, requestUrl.scheme == "tel" {
UIApplication.shared.open(requestUrl, options: [:], completionHandler: nil)
decisionHandler(.cancel)
} else {
decisionHandler(.allow)
}
}
}

While suggested answers work fine - I would recommend to use white-list approach instead of black-list. We know that WKWebView can only handle http/https links so we can gracefully handle the error of opening any other kind of link.
func webView(_ webView: WKWebView, didFail navigation: WKNavigation!, withError error: Error) {
self.handleNavigationError(error)
}
func webView(_ webView: WKWebView, didFailProvisionalNavigation navigation: WKNavigation!, withError error: Error) {
self.handleNavigationError(error)
}
private func handleNavigationError(_ error: Error) {
if let failedUrl = (error as NSError).userInfo[NSURLErrorFailingURLErrorKey] as? URL, failedUrlScheme = failedUrl.scheme?.lowercased(), !["http", "https"].contains(failedUrlScheme) {
UIApplication.shared.open(failedUrl, completionHandler: nil)
} else {
// handle other errors if needed
}
}
In this case you will support all the types of external app links like tel:, sms:, faceTime:, itms-services: etc.

Related

How do I open phone from tel: url link from WebKit iOS app using Swift

I am creating an iPhone app and in part using WebKit to display a web page in the app. Currently, when I click a button that is displayed on the website it should open the phone app (with a tel: link) and dial the number. Unfortunately in the app, it does nothing, however, it works fine in chrome/ safari.
I have tried to scour the internet and attempted several suggestions but nothing seems to do anything so far.
import UIKit
import WebKit
class ShopViewController: UIViewController, WKNavigationDelegate, WKUIDelegate {
#IBOutlet weak var backButton: UIBarButtonItem!
#IBOutlet weak var shopWebKit: WKWebView!
override func viewDidLoad() {
super.viewDidLoad()
shopWebKit.navigationDelegate = self
shopWebKit.uiDelegate = self
// Do any additional setup after loading the view.
}
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear( animated )
let urlString:String = "https://www.somewebsite.com"
let url:URL = URL(string: urlString)!
let urlRequest:URLRequest = URLRequest(url: url)
shopWebKit.load(urlRequest)
}
#IBAction func backButtonTapped(_ sender: Any) {
if shopWebKit.canGoBack{
shopWebKit.goBack()
}
}
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
backButton.isEnabled = webView.canGoBack
}
func webView(_ webView: WKWebView, createWebViewWith configuration: WKWebViewConfiguration, for navigationAction: WKNavigationAction, windowFeatures: WKWindowFeatures) -> WKWebView? {
if navigationAction.targetFrame == nil {
webView.load(navigationAction.request)
}
return nil
}
}
I am hoping to be able to click any tel: link button loaded in the WebKit and have it open the phone app and dial the number. Please help.
Try below code it's working fine swift5. first add 'navigationDelegate' to your WKWebView.
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: (WKNavigationActionPolicy) -> Void) {
switch navigationAction.request.url?.scheme {
case "tel":
UIApplication.shared.open(navigationAction.request.url!, options: [:], completionHandler: nil)
decisionHandler(.cancel)
break
default:
decisionHandler(.allow)
break
}
}
Note: try testing with actual device.
Here is just a code to open the phone app and make calls. Probably it can help u.
if let url = URL(string: "tel:+100000000"), UIApplication.shared.canOpenURL(url) {
UIApplication.shared.open(url, options: [:], completionHandler: nil)
}

How to pass function to webpage using swift?

I have a situation where I need to capture an event from a button click in a WebPage.
this code is on the webpage on a button click.
okCoolClick = () => {
/*eslint-disable* /
console.log("okay cool ", window.okCool);
if (window.okCool) {
okCool.performClick();
} else {
window.open("some-url");
}
};
Now the Android team is done with the problem, with below code.
commonWebView.addJavascriptInterface(object : Any() {
#JavascriptInterface
fun performClick() {
val ownerId = arguments?.getInt(OWNER_ID)
if (ownerId == -1) {
context?.startActivity<RightNavigationActivity>()
activity?.finishAffinity()
} else {
context?.startActivity<HomeItemListActivity>(
Pair(HomeItemListActivity.INTENT_EXTRA_COMPONENT,
AppConstants.HOME_SUB_LIST_CLUB_OUTLET_LIST),
Pair(HomeItemListActivity.INTENT_EXTRA_CLUB_ID, ownerId),
Pair(HomeItemListActivity.INDUSTRY_ID, -1)
)
activity?.finish()
}
}
}, "okCool")
So, Now I'm left with finding the solution in iOS,
How can I achieve this on my iOS project? Any help or node toward the correct direction would be great.
In ViewDidLoad() add this
let config = WKWebViewConfiguration()
let contentController = WKUserContentController()
contentController.add(self, name: "function")
config.userContentController = contentController
webView = WKWebView(frame: .zero, configuration: config)
add two methods from WKNavigationDelegate delegate:
func webView(_ webView: WKWebView, decidePolicyFor navigationResponse: WKNavigationResponse, decisionHandler: #escaping (WKNavigationResponsePolicy) -> Void) {
return decisionHandler(.allow)
}
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: #escaping (WKNavigationActionPolicy) -> Void)
{
if navigationAction.navigationType == WKNavigationType.linkActivated, let url = navigationAction.request.url{
DeepLink.deepLink(url.absoluteString)
}
return decisionHandler(.allow)
}
Finally add the most important method to get callback from WKScriptMessageHandler delegate :
func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage){
let dataFromWeb = message.body //Data Passed from webview
}
Pass data from html like this
var myObj = {"name":"John", "age":30, "car":null};
window.webkit.messageHandlers.function.postMessage(myObj);
"function" name should be same in the above statement and when u add userContentController as a config for your webview.
You can use this WebViewJavascriptBridge for sending messages between Obj-C/Swift and JavaScript.
Also you can do it without using any Third Party read this.

WKWebView goBack requiring two invocations

I'm working on a iOS app that uses WKWebView, with custom navigation buttons. We're finding that following some links will require using our Back button twice, as the first invocation seems to just reload the current page. This does not happen in mobile Safari.
What could cause goBack() to need to be called twice to actually navigate back one page, while it works correctly in Safari? Are there changes I can make in the app to correct the issue?
Note: I cannot make changes to the web site's content or structure, so any fixes would have to be in the app.
Update:
It appears the site is using JavaScript for some of its content loads. The observeValue method is not invoked at all when this happens and is probably the culprit.
import UIKit
import WebKit
import SafariServices
class LandingPageViewController: UIViewController, SFSafariViewControllerDelegate, WKUIDelegate, WKNavigationDelegate {
#IBOutlet var urlNavigationItem: UINavigationItem!
#IBOutlet var backButton: UIBarButtonItem!
#IBOutlet var forwardButton: UIBarButtonItem!
#IBOutlet var reloadButton: UIBarButtonItem!
var webView: WKWebView!
override func viewDidLoad() {
super.viewDidLoad()
webView = WKWebView()
view.addSubview(webView)
webView.addObserver(self, forKeyPath: "loading", options: .new, context: nil)
let request = URLRequest(url: url) //url is defined elsewhere
webView.navigationDelegate = self
webView.load(request)
webView.allowsBackForwardNavigationGestures = true
webView.uiDelegate = self
backButton.isEnabled = false
forwardButton.isEnabled = false
}
override func observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) {
if(keyPath == "loading"){
backButton.isEnabled = webView.canGoBack
forwardButton.isEnabled = webView.canGoForward
}
}
#IBAction func back(_ sender: UIBarButtonItem) {
webView.goBack()
}
#IBAction func forward(_ sender: UIBarButtonItem){
webView.goForward()
}
#IBAction func reload(_ sender: UIBarButtonItem) {
let request = URLRequest(url: webView.url!)
webView.load(request)
}
func webView(_ webView: WKWebView,
decidePolicyFor navigationAction: WKNavigationAction,
decisionHandler: #escaping (WKNavigationActionPolicy) -> Void) {
// Custom logic here
}
}
try with following delegate methods,
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: #escaping (WKNavigationActionPolicy) -> Void) {
decisionHandler(.allow)
}
func webView(_ webView: WKWebView, decidePolicyFor navigationResponse: WKNavigationResponse, decisionHandler: #escaping (WKNavigationResponsePolicy) -> Void) {
decisionHandler(.allow)
}
You have implemented one but not call decisionHandler(.allow)
I was facing the same issue. What worked for me was stopping the navigation and then go back.
func goBack() {
self.webView.stopLoading()
if (self.webView.canGoBack) {
self.webView.goBack()
return;
}
}

Allow document upload in input file on WKWebView

I have an html input type="file" upload form on a page loaded through wkwebview, and I'm trying to allow the ability to upload common document files (pdf, docx, etc). Currently I have the ability to take pictures and browse for images, but documents are greyed out and unavailable. I'm a web developer, and swift is greek to me, so any help would be greatly appreciated!
Here is my view controller
import UIKit
import WebKit
import IJProgressView
import FirebaseMessaging
class ViewController: UIViewController, WKNavigationDelegate {
let webView = WKWebView()
var initialstart = true
override func viewDidLoad() {
webView.backgroundColor = UIColor(red:0.17, green:0.24, blue:0.31, alpha:1.0)
webView.isOpaque = false
webView.allowsBackForwardNavigationGestures = true
super.viewDidLoad()
NotificationCenter.default.addObserver(self, selector: #selector(ViewController.receivedUrlFromPushNotification(notification:)), name: NSNotification.Name(rawValue: "ReceivedPushNotification"), object: nil)
// Do any additional setup after loading the view, typically from a nib.
guard let url = URL(string: "https://www.website.com/users/account") else { return};
webView.frame = view.bounds;
webView.navigationDelegate = self;
webView.load(URLRequest(url: url));
webView.autoresizingMask = [.flexibleWidth, .flexibleHeight];
view.addSubview(webView)
}
func receivedUrlFromPushNotification (notification: Notification) {
let notification: [AnyHashable : Any] = notification.userInfo!
let url = URL(string: notification["url"] as! String);
webView.load(URLRequest(url: url!))
}
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: #escaping (WKNavigationActionPolicy) -> Void) {
if navigationAction.navigationType == .linkActivated {
if let url = navigationAction.request.url,
let host = url.host, !host.hasPrefix("www.website.com"),
UIApplication.shared.canOpenURL(url) {
if #available(iOS 10.0, *) {
UIApplication.shared.open(url)
} else {
// Fallback on earlier versions
UIApplication.shared.openURL(url)
}
decisionHandler(.cancel)
} else {
decisionHandler(.allow)
}
} else {
decisionHandler(.allow)
}
}
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
let url = webView.url;
let path = url?.path;
UIApplication.shared.isNetworkActivityIndicatorVisible = false
IJProgressView.shared.hideProgressView()
view.isOpaque = true
}
func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
if (initialstart == true) {
initialstart = false
} else {
UIApplication.shared.isNetworkActivityIndicatorVisible = true
IJProgressView.shared.showProgressView(view)
}
}
}
For OSX, You can try to implement the delegate method
runOpenPanelWithParameters. It is a WKUIDelegate method.
Check the accepted answer for a similar question: Input type=file not working in WebView of OS X application
In my case, after file gets uploaded, the page was getting redirected to the base url.The problem was that I was calling
webview.load(request)
from the viewDidAppear() function.
Moving the call to the viewDidLoad() fixed my problem.
Click here to see more details

WKWebView links not working

I have build a Swift iOS app with the only purpose to display a website with the help of WKWebView.
This works fine, but pressing on links (e.g. on an [mailto:] button) doesn't work because it can't open anything!
Does anybody have a solution for this?
I have read a lot about solving this, but I don't know where to start.
Thanks for the help
[UPDATE: ]
The code below shows the solution
import UIKit
import WebKit
class ViewController: UIViewController, WKNavigationDelegate {
#IBOutlet var containerView : UIView! = nil
var webView: WKWebView?
override func loadView() {
super.loadView()
self.webView = WKWebView()
self.view = self.webView!
}
override func viewDidLoad() {
super.viewDidLoad()
webView?.navigationDelegate = self
let url = NSURL(string:"https://google.de")
let req = NSURLRequest (URL: url!)
self.webView!.loadRequest(req)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
override func prefersStatusBarHidden() -> Bool {
return true
}
func webView(webView: WKWebView, decidePolicyForNavigationAction navigationAction: WKNavigationAction, decisionHandler: (WKNavigationActionPolicy) -> Void) {
let url = navigationAction.request.URL?.absoluteString
let url_elements = url!.componentsSeparatedByString(":")
switch url_elements[0] {
case "mailto":
openCustomApp("mailto://", additional_info: url_elements[1])
decisionHandler(.Cancel)
default:
}
decisionHandler(.Allow)
}
func openCustomApp(urlScheme:String, additional_info:String){
if let requestUrl:NSURL = NSURL(string:"\(urlScheme)"+"\(additional_info)") {
let application:UIApplication = UIApplication.sharedApplication()
if application.canOpenURL(requestUrl) {
application.openURL(requestUrl)
}
}
}
}
You have to implement the following method (part of WebKit), which can be used to parse such URLs:
func webView(webView: WKWebView, decidePolicyForNavigationAction navigationAction: WKNavigationAction, decisionHandler: (WKNavigationActionPolicy) -> Void)
The idea is to write if-statements to check for certain URL types before passing the decision. More info here:
GitHub example
SO thread
Awesome tutorials for beginners with WKWebView at hackingwithswift
Keep in mind that some of the syntax for delegates has changed slightly in Swift 3 - something to keep in mind when using tutorials. If you have already found this but you ran into an error - post your code.
EDIT: just an update for others who stumble upon this question. Keep in mind that you need the right formatting for mailto e.g. mailto://tes#test.com (as mentioned by OhadM in the comments of the OP)

Resources