Android WebView 在加载 html 之前注入 Javascript

Question

我正在使用 Android WebView 加载一些网页。我需要在所有页面加载之前插入一段 Javascript 代码。

我正在尝试将它们注入到 WebViewClient onPageStart 回调中。

mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.setWebViewClient(new WebViewClient(){

    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        loadUrl("javascript:var output='test string';");
        }
})

mWebView.loadUrl("xxx.html");

HTML 代码：

<html>
<script>document.write(output);</script>
</html>

我希望我的 Js 代码在 HTML 之前加载。但有时 JS 代码加载在 HTML 之后。

有什么办法可以解决我的问题吗？

Answer 1

我遇到了同样的问题，我解决了。我在加载前隐藏WebView 并在页面加载后显示。

webView.getSettings().setJavaScriptEnabled(true);
b.webView.setWebViewClient(new WebViewClient() {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        return false;
    }

    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        super.onPageStarted(view, url, favicon);
    }

    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            b.webView.evaluateJavascript("javascript:window.document.getElementsByTagName('body')[0].style.color='white';", null);
        }
        else
        {
            b.webView.loadUrl("javascript:window.document.getElementsByTagName('body')[0].style.color='white';");
        }
        b.webView.setVisibility(View.VISIBLE);
    }

});

b.webView.setVisibility(View.INVISIBLE);
b.webView.loadUrl(PreferenceHelper.EULA_URL);

Answer 2

如何通过 javascript 加载您的页面？

在您的资产中创建一个空白 html 页面，其中包括您的脚本和这个小功能（为了简单起见，我在这里使用 jquery，但您可以使用其他框架或根本不使用框架）。

window.loadPage = function (url) {
    $.get(url, function(page) {
        $('html').replace(page);
    });
};

然后，在你的安卓应用上：

mWebView.loadUrl("javascript: loadPage('xxx.html')");

注意：我没有注意到 xxx.html 也可能在您的资产中，而不是在某处的 Web 服务器中，在这种情况下，出于安全原因，ajax 查询将失败，但您可以忘记 ajax 请求，请阅读 html从您的 android 应用程序中的 String 中的页面，并将其作为参数传递给稍作修改的 javascript 函数。

Answer 3

我必须和你做同样的事情，因为在我的例子中，网页的加载取决于需要通过 JavaScript 从应用程序设置的一些变量。

在页面加载之前尝试了加载 javascript 的所有不同排列后，这最终对我有用：

webView.loadUrl(url)
webView.settings.javaScriptEnabled = true
webView.settings.javaScriptCanOpenWindowsAutomatically = true

val javascript = "alert('some javascript message');window.JAVASCRIPT_GLOBAL_VARIABLE=true;"

webView.webViewClient = object : WebViewClient() {
    override fun onLoadResource(view: WebView?, url: String?) {
         super.onLoadResource(view, url)
         webView.evaluateJavascript(javascript) {}
    }    
}

如果您需要您的 javascript 注入变量或方法在 Web 视图加载时可用 - 例如，为了验证用户身份，我还必须将以下内容添加到 javascript 代码中以使其每次都能可靠地工作打开网络视图。

window.location.replace('$url'); \\ this is the same url you want to inject the javascript into

仅当您想要/可以在 Javascript 方法中附加一些前缀时，使用 addJavascriptInterface 才有效。就我而言，这不是一个选择，因为相同的代码也适用于 iOS。

Answer 4

您可以像这样在页面加载之前注入您的 javascript：

  val mimeType = "text/html"
  val encoding = "utf-8"
  val injection = "<script type='text/javascript'>
        //Your JavaScript code here

       //**This line is important**
        window.location.replace('ACTUAL_URL');</script>"
  webView.loadDataWithBaseURL('ANY_DUMMY_URL', injection, mimeType, encoding, null)

ACTUAL_URL 应该是您实际要加载的 URL。 DUMMY_URL 可以是任何 URL，最好和 ACTUAL_URL 保持一致。

Answer 5

一种方法，也许不是最简单的，是使用一个HttpClient自己从web服务器读取数据，然后修改它并使用它设置到webview中

webview.loadData(mydata, "text/html", null);

Answer 6

我会结合使用 Phonegap 和 JavaScript 接口。

在主 .java 文件的 OnCreate() 中，包含以下内容：

super.appView.addJavascriptInterface(new Object()
        {
          public void setOutput()
          {
            // here the body of your method in Android
          }
        }, "myInterface");

然后，在 .js 文件中，包含以下内容（显然，您必须在同一个文件中导入 Phonegap 才能捕获 onDeviceReady 方法）：

function onDeviceReady() {
        myInterface.setOutput();
      }

这将在设备准备就绪时，在应用程序启动的第一刻，从 JavaScript 触发您的方法。

Answer 7

您可以尝试将您的 java 脚本放在 html 页面中，然后使用 android java script 函数调用可能会有所帮助

Answer 8

您可以使用
webView.addJavascriptInterface("test string", "output");
在网页加载之前注入你想要的对象。