WKWebView nicht laden von Ressourcen aus dem lokalen Dokument-Ordner

In meine Swift-iOS-app, die ich herunterladen möchten einige dynamische HTML-Seiten von einem remote-server, speichern Sie Sie in das Verzeichnis Dokumente, und zeigen Sie die Seiten von Dokument-Verzeichnis.

Ich war mit diesem, die Seite zu laden:

var appWebView:WKWebView?
...
appWebView!.loadRequest(NSURLRequest(URL: NSURL(fileURLWithPath: htmlPath)))

Alles funktioniert auf dem simulator, aber wenn ich wechselte zu real-Handys, es zeigte einfach eine leere Seite. Ich habe dann mit der app verbunden, die mit Safari, und fand es klagte mit "Failed to load resource".

Dann habe ich versucht, Lesen Sie zunächst den Inhalt der Seite an htmlPathdann verwenden Sie

appWebView!.loadHTMLString()

die Seite zu laden. Es funktioniert nur, wenn die HTML-Seite ist einfach. Aber wenn der HTML-Referenzen etwas anderes, etwa eine JavaScript-Datei auch in das Dokumenten-Verzeichnis (mit einem absoluten Pfad wie <script src="file:////var/mobile/Containers/Data/Application/762035C9-2BF2-4CDD-B5B1-574A0E2B0728/Documents/xxxxx.js">), wird es nicht geladen.

Weiß jemand, warum dies geschieht, und wie das Problem zu beheben?

Mehr info:

XCode-version: 7.3.1
Bereitstellung Ziel: 8.1 (ich habe versucht, auf 9.3 zu, aber das hat nicht geholfen.)

InformationsquelleAutor der Frage Peter | 2016-09-05

Dies ist eine vereinfachte version von dem, was ich zum laden von lokalen Dateien in ein Projekt von mir (iOS 10, Swift-3). Ich habe gerade aktualisiert mein code (7.5.2017) nach dem Test wieder auf iOS 10.3.1 und das iPhone 7+ auf Anfrage von Raghuram und Fox5150 in die Kommentare.

Ich gerade erstellt ein komplett neues Projekt und das ist die Ordner Struktur: WKWebView nicht laden von Ressourcen aus dem lokalen Dokument-Ordner

Update 19.04.2018: neue Funktion Hinzugefügt, um den download ein .zip mit HTML -, CSS -, JS-Dateien, entpacken Sie es in /Dokumente/(Alamofire + Zip) und laden Sie dann diese Dateien in das webView. Sie können es finden in der GitHub-Beispiel-Projekt als gut. Nochmals, fühlen Sie sich frei, um Gabel & Sterne! 🙂

Update 08.02.2018: schließlich Hinzugefügt ein GitHub-Beispiel-Projektdie auch eine lokale JavaScript-Datei. Fühlen Sie sich frei, um Gabel & Sterne! 🙂

Version 1 mit webView.loadFileURL()

ViewController.swift

