在 WebView 中加载 HTML（并且 Javascript 源未正确加载）- Swift

Question

我目前正在尝试在网络视图中呈现 sheet 音乐 HTML（我使用 javascript 库生成）。这是我的代码：

ViewController.swift（部分）：

let web = WKWebView()
let localfilePath = NSBundle.mainBundle().URLForResource("index", withExtension: "html")
let myRequest = NSURLRequest(URL: localfilePath!)
web.loadRequest(myRequest)

index.html:

<html>
<script src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.js"></script>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="http://www.vexflow.com/support/vexflow-min.js"></script>
<script src="http://www.vexflow.com/support/tabdiv-debug.js"></script>
<body>
    <h1 id="someElement"> Test </h1>
    <div style="width:680; margin-left: auto; margin-right: auto;">
        <div class="vex-tabdiv">
            options width= 700 space=20
            tabstave notation=true key=A time=4/4
            notes :q =|: (5/2.5/3.7/4) :8 7-5h6/3 ^3^ 5h6-7/5 ^3^ :q 7V/4 |
            notes :8 t12p7/4 s5s3/4 :8 3s:16:5-7/5 :h p5/4
            text :w, |#segno, ,|, :hd, , #tr
        </div>
    </div>
</body>
</html>

虽然 HTML 确实加载了，但未正确呈现。如果我在 Chrome 中渲染这个 HTML，它将看起来像这样：

然而，当我在我的网络视图中尝试运行它时，我得到：

如您所见，HTML 是在没有 JS 的情况下呈现的。我研究了 Google/SO 并尝试了各种方法，例如将 JS 文件制作为本地文件并将它们导入为

<script src="lodash.js"></script>

以及使用 WKWebView 的 executeJavascript 函数无济于事，但我一定是遗漏了一些东西.. 非常感谢！

Answer 1

原因可能是在 div 渲染时正在加载 js 文件。可以将外部的js文件保存到本地，并引用这些本地文件。它对我有用。

Answer 2

我弄清楚了这个问题，它与两个主要问题有关：

将资产文件（js、css 等）设为本地。如 Huy 所述，存在处理 CDN 的问题
我的 vexflow 设置有问题。 div 中的换行符是必需的，否则将不起作用。
如果您使用的是 vexflow，请确保在导入 vexflow-min.js 之前导入 vextab.js

希望这对以后的其他人有所帮助！ :)

在 WebView 中加载 HTML（并且 Javascript 源未正确加载）- Swift

Loading HTML in a WebView (and the Javascript Sources not Loading Properly) - Swift

html

javascript

uiwebview

swift

wkwebview