安卓Webview加载HTML时遇到Javascript问题

Question

我已经为此问题奋战了超过48小时，但无论在网络上寻找答案都没有结果。以下是设置步骤：

我的Android应用程序在第一次运行时下载内容（内容超过20MB），并将文件解压缩到用户的SD卡上，路径为/mnt/sdcard/{my package}/folder。内容包括HTML文件、CSS文件、JS文件和图像。以下是写入SD卡的完整结构（其中/ = /mnt/sdcard/{my package}/folder/）：/content/

a.html
b.html
images/
  image1.jpg

/css/

c.css
d.css

/js/

e.js
f.js

这是我从SD卡加载HTML文件的代码：

    webView = (WebView) findViewById(R.id.pageBrowser);
    webView.getSettings().setJavaScriptEnabled(true);
    webView.addJavascriptInterface(new LinkHandlerInterface(), "Android");
    webView.setWebViewClient(new PageWebViewClient());

    // contentLocation + url is equal to the full path to the html file
    webView.loadUrl("file://" + contentLocation + url);

这段代码成功加载了HTML页面。目前还没有出现问题。每个页面都有以下头部标签：

    <link rel="stylesheet" type="text/css" href="../css/screen.css" media="all" />
    <link rel="stylesheet" type="text/css" href="../css/inPractice.css" media="all" />
    <link rel="stylesheet" type="text/css" href="../css/inPracticeScheme.css" media="all" />
    <link rel="stylesheet" type="text/css" href="../css/mobile/iPad.css" media="all" />
    <script type="text/javascript" src="../js/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="../js/inPractice-utilities.js"></script>
    <script type="text/javascript" src="../js/inPractice.js"></script>
    <script type="text/javascript" src="../js/mobile/inpractice.ipad.js"></script>

这里出现了问题。我的WebView可以很好地呈现HTML，甚至可以完美加载和应用CSS，但它拒绝加载和执行Javascript。如果您还记得上面的内容，js文件夹实际上是在html文件的一级上，因此指向了正确的位置。

以下是我所知道的内容列表：

- 我正在使用的CSS被正确应用，因此我知道问题不在于文件位置。 - 我之前使用过相同的代码，但是从应用程序的资产文件夹（file:///android_assets/...）加载文件，并且可以完美工作。由于内容太大，我无法将其捆绑到应用程序中，因此移动到SD卡上。 - 如果我更改HTML文件，使所有Javascript方法都列在script标签内，它可以正常工作。我无法永久更改HTML，因此无法应用此更改。这告诉我WebView没有问题执行Javascript。 - 图像可以正常加载。

我现在没有任何想法。有人知道为什么我的WebView无法加载Javascript文件吗？有人以前见过这种情况吗？

编辑：这里是我正在尝试使用的JS文件，可以在此处查看：

http://www.automatastudios.com/clients/cco/inpractice/css/inPractice.css http://www.automatastudios.com/clients/cco/inpractice/css/inPracticeScheme.css http://www.automatastudios.com/clients/cco/inpractice/css/screen.css http://www.automatastudios.com/clients/cco/inpractice/css/mobile/iPad.css

• 注意：这些CSS文件不是我编写的。

- Keenan

---

我想知道这是否最终会成为一个问题，即Android不允许从SD卡中执行JS在WebView中执行？ - Keenan

Answer 1

我从未能找到解决方法。

最终我只是编辑了HTML文件，将JavaScript源文件更改为内联JavaScript。这起作用了（正如我所预期的那样）。

- Keenan

Answer 2

加载引用了 JavaScript 和 CSS 的 HTML 文件的首选方法是使用

webView.loadDataWithBaseURL()

我们需要将包含html，js和css文件的根目录作为baseURL传递给文件系统。要注意的重要事项是，我们只能使用“file”方案URL。

在您的情况下代码应该是：

    String html = readFileAsString(
       new FileInputStream("file://" + contentLocation + url) );
webView.loadDataWithBaseURL("file://" + contentLocation,html,"text/html","utf-8",null);


public static StringBuffer streamToString(InputStream stream ){

        StringBuffer fileContent = new StringBuffer("");
        try {

            int size = stream.available();
            byte[] buffer = new byte[size];
            int length;
            while ((length = stream.read(buffer)) != -1) {
                fileContent.append(new String(buffer));
            }
            stream.close();
        } catch (IOException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
            try {
                stream.close();
            } catch (IOException e1) {
                // TODO Auto-generated catch block
                e1.printStackTrace();
            }
        }

        return fileContent;
    }

希望这个答案能够帮助未来的访问者。

附注： 以上代码片段未经编译。

- Jeevan