使用JavaScript访问WKWebView中的本地文件 [英] Access local files in WKWebView using JavaScript

问题描述

我有一个iOS应用，其中一部分逻辑是用 JavaScript 编写的.我创建了一个 WKWebView ，在其中加载我的初始 .js 文件，但是执行该文件时，需要从本地资源中读取其他文件.问题是我缺少实现该目标的概念.

I have an iOS app which part of logic is written in JavaScript. I've created a WKWebView where I load my initial .js file, but when executed, it needs to read from other files from my local resources. The problem is I'm missing a concept of how do I achieve that.

我尝试过将每个单独的文件以 Swift 的方式依次加载到 webView 中，但是手动加载的文件过多.
但是，也许我有一个用于 Swift 的http服务器，该服务器可以访问项目文件.我找到了此或

I've tried loading each separate file one after another in Swift into the webView but it's too many files to load by hand.
I though, maybe there is a http server for Swift that will have an access to project files. And I found solutions like this or this.
An approach looks great but even if I do so, I still can't access files and folders from my Xcode project structure. I've created a basic http server and also a DAV server, added GET handlers, etc.

Maybe I'm doing something wrong with setting it up but at the end when I create an object of http server, I can still access it from my webView at http://192.168.0.11:8080 so for sure it's initialized properly and working.

推荐答案

回答我的问题，以便将来对某人有所帮助.我在最后使用了此库.看起来好像缺少一些配置，因此服务器动态地提供了所有页面和文件.我的代码是:

Answering my question so it helps someone in the future. I've used at the end this library. And it looks like there was some configuration missing so the server serves all the pages and files dynamically. My code is:

guard let websitePath = Bundle.main.path(forResource: "myFolderNameInProjectStructure", ofType: nil) else { return }
let httpServer = GCDWebServer()
httpServer.addGETHandler(forBasePath: "/", directoryPath: websitePath, indexFilename: nil, cacheAge: 3600, allowRangeRequests: true)
httpServer.addHandler(forMethod: "GET", pathRegex: "/.*\\.html", request: GCDWebServerRequest.self) { (request) in
    return GCDWebServerDataResponse(htmlTemplate: websitePath + request.path, variables: ["variable": "value"])
}
httpServer.start(withPort: 8080, bonjourName: "MC Local Server")

完成此配置并且服务器在您选择的端口上运行时(我的服务器是 8080 )，您只需在应用程序内部打开嵌入式浏览器(例如 WKWebView )并加载

When this configuration is done and the server is running on port of your choice (mine is 8080), you simply open up your embedded browser inside the app (e.g. WKWebView) and load

let url = URL(string: "http://localhost:8080/index.html")!
webView.load(URLRequest(url: url))

如果在连接到http服务器的/时始终只想运行 index.html ，则可以在 httpServer.start()之前添加此配置.方法:

If you simply always want to run index.html when connecting to / of the http server, you can add this configuration before httpServer.start() method:

httpServer.addHandler(forMethod: "GET", path: "/", request: GCDWebServerRequest.self) { (request) in
    return GCDWebServerResponse(redirect: URL(string: "index.html")!, permanent: true)
}

现在，在 webView 中，只需连接到 http://localhost:8080 ，您将加载作为 GCDWebServerResponse 给出的文件.

And now in webView just connect to http://localhost:8080 and the file you have given as a GCDWebServerResponse will load.

这篇关于使用JavaScript访问WKWebView中的本地文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！