在WKWebView中加载本地Web文件和资源

Question

与UIWebView和以前版本的WKWebView（iOS 10和macOS 10.12）不同，本地文件的默认加载操作已从Bundle.main.path移至Bundle.main.url。同样，loadFileURL也成为在WKWebView中加载本地资源的默认函数。

我知道.path和.url完全不同，并且在过去都有效 - .path历来是默认选择的方法;然而，似乎最新版本的Swift打破了大多数（如果不是全部）.path解决方案。 .path解决方案似乎现在扁平化目录层次结构，将所有CSS，JS和任何其他子目录内容放入一个大目录中。当WKWebView尝试加载index.html时，这会导致加载错误，例如，使用链接的子文件夹样式表（即./css/style.css）。

看到无数问题和无数不确定/破碎的答案匹配后，是否有一个快速无痛的解决方案来实现可以加载本地资源（包括链接的CSS / JS文件）的WKWebView，而无需任何解决方法？

Answer 1

更新了Swift 4，Xcode 9.3

---

此方法允许WKWebView正确读取链接的CSS，JS和大多数其他文件的目录和子目录的层次结构。您无需更改HTML，CSS或JS代码。

Solution (Quick)

1. 将Web文件夹添加到项目中（“文件”>“将文件添加到项目”） 如果需要，复制项目 创建文件夹引用* 添加到目标（适用）
2. 将以下代码添加到viewDidLoad并根据您的需求进行个性化设置：

   let url = Bundle.main.url(forResource: "index", withExtension: "html", subdirectory: "website")!
   webView.loadFileURL(url, allowingReadAccessTo: url)
   let request = URLRequest(url: url)
   webView.load(request)

---

Solution (In-Depth)

步骤1

将本地Web文件的文件夹导入到项目中的任何位置。确保你：

☑️如果需要，复制项目

☑️创建文件夹引用（不是“创建组”）

☑️添加到目标

第2步

使用WKWebView转到View Controller，并将以下代码添加到viewDidLoad方法：

let url = Bundle.main.url(forResource: "index", withExtension: "html", subdirectory: "website")!
webView.loadFileURL(url, allowingReadAccessTo: url)
let request = URLRequest(url: url)
webView.load(request)

• index - 要加载的文件的名称（没有.html扩展名）
• website - 您的网络文件夹的名称（index.html应位于此目录的根目录下）

结论

整体代码应如下所示：

import UIKit
import WebKit

class ViewController: UIViewController, WKUIDelegate, WKNavigationDelegate {

    @IBOutlet weak var webView: WKWebView!

    override func viewDidLoad() {
        super.viewDidLoad()

        webView.uiDelegate = self
        webView.navigationDelegate = self

        let url = Bundle.main.url(forResource: "index", withExtension: "html", subdirectory: "Website")!
        webView.loadFileURL(url, allowingReadAccessTo: url)
        let request = URLRequest(url: url)
        webView.load(request)
    }

}

如果您有任何关于此方法或代码的问题，我会尽力回答！