java - 在 WebView Android 中扫描条码

Question

我试图在用户按下 html 中的按钮时启动条形码扫描器。但是我收到一个错误:

Uncaught TypeError: Object [object Object] has no method 'scanBarcode'", source: file:///android_asset/www/index.html (49)

在 javascript 中被调用的是:

function scanner(){ 
        Android.scanBarcode();
    }

现在在 Java 文件中我有以下代码，它在public class JavaScriptInterface

中声明函数

这是我的 MainActivity.java 文件:

public class MainActivity extends Activity {
@SuppressWarnings("deprecation")
@SuppressLint("SetJavaScriptEnabled") @Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    requestWindowFeature(Window.FEATURE_NO_TITLE);
    setContentView(R.layout.activity_main);
    WebView myWebView = (WebView)findViewById(R.id.webView);
    myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
    myWebView.setInitialScale(1);
    WebSettings webSettings = myWebView.getSettings();
    webSettings.setJavaScriptEnabled(true);

    webSettings.setBuiltInZoomControls(false);
    webSettings.setSupportZoom(true);
    webSettings.setJavaScriptEnabled(true);
    webSettings.setLoadWithOverviewMode(true);
    webSettings.setUseWideViewPort(true);
    //webView.getSettings().setJavaScriptEnabled(true);
    myWebView.setWebChromeClient(new WebChromeClient());
    //myWebView.setWebViewClient(new WebViewClient());
    myWebView.loadUrl("file:///android_asset/www/index.html");
}

public class JavaScriptInterface {
    Context mContext;

    // Instantiate the interface and set the context
    JavaScriptInterface(Context c) {
        mContext = c;
    }

    // using Javascript to call the finish activity
    public void closeMyActivity() {
        finish();
    }

    public void scanBarcode() {
        Intent intent = new Intent("com.google.zxing.client.android.SCAN");
        intent.setPackage("com.google.zxing.client.android");
        startActivityForResult(intent, 0);
    }
}   //JavascriptInterface

public void onActivityResult(int requestCode, int resultCode, Intent intent) {
    if (requestCode == 0) {
        if (resultCode == RESULT_OK) {
            //here is where you get your result
            String barcode = intent.getStringExtra("SCAN_RESULT");
        }
    }
}

现在这是我在网上找到的代码示例，对我来说一切都很好，我最初唯一要做的就是导入所有必要的库，并将 barcode 变量定义为是字符串类型。

任何帮助将不胜感激..或者可能是从 WebView 访问条码扫描器功能的不同方法..

Answer 1

...
    myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
...
public class JavaScriptInterface {

您调用了您的界面类 JavaScriptInterface，但创建了一个新的 WebAppInterface 以传递给 WebView。

编辑

以上答案仍然成立:您永远不会向 WebView 注册接口(interface) (JavaScriptInterface)，因此您将无法访问这些方法 (scanBarcode)。

由于你的WebView中实际上需要两个接口(interface)，所以你需要添加这两个接口(interface)

myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
myWebView.addJavascriptInterface(new JavaScriptInterface(this), "Scanner");

在您的 javascript 中，您将有两个对象 Android 和 Scanner，它们对应于两个接口(interface)。 Android 将拥有 WebAppInterface 中定义的所有方法，而 Scanner 将拥有 JavaScriptInterface 中定义的方法。你的 javascript 函数变成了

function scanner() {
    Scanner.scanBarcode();
}

编辑2

如果您的目标是 sdk 版本 17 或更高版本，您还必须在您的 javascript 中注释您要使用的方法

public class JavaScriptInterface {
...
    @JavascriptInterface
    public void scanBarcode() {
    ...
    }
}

奖励:一些不请自来的建议，使用更好的名字。如果 WebAppInterface 提供了与您的应用程序数据交互的方法，请将其称为 DataInterface(即使这样可能太笼统了，但我不知道您的应用程序使用哪种数据)。由于 JavaScriptInterface 启动扫描器并关闭应用程序，也许您可​​以将其称为 ActionInterface。将它们作为“AppData”和“AppActions”传递给您的 WebView 可为您提供 AppData.getCategories() 和 AppActions.closeMyActivity() 等功能，这些功能更符合逻辑。