【问题标题】：Android Webview - Uncaught ReferenceError in local javascript executionAndroid Webview - 本地 javascript 执行中未捕获的 ReferenceError
【发布时间】：2019-01-27 03:47:07
【问题描述】：

大家好，感谢您的帮助！

我想构建一个 Android Webview 应用程序，它使用 HTML + CSS + javascript，除了 highcharts 之外没有其他库。当我尝试使用服务器上的文件时，它可以很好地跨浏览器运行。

我希望在本地客户端运行尽可能多的文件：HTML、CSS、所有资产（图像）和 javascript 代码都在应用程序中，只在服务器上留下 php 文件（登录、登录等） .).

不幸的是，当我在 Android 上试用我的应用程序时，我的 javascript 函数定义出现错误，例如： 12-27 10:04:42.075 17798-17798/com.wifcompanion.wifcompanion D/WiFCompanionConsole: 未捕获 ReferenceError: BodyReset 未定义 -- 来自 file:///android_asset/wifmobile.html 的第 22 行

我的第一个直觉是 .js 文件没有正确加载。所以我把所有的js代码直接放在wifmobile.html中的tag下。无济于事。

此外，似乎找到了一些函数（例如当我单击首页登录按钮时的 NewSignIn()），而其他函数则没有（例如 PopupSave()，这是在 NewSignIn() 中调用的函数)。

我可以在 stackoverflow 上找到的最接近的问题在这里，但没有任何答案： JavaScript not working with android WebView, Uncaught ReferenceError

主活动：

package com.wifcompanion.wifcompanion;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.annotation.TargetApi;
import android.util.Log;
import android.webkit.ConsoleMessage;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends AppCompatActivity {
private WebView m_webview = null;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    // Load layout
    setContentView(R.layout.activity_main);

    // Create WebView
    m_webview = new WebView(this);

    // Add WebView to Activity
    m_webview = (WebView) findViewById(R.id.webviewWIF);
    m_webview.setWebChromeClient(new WebChromeClient());
    m_webview.loadUrl("file:///android_asset/wifmobile.html");

    //Logcat and console
    m_webview.setWebChromeClient(new WebChromeClient() {
        public boolean onConsoleMessage(ConsoleMessage cm) {
            Log.d("WiFCompanionConsole", cm.message() + " -- From line "
                    + cm.lineNumber() + " of "
                    + cm.sourceId() );
            return true;
        }
    });


    // Reload the old WebView content
    if (savedInstanceState != null) {
        m_webview.restoreState(savedInstanceState);
    }
    // Create the WebView
    else {
        m_webview.getSettings().setJavaScriptEnabled(true);
        int currentapiVersion = android.os.Build.VERSION.SDK_INT;
        if (currentapiVersion >= android.os.Build.VERSION_CODES.JELLY_BEAN) {
            fixNewAndroid(m_webview);
        }
    }
}

// Save the state of the web view when the screen is rotated.
@Override
protected void onSaveInstanceState(Bundle outState) {
    super.onSaveInstanceState(outState);
    m_webview.saveState(outState);
}

@TargetApi(16)
protected void fixNewAndroid(WebView webView) {
    try {
        webView.getSettings().setAllowUniversalAccessFromFileURLs(true);
    } catch (NullPointerException e) {
    }
}

}

wifmobile.html

<!DOCTYPE html>
<html>
<head>
<!-- Title -->
<title>World in Flames Companion</title>

<!-- Include meta tag to ensure proper rendering and touch zooming -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="manifest" href="manifest.json">
<!-- icon -->
<link rel="icon" href="img/icon/favicon.ico" />
<link rel="icon" type="image/png" href="img/icon/wiflogo48.png" />
<!-- jQuery library -->
<!--<script src="js/jquery-1.11.1.min.js"></script>-->
<!-- Highharts -->
<script src="https://code.highcharts.com/highcharts.js"></script>
<!-- WIF scripts -->
<script src="solifnav.js"></script>
<script src="solif.js"></script>
<script src="soliffal.js"></script>
<script src="solifsetup.js"></script>
<script src="solifpartisans.js"></script> 
<script src="solifflow.js"></script>
<script src="solifcards.js"></script>
<script src="solifdiplo.js"></script>
<script src="solifbenefits.js"></script>
<script src="solifvichy.js"></script>
<script src="solifinternal.js"></script>
<script src="solifgamemanagement.js"></script>
<script src="solifbuild.js"></script>
<script src="solifhelper.js"></script>
<script src="solifdatabase.js"></script>
<script src="solifintel.js"></script>
<script src="solifstats.js"></script>
<script src="solifcivilwar.js"></script>
<script src="solifvp.js"></script>
<!-- Scenario specifics -->
<script src="solifscenario4.js"></script>
<!-- Stylehseet -->
<link rel="stylesheet" href="wifmobile.css">
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css?family=Anton|Russo+One|Fanwood+Text|UnifrakturCook:700" rel="stylesheet">
</head>
<body onclick="BodyReset(event);" onkeydown="BodyKeydown(event);">
<!-- Login / registration / forgotpassword page-->                                      
<div id="signin">
<div class="banner"><img src="img/icon/wiflogo.png" style="max-width:75%;" /></div>
<div id="login">
<input type="text" name="login-username" id="login-username" placeholder="User name" autocomplete="username">
<input type="password" name="login-password" id="login-password" placeholder="Password" autocomplete="current-password">
<a onclick="NewSignIn();" id="NewSignInButton">Login</a>
<a onclick="GotoRegister();" class="things">&gt;&gt; Register</a>
<a onclick="GotoForgot();" class="things">&gt;&gt; Forgot your password?</a>
</div>
</div>
</body>
</html>`

【问题讨论】：

标签： javascript android-activity android-webview

【解决方案1】：

这绝对是 javascript 代码中的错误。也就是说，由于我使用的是旧设备（平板电脑必须是 2010 年初的），所以 webview 不符合 Javascript ECMAScript 6。相反，您应该确保您的代码符合 Javascript ECMAScript 5。

这包括（这些是我在代码中发现的主要错误）：

1) 不要在函数中使用默认参数声明。而不是：

    function myFunction(myParam='hello'){
        ...
    }

用途：

    function myFunction(myParam){
        myParam=myParam || 'hello';
        ...
    }

2) 您的函数不应与 html 中的 id 保持相同的“名称”（区分大小写）。例如不要这样做：

    <a id="MyLink" onclick="MyLink();">My link</a>

但是这样做：

    <a id="MyLink" onclick="myLink();">My link</a>

3) 如果您像我一样不是一个该死的专业人士，请准备好测试您的代码的每一行，因为即使是一些像 console.clear() 这样简单的东西也不符合要求。

当我发现一些更明显的错误时，我将编辑这篇文章。

【讨论】：