Javascript 在 WebView 活动中不起作用答案

【问题标题】：Javascript not working in a WebView ActivityJavascript 在 WebView 活动中不起作用
【发布时间】：2020-10-26 06:27:29
【问题描述】：

我有一个只有一个 WebView 的 Activity，其中包含 HTML、CSS 和 Javascript 代码。

Javascript对视图的屏幕尺寸的访问似乎有问题。 LogCat 说：

(Tag: Web Console): Uncaught TypeError: Cannot call method 'getWidth' of undefined 
at file:///android_asset/Prospekte/grund/html5-player/js/epaper-mobile.js:20

当我查看 js 文件时，有：var f=this.body.getWidth();

奇怪的是有时代码会起作用。电子纸显示得很好。但大多数时候都会出现这个错误。

    setContentView(R.layout.prospekt_layout);
    final Activity activity = this;

    mWebView = (WebView) findViewById(R.id.prospekt_webview);
    mWebView.getSettings().setJavaScriptEnabled(true);
    mWebView.getSettings().setDomStorageEnabled(true);
    mWebView.setWebChromeClient(new WebChromeClient() {
    public void onProgressChanged(WebView view, int progress) {
        activity.setProgress(progress * 1000);
      }
    });

    mWebView.setWebViewClient(new WebViewClient() {
        @Override
        public void onReceivedError(WebView view, int errorCode, String description, String failingUrl)
        {
            // Handle the error
        }

        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url)
        {
            view.loadUrl(url);
            return true;
        }
    });   

    mWebView.loadUrl("file:///android_asset/Prospekte/modKachel/mobile.html");

布局是：

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    >
<WebView
    android:id="@+id/prospekt_webview"
    android:layout_width="900px"
    android:layout_height="900px"
/>
</LinearLayout>

我更改了 webView 的大小，因为我认为这可能是解决方案..但它也不适用于 dp。

有人有想法吗？

【问题讨论】：

标签： javascript android webview

【解决方案1】：

也为您的 webView 设置此设置：

WebSettings settings = webView.getSettings();
settings.setDomStorageEnabled(true);

详情请参考以下链接中的答案： ERROR/Web Console: Uncaught TypeError: Cannot call method 'getItem' of null at http://m.youtube.com/:844

更新： 或添加这可能会有所帮助：

webView.loadDataWithBaseURL("fake://fake.com", myString, "text/html", "UTF-8", null);

【讨论】：

谢谢，但我已经尝试过了。我的错误是我在代码中删除了它。所以当我测试这个时，第一次它有效，第二次它没有。有没有可能是时间有问题？也许 DOM 的构建速度不够快？我尝试了 AsyncTask，但这也没有帮助。
好吧，不能说时间问题等等。
谢谢，向前迈了一步：当我将第一个 HTML 代码粘贴到“myString”中时，该代码有效。但是现在，我有了另一个 HTML 代码，它的工作原理应该和之前的差不多。但是有一个脚本在禁用 Javascript 时显示：“请激活 javascript”。 HTML 代码不是我写的，仅供参考。我可以启用更多的 Javascript 设置吗？
是的！你是对的..DOM 比其他可用的解析器慢。
这取决于您的要求。您绝对可以在 JSON 而不是 DOM 中接收相同的数据......但我直到现在还没有真正转换它。所以我不知道该怎么做。但这是可行的。如果你会写 DOM，你也可以写 JSON……

【解决方案2】：

您应该在 WebView 中隐式启用 Javascript 执行，因为这可能会导致 XSS 和其他漏洞。

web = new WebView(this);
web.getSettings().setJavaScriptEnabled(true);

另外，我更喜欢通过

设置我的 WebViewClient

WebViewClient webViewMainWebClient = new WebViewClient()
{
   // Override page so it's load on my view only
   @Override
   public boolean shouldOverrideUrlLoading(WebView  view, String  url)
   {
       // Return true to override url loading (In this case do nothing).
       return false;
   }
}
web.setWebViewClient(this.webViewMainWebClient);

让我限制仅使用我的网站。

【讨论】：

【解决方案3】：

在 android 3.2 上遇到了同样的问题。一个对我有用的解决方案（非常丑陋）是休眠并调用另一个 loadUrl，如果 300 毫秒还不够，请尝试更多时间：

myWebView.loadUrl("file:///android_asset/gabarit.html");
try {
    Thread.sleep(300);
} catch (InterruptedException e) {
    // TODO Auto-generated catch block
    e.printStackTrace();
}
myWebView.loadUrl("file:///android_asset/gabarit.html");

【讨论】：

【解决方案4】：

我的 Mo Da 浏览器项目也遇到了同样的问题。我添加了这两行：

    wvOptions.setBuiltInZoomControls(true);
    wvOptions.setUseWideViewPort(true);

wvOptions 只是 webview.getSettings() 存储在 var 中。第二行似乎已经解决了这个问题。第一行让用户可以控制生成的网页的大小。如果您喜欢结果，可以添加“在概览中打开”选项。这对我没有帮助，所以我使用了缩放选项。

【讨论】：

+1 OMG 这两行让我很开心。我的 HTML 和 CSS 正确呈现，但 JS 一直在加载。我添加了这两行：wvOptions.setBuiltInZoomControls(true); 和 wvOptions.setUseWideViewPort(true);，它现在正在工作。谢谢

【解决方案5】：

这可能会解决您的问题。您可能错误地将 HTML 代码中的脚本标签命名为 <scripts> 而不是 <script>，因为您是在 android studio 中开发的。

【讨论】：