如何实现Safari式服务器可达性检测？iOS浏览器开发问题

Hey there! 我完全懂你现在的困扰——自己开发的iOS浏览器加载不存在的链接时只会显示空白页，用UIApplication.shared.canOpenURL(url)检测带http://前缀的链接时还总是返回true，想实现Safari那种清晰的错误提示对吧？

首先得帮你理清一个误区：canOpenURL这个方法根本不是用来验证链接是否可访问的，它只是检查系统里有没有能处理这个URL scheme的应用而已。比如只要你的URL带http前缀，系统默认有Safari能处理，所以不管链接存不存在，它都会返回true，这就是为啥你用它检测没用~

要实现类似Safari的错误提示，我们需要主动验证链接是否真的能被访问，下面是具体的实现思路和代码示例：

1. 用URLSession发起轻量请求验证链接有效性 #

我们可以发送一个HEAD请求（只获取响应头，不用下载整个页面内容，效率更高），通过HTTP状态码或者请求错误来判断链接是否有效：

func checkIfURLIsReachable(_ url: URL, completion: @escaping (Bool) -> Void) {
    var request = URLRequest(url: url)
    request.httpMethod = "HEAD" // 仅请求响应头，节省带宽和时间
    request.timeoutInterval = 10 // 设置10秒超时，避免请求挂起
    
    let task = URLSession.shared.dataTask(with: request) { _, response, error in
        // 先处理网络错误、DNS解析失败等情况
        if let error = error {
            print("链接检测失败：\(error.localizedDescription)")
            completion(false)
            return
        }
        
        // 检查HTTP响应状态码，200-399范围内视为有效链接
        if let httpResponse = response as? HTTPURLResponse,
           (200...399).contains(httpResponse.statusCode) {
            completion(true)
        } else {
            completion(false)
        }
    }
    task.resume()
}

2. 在加载网页前调用验证逻辑 #

当用户输入链接后，先做格式校验，再调用上面的验证函数，根据结果决定加载网页还是显示错误提示：

func loadUserInputURL(_ inputString: String) {
    // 先处理用户输入的URL格式：如果没有http/https前缀，自动补上
    var formattedURLString = inputString
    if !formattedURLString.lowercased().starts(with: "http://") && !formattedURLString.lowercased().starts(with: "https://") {
        formattedURLString = "https://\(formattedURLString)"
    }
    
    guard let targetURL = URL(string: formattedURLString) else {
        // 提示用户输入的URL格式不正确
        showAlert(message: "请输入有效的网址")
        return
    }
    
    // 验证链接是否可访问
    checkIfURLIsReachable(targetURL) { [weak self] isReachable in
        DispatchQueue.main.async {
            guard let self = self else { return }
            if isReachable {
                // 加载正常网页
                self.webView.load(URLRequest(url: targetURL))
            } else {
                // 显示自定义错误页面（和Safari风格类似）
                self.displayErrorPage(for: targetURL)
            }
        }
    }
}

3. 实现自定义错误提示页面 #

你可以用HTML字符串加载一个和Safari风格接近的错误页面，比如：

func displayErrorPage(for url: URL) {
    let errorPageHTML = """
    <html>
        <head>
            <style>
                body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; text-align: center; padding: 60px; background-color: #f5f5f7; }
                h1 { font-size: 24px; color: #1d1d1f; margin-bottom: 16px; }
                p { font-size: 16px; color: #86868b; line-height: 1.5; }
            </style>
        </head>
        <body>
            <h1>无法打开此页面</h1>
            <p>无法连接到 \(url.absoluteString)</p>
            <p>请检查网址是否正确，或者确保你的设备已连接到互联网。</p>
        </body>
    </html>
    """
    webView.loadHTMLString(errorPageHTML, baseURL: nil)
}

// 简单的Alert提示函数
func showAlert(message: String) {
    let alert = UIAlertController(title: "提示", message: message, preferredStyle: .alert)
    alert.addAction(UIAlertAction(title: "确定", style: .default))
    present(alert, animated: true)
}

额外注意点 #

• 所有网络请求都在后台线程执行，一定要切回主线程更新UI，不然会导致崩溃。
• 可以根据不同的错误类型（比如404、500、无网络）定制不同的提示文案，让错误信息更精准。
• 如果你的浏览器支持自动跳转，记得在验证时考虑重定向的情况（HTTPURLResponse的allHeaderFields里可以获取重定向地址）。

这样就能实现和Safari类似的错误提示效果啦！

内容的提问来源于stack exchange，提问作者Quintus