import UIKit
import WebKit
class ViewController: UIViewController, WKNavigationDelegate {
    override func viewDidLoad() {
        super.viewDidLoad()
        let webView = WKWebView()
        let htmlPath = Bundle.main.path(forResource: "index", ofType: "html")
        let htmlUrl = URL(fileURLWithPath: htmlPath!, isDirectory: false)
        webView.loadFileURL(htmlUrl, allowingReadAccessTo: htmlUrl)
        webView.navigationDelegate = self
        view = webView
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

Version 2 mit webView.loadHTMLString()

ViewController.swift

import UIKit
import WebKit
class ViewController: UIViewController, WKNavigationDelegate {
    override func viewDidLoad() {
        super.viewDidLoad()
        let webView = WKWebView()
        let htmlPath = Bundle.main.path(forResource: "index", ofType: "html")
        let folderPath = Bundle.main.bundlePath
        let baseUrl = URL(fileURLWithPath: folderPath, isDirectory: true)
        do {
            let htmlString = try NSString(contentsOfFile: htmlPath!, encoding: String.Encoding.utf8.rawValue)
             webView.loadHTMLString(htmlString as String, baseURL: baseUrl)
        } catch {
            //catch error
        }
        webView.navigationDelegate = self
        view = webView
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

Fallstricke zu achten ist:

Stellen Sie sicher, dass Ihre lokalen html/js/css-Dateien im Projekt -> Ziel -> Build-Phasen -> Copy Bundle Resources
Stellen Sie sicher, dass Ihre html-Dateien nicht relative Pfade z.B. css/styles.css weil iOS wird glätten Ihre Datei-Struktur und-Stile.css wird auf der gleichen Ebene wie index.html so schreiben <link type="text/css" href="styles.css"> statt

Angesichts der 2 Versionen und die Punkte hier sind meine html/css Dateien aus dem Projekt:

web/index.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
    <title>Offline WebKit</title>
    <link rel="stylesheet" type="text/css" href="styles.css">
  </head>
  <body>
    <h1 id="webkit-h1">Offline WebKit!</h1>
  </body>
</html>

web/css/styles.css

#webkit-h1 {
  font-size: 80px;
  color: lightblue;
}

Wenn jemand will, einen GitHub-Beispiel-Projekt, sagen Sie mir, in den Kommentaren und ich werde es hochladen.

InformationsquelleAutor der Antwort tech4242

5

Swift 4-Methode

Diese Methode ermöglicht die WKWebView richtig zu Lesen, Ihre Hierarchie von Verzeichnissen und Unterverzeichnissen für die verknüpften CSS - /JS-Dateien. Sie NICHT brauchen, um Ihre HTML -, CSS-oder JS-code.

Aktualisiert Xcode 9.3

Schritt 1

Importieren den Ordner mit den lokalen web-Dateien in Ihr Projekt. Stellen Sie sicher, dass Sie:

☑️ Elemente kopieren, wenn nötig

☑️ Erstellen Ordner Verweise (nicht "Gruppen Erstellen")

☑️ Hinzufügen, um Ziele

Schritt 2

Gehen Sie auf den View-Controller mit dem WKWebView und fügen Sie den folgenden code, um die viewDidLoad Methode:
```
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 – der name der Datei zu laden (ohne den .html Erweiterung)
- website – den Namen der web-Ordner (index.html sollte an der Wurzel dieses Verzeichnisses)
Abschluss

Der gesamte code sollte wie folgt Aussehen:
```
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)
    }

}
```
Wenn jemand von Euch weitere Fragen zu dieser Methode oder den code, ich werde mein bestes tun Sie zu beantworten. 🙂

InformationsquelleAutor der Antwort Matt Swift
2

Diese Lösung hat mir geholfen:
```
[configuration.preferences setValue:@YES forKey:@"allowFileAccessFromFileURLs"];
```
InformationsquelleAutor der Antwort Christian Anchor Dampf

Dies funktioniert gut (Swift 3, Xcode 8):

import UIKit
import WebKit

class ViewController: UIViewController, WKNavigationDelegate {

    var webView: WKWebView!

    override func loadView() {
        webView = WKWebView()
        webView.navigationDelegate = self
        view = webView
    }

    override func viewDidLoad() {
        super.viewDidLoad()
        if let url = Bundle.main.url(forResource: "file", withExtension: "txt")
        {
            do
            {
                let contents = try String(contentsOfFile: url.path)
                webView.loadHTMLString(contents, baseURL: url.deletingLastPathComponent())
            }
            catch
            {
                print("Could not load the HTML string.")
            }
        }
    }
}

InformationsquelleAutor der Antwort hkdalex

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.

Version 1 mit webView.loadFileURL()

Version 2 mit webView.loadHTMLString()

Swift 4-Methode

Schritt 1

Schritt 2

Abschluss